ES6学习笔记2—各扩展

时间 2019-11-08

原文原文链接

字符串的扩展

字符的 Unicode 表示法

JavaScript 容许采用\uxxxx形式表示一个字符，其中xxxx表示字符的 Unicode 码点。这种表示法只限于码点在\u0000~\uFFFF之间的字符。超出这个范围的字符，必须用两个双字节的形式表示。ES6中只要将码点放入大括号，就能正确解读该字符。git

"\uD842\uDFB7"
// "?"

"\u{20BB7}"
// "?"

大括号表示法与 UTF-16 编码是等价的。es6

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

字符串方法

JavaScript内部，字符以UTF-16的格式储存，每一个字符固定为2个字节。对于那些须要4个字节储存的字符（Unicode码点大于0xFFFF的字符），JavaScript会认为它们是两个字符，字符串长度会误判为2。github

var s = "?";

s.length // 2
s.charAt(0) // ''
s.charAt(1) // ''
s.charCodeAt(0) // 55362
s.charCodeAt(1) // 57271
s.codePointAt(0) // 134071  codePointAt方法在第一个字符上，正确地识别了“?”
s.codePointAt(1) // 57271   第二个字符是“?”的后两个字节
String.fromCharCode(0x20BB7) // "ஷ" 最高位2被舍弃了，最后返回码点U+0BB7对应的字符，而不是码点U+20BB7对应的字符。
String.fromCodePoint(0x20BB7) // "?"
'?'.at(0) // "?"

对于Unicode码点大于0xFFFF的字符：正则表达式

charAt：没法读取整个字符。该方法不能识别码点大于0xFFFF的字符。数组
charCodeAt：只能分别返回前两个字节和后两个字节的值。浏览器
fromCharCode：不能识别大于0xFFFF的码点。安全
codePointAt：可以正确处理4个字节储存的字符，返回一个字符的码点。codePointAt方法是测试一个字符由两个字节仍是由四个字节组成的最简单方法。数据结构
fromCodePoint：能够识别0xFFFF的字符。app
at: 能够识别Unicode编号大于0xFFFF的字符，返回正确的字符。这个方法能够经过垫片库实现。ide

注意，fromCodePoint方法定义在String对象上，而codePointAt方法定义在字符串的实例对象上。

其余方法

normalize():用来将字符的不一样表示方法统一为一样的形式
includes()：返回布尔值，表示是否找到了参数字符串。
startsWith()：返回布尔值，表示参数字符串是否在源字符串的头部。
endsWith()：返回布尔值，表示参数字符串是否在源字符串的尾部。
padStart()：用于头部补全。常见用途是为数值补全指定位数和提示字符串格式。
```
'1'.padStart(10, '0') // "0000000001"
'12'.padStart(10, 'YYYY-MM-DD') // "YYYY-MM-12"
```
padEnd()：用于尾部补全。

repeat():返回一个新字符串，表示将原字符串重复n次。参数若是是小数，会被取整。

参数是负数或者Infinity，会报错。
参数是0到-1之间的小数，则等同于0，这是由于会先进行取整运算。
参数0到-1之间的小数，取整之后等于-0，repeat视同为0。
参数NaN等同于0。
repeat的参数是字符串，则会先转换成数字。

'na'.repeat(2.9) // "nana"
'na'.repeat(Infinity)// RangeError
'na'.repeat(NaN) // ""
'na'.repeat('na') // ""
'na'.repeat('3') // "nanana"

字符串的遍历器接口

ES6为字符串添加了遍历器接口（详见《Iterator》一章），使得字符串能够被for...of循环遍历。该遍历能够识别大于0xFFFF的码点，传统的for循环没法识别这样的码点。

var text = String.fromCodePoint(0x20BB7);

for (let i = 0; i < text.length; i++) {
  console.log(text[i]);
}
// " "
// " "
//for循环会认为它包含两个字符（都不可打印）
for (let i of text) {
  console.log(i);
}
// "?"
//for...of循环会正确识别出这一个字符

模板字符串

模板字符串用反引号（`）标识。它能够看成普通字符串使用，也能够用来定义多行字符串，或者在字符串中嵌入变量。在模板字符串中须要使用反引号，则前面要用反斜杠转义。使用模板字符串表示多行字符串，全部的空格和缩进都会被保留在输出之中。

// 普通字符串
`In JavaScript '\n' is a line-feed.`

// 多行字符串
`In JavaScript this is
 not legal.`

// 字符串中嵌入变量
`Hello ${name}, how are you ${time}?`

模板字符串中嵌入变量，须要将变量名写在${}之中。大括号内部能够放入任意的JavaScript表达式，能够进行运算，以及引用对象属性和调用函数。若是大括号中的值不是字符串，将按照通常的规则转为字符串。好比，大括号中是一个对象，将默认调用对象的toString方法。
若是模板字符串中的变量没有声明，将报错。

// 变量place没有声明
var msg = `Hello, ${place}`;
// 报错

因为模板字符串的大括号内部，就是执行JavaScript代码，所以若是大括号内部是一个字符串，将会原样输出。

`Hello ${'World'}`
// "Hello World"

标签模板

模板字符串紧跟在一个函数名后面,该函数将被调用来处理这个模板字符串。即模板字符串就是该函数的参数。标签模板是函数调用的一种特殊形式。“标签”指的就是函数，紧跟在后面的模板字符串就是它的参数。

//模板字符里面有变量,会将模板字符串先处理成多个参数，再调用函数。
var a = 5;
var b = 10;

tag`Hello ${ a + b } world ${ a * b }`;
// 等同于
tag(['Hello ', ' world ', ''], 15, 50);

模板处理函数的第一个参数（模板字符串数组），还有一个raw属性。

console.log(`123`) //123
console.log`123` // ["123", raw: Array[1]]

上面代码中，第二个console.log接受的参数，其实是一个数组。该数组有一个raw属性，保存的是转义后的原字符串。

String.raw方法，每每用来充当模板字符串的处理函数，返回一个斜杠都被转义（即斜杠前面再加一个斜杠）的字符串，对应于替换变量后的模板字符串。若是原字符串的斜杠已经转义，那么String.raw不会作任何处理。

String.raw`Hi\n${2+3}!`;
// "Hi\\n5!"
String.raw`Hi\\n`
// "Hi\\n"

String.raw方法也能够做为正常的函数使用。这时，它的第一个参数，应该是一个具备raw属性的对象，且raw属性的值应该是一个数组。

String.raw({ raw: 'test' }, 0, 1, 2);
// 't0e1s2t'

// 等同于
String.raw({ raw: ['t','e','s','t'] }, 0, 1, 2);

正则的扩展

RegExp构造函数

var regex = new RegExp('xyz', 'i');
// 等价于
var regex = /xyz/i;
// 等价于
var regex = new RegExp(/xyz/i);

ES5中如下写法会报错。ES6可使用第二个参数指定修饰符，新指定的修饰符会覆盖原有的正则表达式的修饰符。

var regex = new RegExp(/xyz/ig, 'i');
//原有正则对象的修饰符是ig，它会被第二个参数i覆盖.

u修饰符

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

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

上面的代码中，uD83DuDC2A是一个四字节的UTF-16编码，表明一个字符。不加“u”，会按 ES5 将其识别为2个字符，加了“u”以后，会按 ES6 将其正确识别为一个字符。

如下几种状况就必须加上“u”才能正确识别：

.在正则表达式中表示除行终止符(换行符（n），回车符（r），行分隔符，段分隔符)外的任意单个字符，S表示匹配全部不是空格的字符。他们均正确识别码点大于0xFFFF的Unicode字符，必须加上u修饰符才能正确识别。
```
/^\S$/.test('?') // false
/^\S$/u.test('?') // true
```
ES6新增了使用大括号表示Unicode字符，这种表示法在正则表达式中必须加上u修饰符，才能识别。不然大括号会被解读为量词。
```
/^\u{3}$/.test('uuu') // true 被解读为量词
/^\u{3}$/u.test('uuu') // false 被解读为Unicode表达式
```

有些Unicode字符的编码不一样，可是字型很相近，须要加u才能识别。好比，u004B与u212A都是大写的K。

/[a-z]/i.test('\u212A') // false  该行代码不加u修饰符，就没法识别非规范的K字符
/[a-z]/iu.test('\u212A') // true

y 修饰符

y修饰符的做用与g修饰符相似，也是全局匹配，后一次匹配都从上一次匹配成功的下一个位置开始。不一样之处在于，g修饰符只要剩余位置中存在匹配就可，而y修饰符确保匹配必须从剩余的第一个位置开始。y修饰符号就是让头部匹配的标志^在全局匹配中都有效。

var s = 'aaa_aa_a';
var r1 = /a+/g;
var r2 = /a+/y;

r1.exec(s) // ["aaa"]
r1.exec(s) // ["aa"]

r2.exec(s) // ["aaa"]
r2.exec(s) // null  第一次执行后，剩余字符串是_aa_a，y修饰符要求匹配必须从头部开始，因此返回null

在split方法中使用y修饰符，原字符串必须以分隔符开头。这也意味着，只要匹配成功，数组的第一个成员确定是空字符串。

sticky属性

ES6的正则对象多了sticky属性，表示是否设置了y修饰符。

var r = /hello\d/y;
r.sticky // true

flags属性

ES6为正则表达式新增了flags属性，会返回正则表达式的修饰符。

// ES5的source属性  返回正则表达式的正文
/abc/ig.source
// "abc"

// ES6的flags属性  返回正则表达式的修饰符
/abc/ig.flags
// 'gi'

先行断言

JavaScript 语言的正则表达式，只支持先行断言（lookahead）和先行否认断言（negative lookahead）。
”先行断言“指的是，x只有在y前面才匹配，必须写成/x(?=y)/。好比，只匹配百分号以前的数字，要写成/d+(?=%)/。”先行否认断言“指的是，x只有不在y前面才匹配，必须写成/x(?!y)/。好比，只匹配不在百分号以前的数字，要写成/d+(?!%)/。

数值的扩展

ES6 提供了二进制和八进制数值的新的写法，分别用前缀0b（或0B）和0o（或0O）表示。可以使用Number方法将0b和0o前缀的字符串数值转为十进制。

Number('0b111')  // 7

新增方法

Number.isFinite()：用来检查一个数值是否为有限的（finite），对于非数值一概返回false。

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。

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对象上面，行为彻底保持不变。
```
Number.parseInt === parseInt // true
```
Number.isInteger()：用来判断一个值是否为整数。须要注意的是，在JavaScript内部，整数和浮点数是一样的储存方法，因此3和3.0被视为同一个值。
```
Number.isInteger(25) // true
Number.isInteger(25.0) // true
Number.isInteger(25.1) // false
Number.isInteger("15") // false
Number.isInteger(true) // false
```
Number.isSafeInteger()：用来判断一个整数是否落在Number.MAX_SAFE_INTEGER与Number.MIN_SAFE_INTEGER范围以内。使用该函数时，需注意不只要验证运算结果是否落在安全整数的范围内，还要同时验证参与运算的每一个值，不然极可能获得错误结果。
```
Number.isSafeInteger(3) // true
Number.isSafeInteger(1.2) // false
```

新增常量

Number.EPSILON：极小常量。用于为浮点数计算，设置一个偏差范围。

JavaScript可以准确表示的整数范围在-2^53到2^53之间（不含两个端点），超过这个范围，没法精确表示这个值。ES6使用Number.MAX_SAFE_INTEGER和Number.MIN_SAFE_INTEGER这两个常量，用来表示这个范围的上下限。

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

Math对象的扩展

ES6在Math对象上新增了17个与数学相关的方法。全部这些方法都是静态方法，只能在Math对象上调用。

Math.trunc：用于去除一个数的小数部分，返回整数部分。对于非数值，Math.trunc内部使用Number方法将其先转为数值。对于空值和没法截取整数的值，返回NaN。
```
Math.trunc('123.456')  // 123
Math.trunc(NaN);      // NaN
Math.trunc('foo');    // NaN
Math.trunc();         // NaN
```
Math.cbrt()：用于计算一个数的立方根。对于非数值，Math.cbrt方法内部先使用Number方法将其转为数值。
Math.sign()：用来判断一个数究竟是正数、负数、仍是零。正数返回+1，负数返回-1，0返回0，-0返回-0，其余值，返回NaN。
Math.clz32()：JavaScript的整数使用32位二进制形式。Math.clz32()返回一个数的32位无符号整数形式有多少个前导0。对于小数,只考虑其整数部分。对于空值或其余类型的值，会将它们先转为数值，而后再计算。
```
//1000的二进制形式是0b1111101000，一共有10位，因此32位之中有22个前导0。
Math.clz32(1000) // 22
```
Math.imul：返回两个数以32位带符号整数形式相乘的结果，返回的也是一个32位的带符号整数。
Math.fround：返回一个数的单精度浮点数形式。对于整数来讲，Math.fround方法返回结果同样。对于那些没法用64个二进制位精确表示的小数，Math.fround方法返回最接近这个小数的单精度浮点数。
```
Math.fround(1)     // 1
Math.fround(1.337) // 1.3370000123977661
Math.fround(1.5)   // 1.5
```
Math.hypot：返回全部参数的平方和的平方根。若是参数不是数值，Math.hypot方法会将其转为数值。只要有一个参数没法转为数值，就会返回NaN。
Math.sign()：用来判断一个值的正负，可是若是参数是-0，它会返回-0。

新增对数方法

Math.expm1():
Math.log1p(x)：返回1 + x的天然对数，即Math.log(1 + x)。若是x小于-1，返回NaN。
Math.log10(x)：返回以10为底的x的对数。若是x小于0，则返回NaN。
Math.log2(x)：返回以2为底的x的对数。若是x小于0，则返回NaN。

新增三角函数方法

Math.sinh(x)：返回x的双曲正弦（hyperbolic sine）
Math.cosh(x)：返回x的双曲余弦（hyperbolic cosine）
Math.tanh(x)：返回x的双曲正切（hyperbolic tangent）
Math.asinh(x)：返回x的反双曲正弦（inverse hyperbolic sine）
Math.acosh(x)：返回x的反双曲余弦（inverse hyperbolic cosine）
Math.atanh(x)：返回x的反双曲正切（inverse hyperbolic tangent）

指数运算符

ES2016 新增了一个指数运算符（**）。

2 ** 3 // 8
b **= 3; // 等同于 b = b * b * b;

在 V8 引擎中，指数运算符与Math.pow的实现不相同，对于特别大的运算结果，二者会有细微的差别。

Math.pow(99, 99)
// 3.697296376497263e+197

99 ** 99
// 3.697296376497268e+197

数组的扩展

Array.from()

Array.from方法用于将两类对象转为真正的数组：相似数组的对象(即有length属性的对象)和可遍历（iterable）的对象（包括ES6新增的数据结构Set和Map）。若是参数是一个真正的数组，Array.from会返回一个如出一辙的新数组。

let arrayLike = {
    '0': 'a',
    '1': 'b',
    '2': 'c',
    length: 3
};

// ES5的写法
var arr1 = [].slice.call(arrayLike); // ['a', 'b', 'c']

// ES6的写法
let arr2 = Array.from(arrayLike); // ['a', 'b', 'c']

扩展运算符（...）也能够将某些数据结构转为数组。扩展运算符背后调用的是遍历器接口（Symbol.iterator）。

// arguments对象
function foo() {
  var args = [...arguments];
}

// NodeList对象
[...document.querySelectorAll('div')]

Array.from还能够接受第二个参数，做用相似于数组的map方法，用来对每一个元素进行处理，将处理后的值放入返回的数组。

Array.from(arrayLike, x => x * x);
// 等同于
Array.from(arrayLike).map(x => x * x);

Array.from([1, 2, 3], (x) => x * x)
// [1, 4, 9]

Array.from()能正确处理各类Unicode字符,所以能够将将字符串转为数组，而后正确返回字符串的长度。

function countSymbols(string) {
  return Array.from(string).length;
}

Array.of()

Array.of老是返回参数值组成的数组。若是没有参数，就返回一个空数组。Array.of基本上能够用来替代Array()或new Array()。

Array.of(3, 11, 8) // [3,11,8]
Array.of(3) // [3]

Array() // []
Array(3) // [, , ,]
Array(3, 11, 8) // [3, 11, 8]

数组的新增实例方法

copyWithin() ：在当前数组内部，将指定位置的成员复制到其余位置（会覆盖原有成员），而后返回当前数组。Array.prototype.copyWithin(target, start = 0, end = this.length)。三个参数都应该是数值，若是不是，会自动转为数值。会修改当前数组。
find() ：用于找出第一个符合条件的数组成员。它的参数是一个回调函数，全部数组成员依次执行该回调函数，直到找出第一个返回值为true的成员，而后返回该成员。若是没有符合条件的成员，则返回undefined。能够发现NaN。

findIndex() ：与find方法很是相似，返回第一个符合条件的数组成员的位置，若是全部成员都不符合条件，则返回-1。能够发现NaN。

[NaN].indexOf(NaN)    // -1

[NaN].findIndex(y => Object.is(NaN, y))   // 0

//indexOf方法没法识别数组的NaN成员，可是findIndex方法能够借助Object.is方法作到。

fill() :使用给定值，填充一个数组。fill方法用于空数组的初始化很是方便。数组中已有的元素，会被所有抹去。

['a', 'b', 'c'].fill(7)   // [7, 7, 7]

new Array(3).fill(7)   // [7, 7, 7]
 
['a', 'b', 'c'].fill(7, 1, 2) // ['a', 7, 'c']  fill方法从1号位开始，向原数组填充7，到2号位以前结束。

includes():返回一个布尔值，表示某个数组是否包含给定的值，与字符串的includes方法相似。该方法属于ES7，但Babel转码器已经支持。
```
[1, 2, NaN].includes(NaN); // true

[NaN].indexOf(NaN)  // -1
[NaN].includes(NaN) // true
//indexof会致使对NaN的误判，可是includes能够正确判断NaN。
```

遍历数组

entries()，keys()和values()均用于遍历数组。它们都返回一个遍历器对象(Iterator)，能够用for...of循环进行遍历，惟一的区别是keys()是对键名的遍历、values()是对键值的遍历，entries()是对键值对的遍历。

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

不使用for...of循环，能够手动调用遍历器对象的next方法，进行遍历。

let letter = ['a', 'b', 'c'];
let entries = letter.entries();
console.log(entries.next().value); // [0, 'a']
console.log(entries.next().value); // [1, 'b']

数组的空位

数组的空位指，数组的某一个位置没有任何值。空位不是undefined，一个位置的值等于undefined，依然是有值的。空位是没有任何值。

Array(3) // [, , ,]     Array(3)返回一个具备3个空位的数组。

对空位的处理

ES5大多数状况下会忽略空位。

forEach(), filter(), every() 和some()都会跳过空位。
map()会跳过空位，但会保留这个值。

join()和toString()会将空位视为undefined，而undefined和null会被处理成空字符串。

// filter方法
['a',,'b'].filter(x => true) // ['a','b']

// map方法
[,'a'].map(x => 1)  // [,1]

// join方法
[,'a',undefined,null].join('#') // "#a##"

ES6明确将空位转为undefined。

Array.from方法会将数组的空位，转为undefined。
扩展运算符（...）将空位转为undefined。
copyWithin()会连空位一块儿拷贝。
fill()会将空位视为正常的数组位置。
for...of循环也会遍历空位。

entries()、keys()、values()、find()和findIndex()会将空位处理成undefined。

Array.from(['a',,'b'])   // [ "a", undefined, "b" ]
[...['a',,'b']]   // [ "a", undefined, "b" ]
new Array(3).fill('a') // ["a","a","a"]

因为空位的处理规则很是不统一，因此建议避免出现空位。

函数的扩展

函数参数的默认值

ES6 容许为函数的参数设置默认值，即直接写在参数定义的后面。参数变量是默认声明的，因此不能用let或const再次声明。使用参数默认值时，函数不能有同名参数。

//参数变量x是默认声明的，在函数体中，不能用let或const再次声明，不然会报错。
function foo(x = 5) {
  let x = 1; // error
  const x = 2; // error
}

若是参数默认值是变量，那么参数就不是传值的，而是每次都从新计算默认值表达式的值。也就是说，参数默认值是惰性求值的。

let x = 99;
function foo(p = x + 1) {
  console.log(p);
}

foo() // 100

x = 100;
foo() // 101
//代码中，参数p的默认值是x + 1。这时，每次调用函数foo，都会从新计算x + 1，而不是默认p等于 100。

与解构赋值默认值结合使用

参数默认值能够与解构赋值的默认值结合起来使用。

function foo({x, y = 5}) {
  console.log(x, y);
}

foo({}) // undefined, 5
foo() // TypeError: Cannot read property 'x' of undefined

只有当函数foo的参数是一个对象时，变量x和y才会经过解构赋值而生成。若是函数foo调用时参数不是对象，变量x和y就不会生成，从而报错。若是参数对象没有y属性，y的默认值5才会生效。

参数默认值的位置

一般状况下，定义了默认值的参数，应该是函数的尾参数。若是非尾部的参数设置默认值，则调用时没法只省略该参数，而不省略它后面的参数，除非显式输入undefined。

function f(x = 1, y) {
  return [x, y];
}
f(2) // [2, undefined])
f(, 1) // 报错
f(undefined, 1) // [1, 1]

函数的 length 属性

函数的length属性，将返回没有指定默认值的参数个数。设置了默认值的参数不是尾参数，那么length属性也再也不计入后面的参数。rest参数也不会计入length属性。

(function (a, b, c = 5) {}).length // 2
(function(...args) {}).length // 0
(function (a, b = 1, c) {}).length // 1

做用域

一旦设置了参数的默认值，调用函数时，参数会造成一个单独的做用域（context）。这种语法行为，在不设置参数默认值时，是不会出现的。当该单独做用域里面默认值是变量，且变量未定义，则指向外层的全局变量，若此时该全局变量不存在，就会报错。

let x = 1;

function f(y = x) {
  let x = 2;
  console.log(y);
}

f() // 1

函数f调用时，参数y = x造成一个单独的做用域。这个做用域里面，变量x自己没有定义，因此指向外层的全局变量x。函数调用时，函数体内部的新声明局部变量x影响不到默认值变量x。

rest参数

rest 运算符:将一个不定数量的参数表示为一个数组。

ES6 引入 rest 参数（形式为“...变量名”），用于获取函数的多余参数，rest 参数中的变量表明一个数组。注意，rest 参数以后不能再有其余参数（即只能是最后一个参数），不然会报错。函数的length属性，不包括 rest 参数。

function f(a, ...b) {
  console.log(b);
}
f(2,3,4,5)  //[3, 4, 5]

// 报错
function f(a, ...b, c) {
  // ...
}

扩展运算符

扩展运算符（spread）是三个点（...）。它比如 rest 参数的逆运算，将一个数组转为用逗号分隔的参数序列。
在某种程度上，rest运算符和Spread运算符（即扩展运算符）相反，Spread运算符会“展开”元素使其变成多个元素，rest运算符会收集多个元素和“压缩”成一个单一的元素。

console.log(1, ...[2, 3, 4], 5)
// 1 2 3 4 5

// ES6的写法
Math.max(...[14, 3, 77])

// 等同于
Math.max(14, 3, 77);

扩展运算符的应用

合并数组

// ES5
[1, 2].concat(more)
// ES6
[1, 2, ...more]

将字符串转为真正的数组。

[...'hello']
// [ "h", "e", "l", "l", "o" ]

该写法可以正确识别32位的Unicode字符。

'x\uD83D\uDE80y'.length // 4
[...'x\uD83D\uDE80y'].length // 3
//JavaScript会将32位Unicode字符，识别为2个字符，采用扩展运算符就没有这个问题。

扩展运算符内部调用的是数据结构的Iterator接口。因此任何Iterator接口的对象，均可以用扩展运算符转为真正的数组。对于那些没有部署Iterator接口的相似数组的对象，扩展运算符就没法将其转为真正的数组。

严格模式

从ES5开始，函数内部能够设定为严格模式。

function doSomething(a, b) {
  'use strict';
  // code
}

《ECMAScript 2016标准》规定只要函数参数使用了默认值、解构赋值、或者扩展运算符，那么函数内部就不能显式设定为严格模式，不然会报错。

规定的缘由:函数内部的严格模式，同时适用于函数体代码和函数参数代码。可是，函数执行的时候，先执行函数参数代码，而后再执行函数体代码。这样就有一个不合理的地方，只有从函数体代码之中，才能知道参数代码是否应该以严格模式执行，可是参数代码却应该先于函数体代码执行。所以，标准如此定义。

name 属性

函数的name属性，返回该函数的函数名。将一个匿名函数赋值给一个变量，ES5 的name属性，会返回空字符串，而 ES6 的name属性会返回实际的函数名。若是将一个具名函数赋值给一个变量，则 ES5 和 ES6 的name属性都返回这个具名函数本来的名字。

var f = function () {};
// ES5
f.name // ""
// ES6
f.name // "f"


const bar = function baz() {};
// ES5
bar.name // "baz"
// ES6
bar.name // "baz"

Function构造函数返回的函数实例，name属性的值为anonymous。bind返回的函数，name属性值会加上bound前缀。

(new Function).name // "anonymous"
function foo() {};
foo.bind({}).name // "bound foo"

箭头函数

ES6容许使用“箭头”（=>）定义函数。若是箭头函数不须要参数或须要多个参数，就使用一个圆括号表明参数部分。若是箭头函数的代码块部分多于一条语句，就要使用大括号将它们括起来。因为大括号被解释为代码块，因此若是箭头函数直接返回一个对象，必须在对象外面加上括号。箭头函数能够嵌套。

var f = v => v;
//等同于
var f = function(v) {
  return v;
};

var f = () => 5;
// 等同于
var f = function () { return 5 };

var getTempItem = id => ({ id: id, name: "Temp" });

箭头函数使用注意点：

函数体内的this对象，就是定义时所在的对象，而不是使用时所在的对象。this指向的固定化,是由于箭头函数根本没有本身的this，致使内部的this就是外层代码块的this。正是由于它没有this，因此也就不能用做构造函数。
不能够看成构造函数，也就是说，不可使用new命令，不然会抛出一个错误。
不可使用arguments对象，该对象在函数体内不存在。若是要用，能够用rest参数代替。
不可使用yield命令，所以箭头函数不能用做Generator函数。

// ES6
function foo() {
  setTimeout(() => {
    console.log('id:', this.id);
  }, 100);
}

// ES5
function foo() {
  var _this = this;

  setTimeout(function () {
    console.log('id:', _this.id);
  }, 100);
}

上面代码中，转换后的ES5版本清楚地说明了，箭头函数里面根本没有本身的this，而是引用外层的this。

除了this，如下三个变量在箭头函数之中也是不存在的，指向外层函数的对应变量：arguments、super、new.target。因为箭头函数没有本身的this，因此固然也就不能用call()、apply()、bind()这些方法去改变this的指向。

(function() {
  return [
    (() => this.x).bind({ x: 'inner' })()
  ];
}).call({ x: 'outer' });
// ['outer']
//上面代码中，箭头函数没有本身的this，因此bind方法无效，内部的this指向外部的this。

“函数绑定”（function bind）运算符

ES7提出了“函数绑定”（function bind）运算符，用来取代call、apply、bind调用。虽然该语法仍是ES7的一个提案，可是Babel转码器已经支持。

函数绑定运算符是并排的两个双冒号（::），双冒号左边是一个对象，右边是一个函数。该运算符会自动将左边的对象，做为上下文环境（即this对象），绑定到右边的函数上面。若是双冒号左边为空，右边是一个对象的方法，则等于将该方法绑定在该对象上面。双冒号运算符返回的仍是原对象，所以能够采用链式写法。

foo::bar(...arguments);
// 等同于
bar.apply(foo, arguments);

var method = obj::obj.foo;
// 等同于
var method = ::obj.foo;

尾调用优化

尾调用就是指某个函数运行的最后一步是调用另外一个函数。尾调用不必定出如今函数尾部，只要是最后一步操做便可。

function f(x){
  return g(x);
}
//函数f的最后一步是调用函数g，这就叫尾调用。


function f(x){
  return g(x) + 1;
}
//函数调用以后还有操做，不是尾调用。
function f(x){
  g(x);
}
//上面的函数等同于下面的代码，所以也不是尾调用。
//function f(x){
//  g(x);
//  return undefined;
//}

尾调用优化

函数调用会在内存造成一个“调用记录”，又称“调用帧”（call frame），保存调用位置和内部变量等信息。若是在函数A的内部调用函数B，那么在A的调用帧上方，还会造成一个B的调用帧。等到B运行结束，将结果返回到A，B的调用帧才会消失。若是函数B内部还调用函数C，那就还有一个C的调用帧，以此类推。全部的调用帧，就造成一个“调用栈”（call stack）。

function f() {
  let m = 1;
  let n = 2;
  return g(m + n);
}
f();

// 等同于
function f() {
  return g(3);
}
f();

// 等同于
g(3);

上面代码中，若是函数g不是尾调用，函数f就须要保存内部变量m和n的值、g的调用位置等信息。但因为调用g以后，函数f就结束了，因此执行到最后一步，彻底能够删除 f(x) 的调用帧，只保留 g(3) 的调用帧。

这就叫作“尾调用优化”（Tail call optimization），即只保留内层函数的调用帧。若是全部函数都是尾调用，那么彻底能够作到每次执行时，调用帧只有一项，这将大大节省内存。这就是“尾调用优化”的意义。注意，只有再也不用到外层函数的内部变量，内层函数的调用帧才会取代外层函数的调用帧，不然就没法进行“尾调用优化”。

尾递归

函数调用自身，称为递归。若是尾调用自身，就称为尾递归。递归很是耗费内存，由于须要同时保存成千上百个调用帧，很容易发生“栈溢出”错误（stack overflow）。但对于尾递归来讲，因为只存在一个调用帧，因此永远不会发生“栈溢出”错误。

function factorial(n) {
  if (n === 1) return 1;
  return n * factorial(n - 1);
}

factorial(5) // 120  计算n的阶乘，最多须要保存n个调用记录，复杂度 O(n) 
//改写为尾递归
function factorial(n, total) {
  if (n === 1) return total;
  return factorial(n - 1, n * total);
}

factorial(5, 1) // 120 改写成了尾递归，只保留一个调用记录，复杂度 O(1) 。

因而可知，“尾调用优化”对递归操做意义重大。ES6明确规定，全部ECMAScript的实现，都必须部署“尾调用优化”。这就是说，在ES6中，只要使用尾递归，就不会发生栈溢出，相对节省内存。

递归函数的改写

尾递归的实现，每每须要改写递归函数，确保最后一步只调用自身。作到这一点的方法，就是把全部用到的内部变量改写成函数的参数。

严格模式

ES6的尾调用优化只在严格模式下开启，正常模式是无效的。

这是由于在正常模式下，函数内部有两个变量，能够跟踪函数的调用栈。

func.arguments：返回调用时函数的参数。
func.caller：返回调用当前函数的那个函数。

尾调用优化发生时，函数的调用栈会改写，所以上面两个变量就会失真。严格模式禁用这两个变量，因此尾调用模式仅在严格模式下生效。

function restricted() {
  "use strict";
  restricted.caller;    // 报错
  restricted.arguments; // 报错
}
restricted();

尾递归优化的实现

正常模式下，或者那些不支持该功能的环境中,采用“循环”换掉“递归”,以减小调用栈。

//正常递归函数
function sum(x, y) {
  if (y > 0) {
    return sum(x + 1, y - 1);
  } else {
    return x;
  }
}

sum(1, 100000)
//

可使用蹦床函数（trampoline）将递归执行转为循环执行。

function trampoline(f) {
  while (f && f instanceof Function) {
    f = f();
  }
  return f;
}

上面就是蹦床函数的一个实现，它接受一个函数f做为参数。只要f执行后返回一个函数，就继续执行。这里是返回一个函数，而后执行该函数，而不是函数里面调用函数，这样就避免了递归执行，从而就消除了调用栈过大的问题。

而后，要作的就是将原来的递归函数，改写为每一步返回另外一个函数。

function sum(x, y) {
  if (y > 0) {
    return sum.bind(null, x + 1, y - 1);
  } else {
    return x;
  }
}
//sum函数的每次执行，都会返回自身的另外一个版本
trampoline(sum(1, 100000));//而后，用蹦床函数执行sum，就不会发生调用栈溢出。

函数参数的尾逗号

ES2017 容许函数的最后一个参数有尾逗号（trailing comma）。此前，函数定义和调用时，都不容许最后一个参数后面出现逗号。

对象的扩展

属性的简洁表示法

ES6 容许直接写入变量和函数，做为对象的属性和方法。简洁写法的属性名老是字符串。

var foo = 'bar';
var baz = {foo};
baz // {foo: "bar"}
// 等同于
var baz = {foo: foo};
//ES6 容许在对象之中，直接写变量。这时，属性名为变量名, 属性值为变量的值。

var o = {
  method() {
    return "Hello!";
  }
};
// 等同于
var o = {
  method: function() {
    return "Hello!";
  }
};

属性名表达式

JavaScript语言定义对象的属性，有两种方法。方法一是直接用标识符做为属性名，方法二是用表达式做为属性名，这时要将表达式放在方括号以内。

// 方法一
obj.foo = true;

// 方法二
obj['a' + 'bc'] = 123;

若是使用字面量方式定义对象（使用大括号），在 ES5 中只能使用方法一（标识符）定义属性。但ES6 容许字面量定义对象时，用方法二（表达式）做为对象的属性名，即把表达式放在方括号内。表达式还能够用于定义方法名。

let propKey = 'foo';

let obj = {
  [propKey]: true,
  ['a' + 'bc']: 123
};

注意，属性名表达式与简洁表示法，不能同时使用，会报错。

// 报错
var foo = 'bar';
var bar = 'abc';
var baz = { [foo] };

// 正确
var foo = 'bar';
var baz = { [foo]: 'abc'};

注意，属性名表达式若是是一个对象，默认状况下会自动将对象转为字符串[object Object]，这一点要特别当心。

const keyA = {a: 1};
const keyB = {b: 2};

const myObject = {
  [keyA]: 'valueA',
  [keyB]: 'valueB'
};

myObject // Object {[object Object]: "valueB"}
//[keyA]和[keyB]获得的都是[object Object]，因此[keyB]会把[keyA]覆盖掉，而myObject最后只有一个[object Object]属性。

方法的 name 属性

对象方法的name属性返回函数名（即方法名）。若是对象的方法使用了取值函数（getter）和存值函数（setter），则name属性不是在该方法上面，而是该方法的属性的描述对象的get和set属性上面，返回值是方法名前加上get和set。

const obj = {
  get foo() {},
  set foo(x) {}
};

obj.foo.name
// TypeError: Cannot read property 'name' of undefined

const descriptor = Object.getOwnPropertyDescriptor(obj, 'foo');

descriptor.get.name // "get foo"
descriptor.set.name // "set foo"

bind方法创造的函数，name属性返回bound加上原函数的名字。
Function构造函数创造的函数，name属性返回anonymous。
若是对象的方法是一个 Symbol 值，那么name属性返回的是这个 Symbol 值的描述。

Object.is()

ES5使用相等运算符（==）和严格相等运算符（===）比较两个值是否相等。前者会自动转换数据类型，后者的NaN不等于自身，以及+0等于-0。ES6中可用Object.is来比较两个值是否严格相等，与严格比较运算符（===）的行为基本一致。可是用Object.is比较时，+0不等于-0，NaN等于自身。

Object.is('foo', 'foo')
// true
Object.is({}, {})
// false


+0 === -0 //true
NaN === NaN // false

Object.is(+0, -0) // false
Object.is(NaN, NaN) // true

Object.assign()

Object.assign方法用于对象的合并，将源对象（source）的全部可枚举属性，复制到目标对象（target）。Object.assign方法的第一个参数是目标对象，后面的参数都是源对象。注意，若是目标对象与源对象有同名属性，或多个源对象有同名属性，则后面的属性会覆盖前面的属性。

var target = { a: 1, b: 1 };

var source1 = { b: 2, c: 2 };
var source2 = { c: 3 };

Object.assign(target, source1, source2);
target // {a:1, b:2, c:3}

若是只有一个参数，Object.assign会直接返回该参数。若是该参数不是对象，则会先转成对象，而后返回。因为undefined和null没法转成对象，因此若是它们做为参数，就会报错。若非对象参数出如今源对象的位置（即非首参数），则这些参数都会转成对象，若是没法转成对象，就会跳过。这意味着，若是undefined和null不在首参数，就不会报错。

Object.assign(null) // 报错

let obj = {a: 1};
Object.assign(obj, null) === obj // true

Object.assign不会拷贝对象的内部属性[[PrimitiveValue]]。布尔值、数值、字符串分别转成对应的包装对象时，它们的原始值都在包装对象的内部属性[[PrimitiveValue]]上面。只有字符串的包装对象，会产生可枚举属性，这些属性会被拷贝。所以其余类型的值（即数值、字符串和布尔值）不在首参数，除了字符串会以数组形式，拷贝入目标对象，其余值都不会产生效果。

var v1 = 'abc';
var v2 = true;
var v3 = 10;

var obj = Object.assign({}, v1, v2, v3);
console.log(obj); // { "0": "a", "1": "b", "2": "c" }

Object(true) // {[[PrimitiveValue]]: true}
Object(10)  //  {[[PrimitiveValue]]: 10}
Object('abc') // {0: "a", 1: "b", 2: "c", length: 3, [[PrimitiveValue]]: "abc"}

Object.assign拷贝的属性是有限制的。

只拷贝源对象的自身属性和属性名为Symbol值的属性。
不拷贝继承属性。
不拷贝不可枚举的属性（enumerable: false）。

注意点

1.Object.assign方法实行的是浅拷贝，而不是深拷贝。也就是说，若是源对象某个属性的值是对象，那么目标对象拷贝获得的是这个对象的引用。

var obj1 = {a: {b: 1}};
var obj2 = Object.assign({}, obj1);

obj1.a.b = 2;
obj2.a.b // 2
//Object.assign拷贝获得的是这个对象的引用。这个对象的任何变化，都会反映到目标对象上面。

2.对于嵌套的对象，一旦遇到同名属性，Object.assign的处理方法是替换，而不是添加。

var target = { a: { b: 'c', d: 'e' } }
var source = { a: { b: 'hello' } }
Object.assign(target, source)
// { a: { b: 'hello' } }
//target对象的a属性被source对象的a属性整个替换掉

3.Object.assign能够用来处理数组，可是会把数组视为对象。

Object.assign([1, 2, 3], [4, 5])
// [4, 5, 3]
//Object.assign把数组视为属性名为0、一、2的对象，所以源数组的0号属性4覆盖了目标数组的0号属性1。

各种型值转换为对象

布尔值、数值、字符串分别转成对应的包装对象时，它们的原始值都在包装对象的内部属性[[PrimitiveValue]]上面。只有字符串的包装对象，会产生可枚举属性。 null或undefined转换为对象时将建立并返回一个空对象。

Object(1)
// Number {[[PrimitiveValue]]: 1}
Object("foo")
// String {0: "f", 1: "o", 2: "o", length: 3, [[PrimitiveValue]]: "foo"}
Object(null)
// Object {}

属性的可枚举性

对象的每一个属性都有一个描述对象（Descriptor），用来控制该属性的行为。Object.getOwnPropertyDescriptor方法能够获取该属性的描述对象。

let obj = { foo: 123 };
Object.getOwnPropertyDescriptor(obj, 'foo')
//  {
//    value: 123,
//    writable: true,
//    enumerable: true,
//    configurable: true
//  }

描述对象的enumerable属性，称为”可枚举性“，若是该属性为false，就表示某些操做会忽略当前属性。
ES5有三个操做会忽略enumerable为false的属性。

for...in循环：只遍历对象自身的和继承的可枚举的属性
Object.keys()：返回对象自身的全部可枚举的属性的键名
JSON.stringify()：只串行化对象自身的可枚举的属性
Object.assign()：会忽略enumerable为false的属性，只拷贝对象自身的可枚举的属性。
以上四个操做之中，最后一个是ES6新增的。只有for...in会返回继承的属性。

ES6规定，全部Class的原型的方法都是不可枚举的。

属性的遍历

for...in：循环遍历对象自身的和继承的可枚举属性（不含Symbol属性）。
Object.keys(obj)：返回一个数组，包括对象自身的（不含继承的）全部可枚举属性（不含Symbol属性）。
Object.getOwnPropertyNames(obj)：返回一个数组，包含对象自身的全部属性（不含Symbol属性，可是包括不可枚举属性）。
Object.getOwnPropertySymbols(obj)：返回一个数组，包含对象自身的全部Symbol属性。
Reflect.ownKeys(obj)：返回一个数组，包含对象自身的全部属性，无论属性名是Symbol或字符串，也无论是否可枚举。

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

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

proto属性，Object.setPrototypeOf()，Object.getPrototypeOf()

proto属性

__proto__属性（先后各两个下划线），用来读取或设置当前对象的prototype对象。目前，全部浏览器（包括 IE11）都部署了这个属性。该属性最好不要用。在实现上，__proto__调用的是Object.prototype.__proto__。

Object.setPrototypeOf()

Object.setPrototypeOf方法的做用与__proto__相同，用来设置一个对象的prototype对象，返回参数对象自己。它是 ES6 正式推荐的设置原型对象的方法。

// 格式
Object.setPrototypeOf(object, prototype)

// 用法
var o = Object.setPrototypeOf({}, null);

若是第一个参数不是对象，会自动转为对象。可是因为返回的仍是第一个参数，因此这个操做不会产生任何效果。因为undefined和null没法转为对象，因此若是第一个参数是undefined或null，就会报错。

Object.setPrototypeOf(1, {}) === 1 // true

Object.setPrototypeOf(undefined, {})
// TypeError: Object.setPrototypeOf called on null or undefined

Object.getPrototypeOf()

该方法与Object.setPrototypeOf方法配套，用于读取一个对象的原型对象。

function Rectangle() {
  // ...
}

var rec = new Rectangle();
Object.getPrototypeOf(rec) === Rectangle.prototype
// true

若是参数不是对象，会被自动转为对象。若是参数是undefined或null，它们没法转为对象，因此会报错。

// 等同于 Object.getPrototypeOf(Number(1))
Object.getPrototypeOf(1)
// Number {[[PrimitiveValue]]: 0}
Object.getPrototypeOf(1) === Number.prototype // true

Object.getPrototypeOf(null)
// TypeError: Cannot convert undefined or null to object

Object.keys()，Object.values()，Object.entries()

Object.keys:返回一个数组，成员是参数对象自身的（不含继承的）全部可遍历（enumerable）属性的键名。ES5 引入。
Object.values()：返回一个数组，成员是参数对象自身的（不含继承的）全部可遍历（enumerable）属性的键值。ES2017 引入。返回数组的成员顺序,与《属性的遍历》部分介绍的排列规则一致。Object.values会过滤属性名为 Symbol 值的属性。若是参数不是对象，Object.values会先将其转为对象。
```
Object.values({ [Symbol()]: 123, foo: 'abc' });  // ['abc']
Object.values('foo')   // ['f', 'o', 'o']
Object.values(42) // []
Object.values(true) // []

Object.values(null) //Uncaught TypeError: Cannot convert undefined or null to object
```
Object.entries()：返回一个数组，成员是参数对象自身的（不含继承的）全部可遍历（enumerable）属性的键值对数组。该方法的行为与Object.values基本一致。原对象的属性名是一个 Symbol 值，该属性会被忽略。可将对象转为真正的Map结构。
```
Object.entries({ [Symbol()]: 123, foo: 'abc' });
// [ [ 'foo', 'abc' ] ]

var obj = { foo: 'bar', baz: 42 };
var map = new Map(Object.entries(obj));
map // Map { foo: "bar", baz: 42 }
```

对象的扩展运算符

ES2017 将扩展运算符（...）引入了对象。

（1）解构赋值
对象的解构赋值用于从一个对象取值，至关于将全部可遍历的、但还没有被读取的属性，分配到指定的对象上面。全部的键和它们的值，都会拷贝到新对象上面。

解构赋值要求等号右边是一个对象，因此若是等号右边是undefined或null，就会报错，由于它们没法转为对象。
解构赋值必须是最后一个参数，不然会报错。
解构赋值的拷贝是浅拷贝，即若是一个键的值是复合类型的值（数组、对象、函数）、那么解构赋值拷贝的是这个值的引用，而不是这个值的副本。
解构赋值不会拷贝继承自原型对象的属性。

let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4 };
x // 1
y // 2
z // { a: 3, b: 4 }
//变量z是解构赋值所在的对象。它获取等号右边的全部还没有读取的键（a和b），将它们连同值一块儿拷贝过来。



let { x, y, ...z } = null; // 运行时错误
let { ...x, y, z } = { x: 1, y: 2, a: 3, b: 4 }; // 句法错误
var o = Object.create({ x: 1, y: 2 });
o.z = 3;
let { x, ...{ y, z } } = o;
x // 1
y // undefined
z // 3
//变量x是单纯的解构赋值，因此能够读取对象o继承的属性；变量y和z是双重解构赋值，只能读取对象o自身的属性，因此只有变量z能够赋值成功。

（2）扩展运算符
扩展运算符（...）用于取出参数对象的全部可遍历属性，拷贝到当前对象之中。这等同于使用Object.assign方法。扩展运算符能够用于合并两个对象。若是扩展运算符的参数是null或undefined，这个两个值会被忽略，不会报错。

let z = { a: 3, b: 4 };
let n = { ...z };
n // { a: 3, b: 4 }

let ab = { ...a, ...b };
// 等同于
let ab = Object.assign({}, a, b);


let emptyObject = { ...null, ...undefined }; // 不报错

若是用户自定义的属性，放在扩展运算符后面，则扩展运算符内部的同名属性会被覆盖掉。

let aWithOverrides = { ...a, x: 1, y: 2 };
// 等同于
let aWithOverrides = { ...a, ...{ x: 1, y: 2 } };
// 等同于
let aWithOverrides = Object.assign({}, a, { x: 1, y: 2 });
//a对象的x属性和y属性，拷贝到新对象后会被覆盖掉。

做用：可用来修改现有对象的部分属性。

let newVersion = {
  ...previousVersion,
  name: 'New Name' // Override the name property
};
//newVersion对象自定义了name属性，其余属性所有复制自previousVersion对象。

Object.getOwnPropertyDescriptors()

Object.getOwnPropertyDescriptor:返回某个对象属性的描述对象（descriptor）。ES5引入。

var obj = { p: 'a' };

Object.getOwnPropertyDescriptor(obj, 'p')
// Object { value: "a",
//   writable: true,
//   enumerable: true,
//   configurable: true
// }

Object.getOwnPropertyDescriptors：返回指定对象全部自身属性（非继承属性）的描述对象。ES2017 引入。

const obj = {
foo: 123,
get bar() { return 'abc' }
};

Object.getOwnPropertyDescriptors(obj)
// { foo:
//    { value: 123,
//      writable: true,
//      enumerable: true,
//      configurable: true },
//   bar:
//    { get: [Function: bar],
//      set: undefined,
//      enumerable: true,
//      configurable: true } }
//Object.getOwnPropertyDescriptors方法返回一个对象，全部原对象的属性名都是该对象的属性名，对应的属性值就是该属性的描述对象。

主要是为了解决Object.assign()没法正确拷贝get属性和set属性的问题,由于Object.assign方法老是拷贝一个属性的值，而不会拷贝它背后的赋值方法或取值方法。Object.getOwnPropertyDescriptors配合Object.create方法，将对象属性克隆到一个新对象时，属于浅拷贝。

const source = {
set foo(value) {
 console.log(value);
 }
};
const target1 = {};
Object.assign(target1, source);
Object.getOwnPropertyDescriptor(target1, 'foo')
// { value: undefined,
//   writable: true,
//   enumerable: true,
//   configurable: true }

const clone = Object.create(Object.getPrototypeOf(obj),
Object.getOwnPropertyDescriptors(obj));

Null 传导运算符

?.称为Null 传导运算符，该运算符若返回null或undefined，就再也不往下运算，而是返回undefined。
Null 传导运算符有四种用法。

obj?.prop // 读取对象属性
obj?.[expr] // 同上
func?.(...args) // 函数或对象方法的调用
new C?.(...args) // 构造函数的调用

const firstName = (message
  && message.body
  && message.body.user
  && message.body.user.firstName) || 'default';
//等同于
const firstName = message?.body?.user?.firstName || 'default';

参考自：ECMAScript 6 入门

ES6学习笔记2—各扩展

字符串的扩展

字符的 Unicode 表示法

字符串方法

其余方法

字符串的遍历器接口

模板字符串

标签模板

正则的扩展

RegExp构造函数

u修饰符

y 修饰符

sticky属性

flags属性

先行断言

数值的扩展

新增方法

新增常量

Math对象的扩展

新增对数方法

新增三角函数方法

指数运算符

数组的扩展

Array.from()

Array.of()

数组的新增实例方法

遍历数组

数组的空位

对空位的处理

函数的扩展

函数参数的默认值

与解构赋值默认值结合使用

参数默认值的位置

函数的 length 属性

做用域

rest参数

扩展运算符

扩展运算符的应用

严格模式

name 属性

箭头函数

“函数绑定”（function bind）运算符

尾调用优化

尾调用优化

尾递归

递归函数的改写

严格模式

尾递归优化的实现

函数参数的尾逗号

对象的扩展

属性的简洁表示法

属性名表达式

方法的 name 属性

Object.is()

Object.assign()

各种型值转换为对象

属性的可枚举性

属性的遍历

__proto__属性，Object.setPrototypeOf()，Object.getPrototypeOf()

__proto__属性

Object.setPrototypeOf()

Object.getPrototypeOf()

Object.keys()，Object.values()，Object.entries()

对象的扩展运算符

Object.getOwnPropertyDescriptors()

Null 传导运算符

proto属性，Object.setPrototypeOf()，Object.getPrototypeOf()

proto属性