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}`
# JS
# 语法
# Syntax