变量

ECMAScript 变量是松散类型的，意思是变量可以用于保存任何类型的数据。每个变量只不过是一个用于保存任意值的命名占位符。有 3 个关键字可以声明变量：var、const 和 let。其中，var 在 ECMAScript 的所有版本中都可以使用，而 const 和 let 只能在 ECMAScript 6 及更晚的版本中使用。

var 关键字

定义变量 var message; 不初始化的情况下会保存 undefined。因为 js 是动态类型语言当 var message = 'hi'; 此时 message 赋值字符串类型，后期可以修改为 message = 100; 也就是数值类型。

var 声明作用域

使用 var 操作符定义的变量会成为包含它的函数的局部变量。比如，使用 var 在一个函数内部定义一个变量，就意味着该变量将在函数退出时被销毁：

function test() {

var message = "hi"; // 局部变量

}

test();

console.log(message); // 出错！

出错是因为 message 是 test 函数内定义，message 的作用域也仅限于函数内，在函数外使用会报错。不过，在函数内定义变量时省略 var 操作符，可以创建一个全局变量：

function test() {

message = "hi"; // 全局变量

}

test();

console.log(message); // "hi"

去掉之前的 var 操作符之后，message 就变成了全局变量。只要调用一次函数 test()，就会定义这个变量，并且可以在函数外部访问到。

注意虽然可以通过省略 var 操作符定义全局变量，但不推荐这么做。在局部作用域中定义的全局变量很难维护，也会造成困惑。这是因为不能一下子断定省略 var 是不是有意而为之。在严格模式下，如果像这样给未声明的变量赋值，则会导致抛出 ReferenceError。

如果需要定义多个变量可以通过逗号隔开：

var message = "hi",

found = false,

age = 29;

var 声明提升

在使用 var 时，定义 var 变量前去使用 var 变量不会报错，这是因为关键字声明的变量自动提升到函数作用域顶部，例如：

function foo() {

console.log(age);

var age = 26;

} foo(); // undefined

之所以不会报错，是因为 ECMAScript 运行时把它看成等价于如下代码：

function foo() {

var age;

console.log(age);

age = 26;

}

foo(); // undefined

当然反复声明同一个变量也没有问题，会使用最后一个。

let 声明

let 和 var 作用差不多，但是有着非常重要要的区别。最明显的就是 let 时块作用域而 var 是函数作用域。

if (true) {

var name = 'Matt';

console.log(name); // Matt

}

console.log(name); // Matt

if (true) {

let age = 26;

console.log(age); // 26

}

console.log(age); // ReferenceError: age 没有定义

在这里，age 变量之所以不能在 if 块外部被引用，是因为它的作用域仅限于该块内部。块作用域是函数作用域的子集，因此适用于 var 的作用域限制同样也适用于 let。

并且 let 不允许同一个块作用域中出现冗余声明。这样会导致报错。

暂时性死区

let 和 var 的另一个重要区别在于 let 声明的变量不会在作用域中被提升。

// name 会被提升

console.log(name); // undefined

var name = 'Matt';

// age 不会被提升

console.log(age); // ReferenceError：age 没有定义

let age = 26;

在解析代码时，JavaScript 引擎也会注意出现在块后面的 let 声明，只不过在此之前不能以任何方式来引用未声明的变量。在 let 声明之前的执行瞬间被称为“暂时性死区”（temporal dead zone），在此阶段引用任何后面才声明的变量都会抛出 ReferenceError。

全局声明

与 var 不同，let 在全局作用域声明不会变成 window 对象的属性。

var name = 'Matt';

console.log(window.name); // 'Matt'

let age = 26;

console.log(window.age); // undefined

不过，let 声明仍然是在全局作用域中发生的，相应变量会在页面的生命周期内存续。因此，为了避免 SyntaxError，必须确保页面不会重复声明同一个变量。

条件声明

在使用 var 声明变量时，由于声明会被提升，JavaScript 引擎会自动将多余的声明在作用域顶部合并为一个声明。因为 let 的作用域是块，所以不可能检查前面是否已经使用 let 声明过同名变量，同时也就不可能在没有声明的情况下声明它。

使用 try/catch 语句或 typeof 操作符也不能解决，因为条件块中 let 声明的作用域仅限于该块。

为此，对于 let 这个新的 ES6 声明关键字，不能依赖条件声明模式。注意不能使用 let 进行条件式声明是件好事，因为条件声明是一种反模式，它让程序变得更难理解。如果你发现自己在使用这个模式，那一定有更好的替代方式。

for 循环中的 let 声明

在 let 出现之前，for 循环定义的迭代变量会渗透到循环体外部：

for (var i = 0; i < 5; ++i) {

// 循环逻辑

}

console.log(i); // 5

改成使用 let 之后，这个问题就消失了，因为迭代变量的作用域仅限于 for 循环块内部：

for (let i = 0; i < 5; ++i) {

// 循环逻辑

}

console.log(i); // ReferenceError: i 没有定义

在使用 var 的时候，最常见的问题就是对迭代变量的奇特声明和修改：

for (var i = 0; i < 5; ++i) {

setTimeout(() => console.log(i), 0)

}

// 你可能以为会输出 0、1、2、3、4

// 实际上会输出 5、5、5、5、5

之所以会这样，是因为在退出循环时，迭代变量保存的是导致循环退出的值：5。在之后执行超时逻辑时，所有的 i 都是同一个变量，因而输出的都是同一个最终值。而在使用 let 声明迭代变量时，JavaScript 引擎在后台会为每个迭代循环声明一个新的迭代变量。每个 setTimeout 引用的都是不同的变量实例，所以 console.log 输出的是我们期望的值，也就是循环执行过程中每个迭代变量的值。

for (let i = 0; i < 5; ++i) {

setTimeout(() => console.log(i), 0)

}

// 会输出 0、1、2、3、4

这种每次迭代声明一个独立变量实例的行为适用于所有风格的 for 循环，包括 for-in 和 for-of 循环。

const 声明

const 的行为与 let 相似，区别在于 const 在声明的同时必须初始化变量，并且不能修改，修改会导致错误；不允许重复赋值。

const 声明的限制只适用于它指向的变量的引用。换句话说，如果 const 变量引用的是一个对象，那么修改这个对象内部的属性并不违反 const 的限制。

const person = {};

person.name = 'Matt'; // ok

JavaScript 引擎会为 for 循环中的 let 声明分别创建独立的变量实例，虽然 const 变量跟 let 变量很相似，但是不能用 const 来声明迭代变量（因为迭代变量会自增）：

for (const i = 0; i < 10; ++i) {} // TypeError：给常量赋值

不过，如果你只想用 const 声明一个不会被修改的 for 循环变量，那也是可以的。也就是说，每次迭代只是创建一个新变量。这对 for-of 和 for-in 循环特别有意义：

let i = 0;

for (const j = 7; i < 5; ++i) {

console.log(j);

}

// 7, 7, 7, 7, 7

for (const key in {a: 1, b: 2}) {

console.log(key);

}

// a, b

for (const value of [1,2,3,4,5]) {

console.log(value);

}

// 1, 2, 3, 4, 5

声明风格及最佳实践

ECMAScript 6 增加 let 和 const 从客观上为这门语言更精确地声明作用域和语义提供了更好的支持。行为怪异的 var 所造成的各种问题，已经让 JavaScript 社区为之苦恼了很多年。随着这两个新关键字的出现，新的有助于提升代码质量的最佳实践也逐渐显现。

不使用 var有了 let 和 const，大多数开发者会发现自己不再需要 var 了。限制自己只使用 let 和 const有助于提升代码质量，因为变量有了明确的作用域、声明位置，以及不变的值。
const 优先，let 次之使用 const 声明可以让浏览器运行时强制保持变量不变，也可以让静态代码分析工具提前发现不合法的赋值操作。因此，很多开发者认为应该优先使用 const 来声明变量，只在提前知道未来会有修改时，再使用 let。这样可以让开发者更有信心地推断某些变量的值永远不会变，同时也能迅速发现因意外赋值导致的非预期行为。

数据类型

ECMAScript 有 6 种简单数据类型（也称为原始类型）：Undefined、Null、Boolean、Number、String 、Symbol 和 BigInt(可以安全地存储和操作大整数，甚至可以超过数字的安全整数限制)。还有一种复杂数据类型 Object，Object 是一种无序名值对的集合。因为在 ECMAScript 中不能定义自己的数据类型，所有值都可以用上述 8 种数据类型之一来表示。只有 8 种数据类型似乎不足以表示全部数据。但 ECMAScript 的数据类型很灵活，一种数据类型可以当作多种数据类型来使用。

typeof 操作符

因为 ECMAScript 是松散的，需要一些手段来确定任意变量，typeof 就是为此而生，例如：

"undefined"表示值未定义；

"boolean"表示值为布尔值；

"string"表示值为字符串；

"number"表示值为数值；

"object"表示值为对象（而不是函数）或 null；

"function"表示值为函数；

"symbol"表示值为符号。

"bigint" 表示大整数，末尾会有个 n，不适合运算

下面是使用 typeof 操作符的例子：

let message = "some string";

console.log(typeof message); // "string"

console.log(typeof(message)); // "string"

console.log(typeof 95);

注意 typeof 在某些情况下返回的结果可能会让人费解，但技术上讲还是正确的。比如，调用 typeof null 返回的是"object"。这是因为特殊值 null 被认为是一个对空对象的引用。注意严格来讲，函数在 ECMAScript 中被认为是对象，并不代表一种数据类型。可是，函数也有自己特殊的属性。为此，就有必要通过 typeof 操作符来区分函数和其他对象。

Undefined 类型

Undefined 类型只有一个值，就是特殊值 undefined。当使用 var 或 let 声明了变量但没有初始化时，就相当于给变量赋予了 undefined 值：

let message;

console.log(message) // undefined

Null 类型

Null 类型只有一个值就是 null。逻辑上 null 值表示一个空对象指针所以 typeof null 值为 object。所以我们想要初始化对象的值时可以使用 null，这样只需检查这个值是是不是 null 就可以知道变量是否重新赋予了其他对象的引用。

undefined 值是由 null 值派生而来的，因此 ECMA-262 将它们定义为表面上相等，如下面的例子所示：

console.log(null == undefined); // true

Boolean 类型

Boolean 类型有两个值，true 和 false。如果希望让其他值转换为 Boolean 可以使用 Boolean()。

Number 类型

Number 类型就是数值类型，可以表示整数和浮点数，不同的数值类型相应地也有不同的数值字面量格式。最基本的字面量格式是十进制：

let intNum = 55;

也可以使用八进制

let octalNum1 = 070; // 八进制 56

注意：八进制在严格模式下是无效的，因为 ECMAScript 2015 或 ES6 中的八进制值通过前缀 0o 来表示；严格模式下，前缀 0 会被视为语法错误，如果要表示八进制值，应该使用前缀 0o。

浮点值

定义浮点值必须包含小数点，例如：

let floatNum1 = 1.1;

let floatNum2 = 0.1;

let floatNum3 = .1; // 有效，但不推荐

为存储浮点值使用的内存空间是存储整数值的两倍，所以 ECMAScript 总是想方设法把值转换为整数。

let floatNum1 = 1.; // 小数点后面没有数字，当成整数 1 处理

let floatNum2 = 10.0; // 小数点后面是零，当成整数 10 处理

浮点值的精确度最高可达 17 位小数，但在算术计算中远不如整数精确。例如，0.1 加 0.2 得到的不是 0.3，而是 0.300 000 000 000 000 04。由于这种微小的舍入错误，导致很难测试特定的浮点值。比如下面的例子：

if (a + b == 0.3) { // 别这么干！

console.log("You got 0.3.");

}

这里检测两个数值之和是否等于 0.3。如果两个数值分别是 0.05 和 0.25，或者 0.15 和 0.15，那没问题。但如果是 0.1 和 0.2，如前所述，测试将失败。因此永远不要测试某个特定的浮点值。

注意之所以存在这种舍入错误，是因为使用了 IEEE 754 数值，这种错误并非 ECMAScript 所独有。其他使用相同格式的语言也有这个问题。

值的范围

由于内存的限制，ECMAScript 并不支持表示这个世界上的所有数值。ECMAScript 可以表示的最小数值保存在 Number.MIN_VALUE 中，这个值在多数浏览器中是 5e324；可以表示的最大数值保存在 Number.MAX_VALUE 中，这个值在多数浏览器中是 1.797 693 134 862 315 7e+308。如果某个计算得到的数值结果超出了 JavaScript 可以表示的范围，那么这个数值会被自动转换为一个特殊的 Infinity（无穷）值。任何无法表示的负数以-Infinity（负无穷大）表示，任何无法表示的正数以 Infinity（正无穷大）表示。

NaN

NaN 是特殊的数值，意思是不是数值(Not a Number)，用于表示本来要返回数值的操作失败了，而不是抛出错误。比如：

console.log(0/0); // NaN

console.log(-0/+0); // NaN

NaN 有几个独特的属性。首先任何涉及 NaN 的操作始终返回 NaN(除了 + string 的操作)，其次 NaN 不等于任何值包括自己。

console.log(NaN == NaN); // false

如果我们想要知道一个变量是否等于 NaN 可以使用 isNaN，把一个值传给 isNaN()后，该函数会尝试把它转换为数值。某些非数值的值可以直接转换成数值，如字符串"10"或布尔值。任何不能转换为数值的值都会导致这个函数返回 true。

console.log(isNaN(NaN)); // true

console.log(isNaN("blue")); // true，不可以转换为数值

数值转换

有三个函数可以将非数值转换为数值：Number()、parseInt()和 parseFloat()。区别在于 Number()是转型函数，可用于任何数据类型，后两个主要用于字符串转换为数值。

Number()函数基于如下规则：

Boolean：true 转换为 1，false 转换为 0。
Number：直接返回。
Null：返回 0。
Undefined：返回 0。
String：如果字符串包含数值，包括数值字符前面带加减号的清空，转换为十进制数值：Number("1")返回 1，Number("012")返回 12(忽略前面的 0)。如果字符串包含有效的浮点值格式，则返回相应的浮点值(同样忽略前面的)。如果字符串包含有效的十六进制格式如"0xf"，则会转换为与该十六进制值对应的十进制整数值。如果是空字符串返回 0。不包含以上情况返回 NaN。 Object：调用 valueOf()方法，并按照上述规则转换返回的值。如果转换结果是 NaN，则调用 toString()方法，再按照转换字符串的规则转换。

parseInt()更专注于对 String 转换成 Number。主要逻辑是字符串最前面空格会被会略，从第一个非空格字符串开始转换。如果第一个非空格字符串不是数值或+-则直接返回 NaN，这一点跟 Number()是不一样的，如果是第一个非空格字符串为数值或+-，则继续依次检测每一个字符，直到遇到非数值字符。

parseInt("a123") // NaN

parseInt("123a") // 123

parseInt() 有第二个参数是指定进制数，比如：

let num = parseInt("0xAF", 16); // 175

parseFloat()和 parseInt()类似，但是 parseFloat 遇到第一个小数点不会停，遇到第二个才会停。parseFloat()只解析十进制。

String 类型

原文：JavaScript 高级程序设计(第四版)