JavaScript Syntax

 

2024-02-18

变量

1
var num; // undefined
2
let num1, num2; // 声明多个变量

注:let 为 ES6 新增。

常量

1
const num = 42

虽然 const 关键字限定了栈上的内容不可编辑,但堆上的内容可以编辑,因此对于引用类型来说,要使堆上的内容不可编辑,需要额外使用 readonly 关键字:

1
const object1 = { property1: 1 };
2
const array1 = ["a", "b", "c"]
3
object1.property1 = 2;
4
array1[1] = "x";

注:const 为 ES6 新增。

命名

  • 可以以任意 Unicode 字母(含中文),以及美元符号($)和下划线(_)开头。
  • 非开头可以使用数字

注释

1
// 单行注释由两个左斜杆组成
2
3
/* 多行注释
4
由星号和左斜杆组成 */

JavaScript 同样支持 HTML 风格注释

<!-- HTML 风格注释 JS 版本

运算符

赋值

  • 赋值:=
  • 先加后赋值:+=
  • 先减后赋值:-=
  • 先乘后赋值:*=
  • 先除后赋值:/=

算术运算符

  • 加减乘除:+, -, *, /
  • 取模(余数):%
  • 取幂:**
  • 自增:++
  • 自减:--

自增和自检用在变量前是返回自增之后的值,用在变量之后将返回自增前的值。

字符串运算符

  • 连接两边的字符串:+
  • 拼接字符串后在赋值给左侧变量:+=

比较运算符

  • 相等和不等:== !=
  • 绝对相等和不等:=== !==
  • 大于和小于:> <
  • 大于或等于:>=
  • 小于或等于:<=

===!== 除了比较值之外,还对类型进行比较。

一元运算符

  • -:负号
  • +:加号,连接运算符
  • typeof:(typeof num) // 输出:number
  • instanceof:判断对象是否是指定的类型,obj instanceof number

    (类似 Python built-in-functions#isinstance()|isinstance() 方法)

三元运算符

  • condition ? expr1 : expr2
    • expr1:condition 为 True 时执行
    • expr2:condition 为 False 时执行

逻辑运算符

  • and:&&
  • or:||
  • not:!

类型运算符

  • 返回变量类型:typeof
  • 检查变量是否为指定类型:instanceof

流程控制

条件语句

if

1
const count = 42;
2
3
// 单行
4
if (count == 42) console.log("42")
5
6
if (count == 3){
7
// count 是 3 时执行
8
} else if (count == 4){
9
// count 是 4 时执行,可以有多个
10
} else {
11
// 其他情况下执行
12
}

switch

当执行语句有多行时,可以使用花括号标记范围,另外每个语句最后如果没有 break 语句,则会继续执行。

1
let today = 6
2
3
switch (today) {
4
case 1:
5
console.log("星期一");
6
break;
7
case 2:
8
console.log("星期二");
9
break;
10
case 6: {
11
console.log("星期六");
12
console.log("今天是休息日");
13
}
14
break;
15
case 7: {
16
console.log("星期日");
17
console.log("今天是休息日");
18
}
19
break;
20
}

另外 switch 语句中可以使用 default 关键字设定一个默认分支:

1
let today = 996;
2
switch (today) {
3
case 1:
4
case 2:
5
case 3:
6
case 4:
7
case 5:
8
console.log("工作日");
9
break;
10
case 6:
11
case 7:
12
console.log("休息日");
13
break;
14
default:
15
console.log("此星期不存在!");
16
break;
17
}

循环语句

  • break:跳出循环;
  • continue:跳过当前循环

for 循环

1
for (初始化语句; 条件; 递增表达式)
2
语句
3
4
// 或者
5
for (let i = 0; i < 5; i++){
6
console.log('i 当前为:' + i);
7
}
  • 初始化:初始值,在循环开始之前执行的代码;
  • 条件:每轮循环开始都执行一次,为 true 才继续;
  • 递增语句:循环的最后一个操作,通常用于递增变量

初始化语句和递增表达式都可以省略:

1
let i = 0
2
for (; i < 4; ) {
3
i++;
4
}

所有 for 循环都可以改成 while 循环。

while 循环

1
// 单行
2
while (true) console.log('无限循环');
3
4
while (true) {
5
// 无限循环
6
}
7
8
let i = 0;
9
while (i < 100) {
10
console.log('i 当前为:' + i);
11
i = i + 1;
12
}

do while 循环

do while 是 #while 循环的变体,循环至少会执行一次。

1
do {
2
console.log("executed!"); //输出"executed!"
3
}
4
while (false);

数据类型

  • 原始类型:
    • boolean:布尔值
    • number
    • bigint
    • string
    • any
    • unknown
    • never
  • 引用类型(复合)
    • array:数组
    • tuple:元组
    • function:函数
    • object:对象
    • class:类型
  • 进阶类型
    • 泛型
    • 类型别名
    • 联合类型
    • 交叉类型

  • 联合类型写法:string | number

原始数据类型

通常,数值、字符串、布尔值这三种类型,合称为原始类型(primitive type)的值,即它们是最基本的数据类型,不能再细分了。对象则称为合成类型(complex type)的值,因为一个对象往往是多个原始类型的值的合成,可以看作是一个存放各种值的容器。至于undefined和null,一般将它们看成两个特殊值。

TS 原始数据类型为 JS 的小写形式:

原始数据类型JavaScriptTypeScript
字符串Stringstring
数值Numbernumber
布尔值Booleanboolean
大整数BigIntbigint
符号Symbolsymbol
不存在Nullnull
未定义Undefinedundefined
1
// 字符串
2
const str: string = 'Hello'
3
// 字符串类型推导
4
const str = 'Hello'

ES6 新增两种类型:

  • BigInt
  • Symbol

TS 独有的三种特殊类型:

  • any
  • unknown
  • never

字符串

字符串拼接的几种方式:

1
// 反引号
2
const number = 42
3
const luckyNumber = `我的幸运数字:${number}`