ECMAScript 6 入门

简单记录 ECMAScript 6 的几种新特性

 

ES6 一共有 5 种方法能够遍历对象的属性。

（1）for...in

for...in循环遍历对象自身的和继承的可枚举属性（不含 Symbol 属性）。

（2）Object.keys(obj)

Object.keys返回一个数组，包括对象自身的（不含继承的）全部可枚举属性（不含 Symbol 属性）。

（3）Object.getOwnPropertyNames(obj)

Object.getOwnPropertyNames返回一个数组，包含对象自身的全部属性（不含 Symbol 属性，可是包括不可枚举属性）。

（4）Object.getOwnPropertySymbols(obj)

Object.getOwnPropertySymbols返回一个数组，包含对象自身的全部 Symbol 属性。

（5）Reflect.ownKeys(obj)

Reflect.ownKeys返回一个数组，包含对象自身的全部属性，无论是属性名是 Symbol 或字符串，也无论是否可枚举。

以上的 5 种方法遍历对象的属性，都遵照一样的属性遍历的次序规则。

• 首先遍历全部属性名为数值的属性，按照数字排序。
• 其次遍历全部属性名为字符串的属性，按照生成时间排序。
• 最后遍历全部属性名为 Symbol 值的属性，按照生成时间排序。

 

参考：http://es6.ruanyifeng.com/#docs/object#属性的遍历

 

ES6 共有 6 种方法能够表示一个字符。

 

'\z' === 'z'  // true
'\172' === 'z' // true
'\x7A' === 'z' // true
'\u007A' === 'z' // true
'\u{7A}' === 'z' // true

参考：http://es6.ruanyifeng.com/#docs/string

 

ES6 引入了模板字符串

• 模板字符串（template string）是加强版的字符串，用反引号（`）标识。
• 若是在模板字符串中须要使用反引号，则前面要用反斜杠转义。
• {} 内能够放入任意的 JavaScript 表达式，能够进行运算。
• {} 还能够调用函数。

// 普通字符串 `In JavaScript '\n' is a line-feed.`  // 多行字符串。换行保留，若是不想换行，使用 trim 消除 `In JavaScript this is not legal.`

`this is no \n`.trim()

 console.log(`string text line 1 string text line 2`);  // 字符串中嵌入变量 var name = "Bob", time = "today"; `Hello ${name}, how are you ${time}?`

参考：http://es6.ruanyifeng.com/#docs/string#模板字符串


ES 6 正则表达式

ES6 对正则表达式添加了u修饰符，含义为 “Unicode 模式”，用来正确处理大于\uFFFF的 Unicode 字符。也就是说，会正确处理四个字节的 UTF-16 编码。
u\uFFFF

/^\uD83D/u.test('\uD83D\uDC2A') // false
/^\uD83D/.test('\uD83D\uDC2A') // true

参考：http://es6.ruanyifeng.com/#docs/regex#u修饰符

ES6 还为正则表达式添加了y修饰符，叫作 “粘连”（sticky）修饰符。
y

var s = 'aaa_aa_a'; var r1 = /a+/g; var r2 = /a+/y; r1.exec(s) // ["aaa"]
r2.exec(s) // ["aaa"]
 r1.exec(s) // ["aa"]
r2.exec(s) // null

参考：http://es6.ruanyifeng.com/#docs/regex#y修饰符

 

 ES 6 数值的扩展

• ES6 提供了二进制和八进制数值的新的写法，分别用前缀 0b（或0B）和 0o（或0O）表示。

• ES6 在 Number 对象上，新提供了 Number.isFinite() 和 Number.isNaN() 两个方法。它们与传统的全局方法isFinite()和isNaN()的区别在于，传统方法先调用Number()将非数值的值转为数值，再进行判断，而这两个新方法只对数值有效，非数值一概返回false。

Number.isFinite(15); // true Number.isFinite(0.8); // true Number.isFinite(NaN); // false Number.isFinite(Infinity); // false Number.isFinite(-Infinity); // false Number.isFinite('foo'); // false Number.isFinite('15'); // false Number.isFinite(true); // false

Number.isNaN(NaN) // true Number.isNaN(15) // false Number.isNaN('15') // false Number.isNaN(true) // false Number.isNaN(9/NaN) // true Number.isNaN('true'/0) // true Number.isNaN('true'/'true') // true

• ES6 将全局方法parseInt()和parseFloat()，移植到 Number 对象上面，行为彻底保持不变。

• ES6 在 Number 对象上面，新增一个极小的常量Number.EPSILON。检查浮点数的偏差范围。

Number.EPSILON // 2.220446049250313e-16 Number.EPSILON.toFixed(20) // '0.00000000000000022204'

0.1 + 0.2 // 0.30000000000000004 0.1 + 0.2 - 0.3 // 5.551115123125783e-17 5.551115123125783e-17.toFixed(20) // '0.00000000000000005551'

5.551115123125783e-17 < Number.EPSILON // true

• 9007199254740993 === 9007199254740992

JavaScript 可以准确表示的整数范围在-2^53到2^53之间（不含两个端点），超过这个范围，没法精确表示这个值。

 

ES6 引入了Number.MAX_SAFE_INTEGER和Number.MIN_SAFE_INTEGER这两个常量，用来表示这个范围的上下限。

 

Number.MAX_SAFE_INTEGER === Math.pow(2, 53) - 1 // true Number.MAX_SAFE_INTEGER === 9007199254740991 // true Number.MIN_SAFE_INTEGER === -Number.MAX_SAFE_INTEGER // true Number.MIN_SAFE_INTEGER === -9007199254740991 // true

 

• Math 对象的扩展

1. Math.trunc() 方法用于去除一个数的小数部分，返回整数部分。
2. Math.sign() 方法用来判断一个数究竟是正数、负数、仍是零。
3. Math.cbrt() 方法用于计算一个数的立方根。
4. Math.clz32() 方法返回一个数的 32 位无符号整数形式有多少个前导 0。对于小数，Math.clz32() 方法只考虑整数部分。
5. Math.imul() 方法返回两个数以 32 位带符号整数形式相乘的结果，返回的也是一个 32 位的带符号整数。参考：http://es6.ruanyifeng.com/#docs/number#Math-imul
6. Math.fround() 方法返回一个数的单精度浮点数形式。
7. Math.hypot() 方法返回全部参数的平方和的平方根。
8. Math.expm1(x) 返回 ex - 1，即Math.exp(x) - 1。
9. Math.log1p(x)方法返回1 + x的天然对数，即Math.log(1 + x)。若是x小于 - 1，返回NaN。
10. Math.log10(x)返回以 10 为底的x的对数。若是x小于 0，则返回 NaN。
11. Math.log2(x)返回以 2 为底的x的对数。若是x小于 0，则返回 NaN。
12. Math.sinh(x) 返回x的双曲正弦（hyperbolic sine）
13. Math.cosh(x) 返回x的双曲余弦（hyperbolic cosine）
14. Math.tanh(x) 返回x的双曲正切（hyperbolic tangent）
15. Math.asinh(x) 返回x的反双曲正弦（inverse hyperbolic sine）
16. Math.acosh(x) 返回x的反双曲余弦（inverse hyperbolic cosine）
17. Math.atanh(x) 返回x的反双曲正切（inverse hyperbolic tangent）

• ES7 新增了一个指数运算符（**）

2 ** 2 // 4 2 ** 3 // 8

 

参考：http://es6.ruanyifeng.com/#docs/number

 

数组实例的entries()，keys()和values()

 

ES6 提供三个新的方法——entries()，keys()和values()——用于遍历数组。它们都返回一个遍历器对象（详见《Iterator》一章），能够用for...of循环进行遍历，惟一的区别是keys()是对键名的遍历、values()是对键值的遍历，entries()是对键值对的遍历。

 

for (let index of ['a', 'b'].keys()) { console.log(index); } // 0 // 1

for (let elem of ['a', 'b'].values()) { console.log(elem); } // 'a' // 'b'

for (let [index, elem] of ['a', 'b'].entries()) { console.log(index, elem); } // 0 "a" // 1 "b"

 

 

参考：http://es6.ruanyifeng.com/#docs/array#数组实例的entries，keys和values

 

箭头函数有几个使用注意点。

 

（1）函数体内的this对象，就是定义时所在的对象，而不是使用时所在的对象。

（2）不能够看成构造函数，也就是说，不可使用new命令，不然会抛出一个错误。

（3）不可使用arguments对象，该对象在函数体内不存在。若是要用，能够用 Rest 参数代替。

（4）不可使用yield命令，所以箭头函数不能用做 Generator 函数。

 

参考：http://es6.ruanyifeng.com/#docs/function#使用注意点