ES6学习笔记17:其他特性

可继承内置类型

1
2
3
4
5
6
7
// 继承Array类型
class MyArray extends Array {
constructor(...args) { super(...args); }
}
var arr = new MyArray();
arr[1] = 12;
arr.length == 2

注意根据Babel官网,继承内置类型的编译只支持部分功能,比如DOM节点的继承可以通过Babel实现,但继承Array,Date,Error则由于ES5引擎限制,是无法实现的。

二进制和八进制字面量

ES6支持二进制(Binary)和八进制(Octal)的字面量。

使用二进制时,加前缀0b,使用八进制时,加前缀0o。

1
2
0b111110111 === 503 // true
0o767 === 503 // true

新增的API

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
Number.EPSILON
Number.isInteger(Infinity) // false
Number.isNaN('NaN') // false
Math.acosh(3) // 1.762747174039086
Math.hypot(3, 4) // 5
Math.imul(Math.pow(2, 32) - 1, Math.pow(2, 32) - 2) // 2
'abcde'.includes('cd') // true
'abc'.repeat(3) // 'abcabcabc'
Array.from(document.querySelectorAll('*')) // Returns a real Array
Array.of(1, 2, 3) // Similar to new Array(...), but without special one-arg behavior
[0, 0, 0].fill(7, 1) // [0,7,7]
[1,2,3].findIndex(x => x == 2) // 1
['a', 'b', 'c'].entries() // iterator [0, 'a'], [1, 'b'], [2, 'c']
['a', 'b', 'c'].keys() // iterator 0, 1, 2
['a', 'b', 'c'].values() // iterator 'a', 'b', 'c'
Object.assign(Point, { origin: new Point(0,0) })

注意根据Babel官网,Babel只实现了部分新的API。

Reflect API

Reflect顾名思义为反射。反射允许对对象进行运行时级别的元操作。这个在实现代理的时候尤其有用。

1
2
3
4
5
6
7
8
9
var O = {a: 1};
Object.defineProperty(O, 'b', {value: 2});
O[Symbol('c')] = 3;
Reflect.ownKeys(O); // ['a', 'b', Symbol(c)]
function C(a, b){
this.c = a + b;
}
var instance = Reflect.construct(C, [20, 22]);
instance.c; // 42

Reflect.ownKeys()返回对象中自有属性属性名的数组。

静态方法Reflect.construct()效果和new关键字一样,他等价于调用new target(…args)

更多方法请查阅Reflect - MDN

尾调用优化

尾调用优化(Tail Call Optimization)保证了栈不会无限制地增长,很多递归算法都可以安全实现。

1
2
3
4
5
6
7
function factorial(n, acc = 1) {
"use strict";
if (n <= 1) return acc;
return factorial(n - 1, n * acc);
}
// 其他语言大多数时候已经栈溢出了,但在ES6中安全。
factorial(100000)

出于编译性能和复杂性考虑(目前实现仍有bug),Babel暂时将尾调用优化特性移除。

知识点总结

  1. 知道DOM节点,Array,Date,Error等内置类型可继承,知道Babel的局限性;
  2. 了解二进制八进制字面量的基本用法;
  3. 在实际使用过程中不断熟练应用API,知道去MDN查相关文档;
  4. 知道ES6中有Reflect机制;
  5. 知道ES6中对递归函数调用进行了优化而不需要担心递归调用太深导致栈溢出问题。

参考

  1. BabelJS - Learn ES2015
  2. Mozilla Developer Network
  3. Reflect - MDN