es6笔记

at()
ES5对字符串提供charAt方法，但不能识别码点大于0xFFFF的字符。
ES6的at方法，可以识别Unicode编号大于0xFFFF的字符，返回正确的字符。

'abc'.at(0) // "a"
''.at(0) // ""

includes(), startsWith(), endsWith()
ES5中的indexOf方法，用来检索字符串中指定字符串出现的位置 而ES6又提供了三种新方法。

includes()：返回布尔值，表示是否找到了参数字符串。
startsWith()：返回布尔值，表示参数字符串是否在源字符串的头部。
endsWith()：返回布尔值，表示参数字符串是否在源字符串的尾部。

var s = 'Hello world!';
s.startsWith('Hello') // true
s.endsWith('!') // true
s.includes('o') // true

这三个方法都支持第二个参数，表示开始搜索的位置。

var s = 'Hello world!';
s.startsWith('world', 6) // true
s.endsWith('Hello', 5) // true
s.includes('Hello', 0) // true

注意：endsWith的行为与其他两个方法有所不同。它针对前n个字符，而其他两个方法针对从第n个位置直到字符串结束。
normalize()
比如Ǒ（\u01D1）。另一种是提供合成符号（combining character），即原字符与重音符号的合成，两个字符合成一个字符，比如O（\u004F）和ˇ（\u030C）合成Ǒ（\u004F\u030C）。

这两种表示方法，在视觉和语义上都等价，但是JavaScript不能识别。

'\u01D1'==='\u004F\u030C' //false
'\u01D1'.length // 1
'\u004F\u030C'.length // 2

ES6提供字符串实例的normalize()方法，用来将字符的不同表示方法统一为同样的形式，这称为Unicode正规化。

‘\u01D1’.normalize() === ‘\u004F\u030C’.normalize()
// true

padStart()，padEnd()
字符串补全长度功能，padStart()用于头部补全，padEnd()用于尾部补全。

//padStart()
'x'.padStart(5, 'ab') // 'ababx'
'x'.padStart(4, 'ab') // 'abax'
//padEnd()
'x'.padEnd(5, 'ab') // 'xabab'
'x'.padEnd(4, 'ab') // 'xaba'

Number.isInteger()
Number.isInteger()用来判断一个值是否为整数。

Number.isInteger(25) // true
Number.isInteger(25.0) // true
Number.isInteger(25.1) // false
Number.isInteger("15") // false
Number.isInteger(true) // false

Number.EPSILON
ES6在Number对象上面，新增一个极小的常量Number.EPSILON。

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

数值的扩展

Number.isFinite(), Number.isNaN()

Number.isFinite()用来检查一个数值是否为有限的（finite）。

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。

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

注意：它们与传统的全局方法isFinite()和isNaN()的区别在于，传统方法先调用Number()将非数值的值转为数值，再进行判断，而这两个新方法只对数值有效，Number.isFinite()对于非数值一律返回false, Number.isNaN()只有对于NaN才返回true，非NaN一律返回false。

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

// ES5的写法

parseInt('12.34') // 12
parseFloat('123.45#') // 123.45

// ES6的写法
Number.parseInt(‘12.34’) // 12
Number.parseFloat(‘123.45#’) // 123.45
这样做的目的，是逐步减少全局性方法，使得语言逐步模块化。

Number.parseInt === parseInt // true
Number.parseFloat === parseFloat // true

Number.isInteger()
Number.isInteger()用来判断一个值是否为整数。

Number.isInteger(25) // true
Number.isInteger(25.0) // true
Number.isInteger(25.1) // false
Number.isInteger("15") // false
Number.isInteger(true) // false

Number.EPSILON
ES6在Number对象上面，新增一个极小的常量Number.EPSILON。

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

Math对象的扩展
Math.trunc()
Math.trunc方法用于去除一个数的小数部分，返回整数部分。

Math.trunc(4.1) // 4
Math.trunc(4.9) // 4
Math.trunc(-4.1) // -4
Math.trunc(-4.9) // -4
Math.trunc(-0.1234) // -0

对于非数值，Math.trunc内部使用Number方法将其先转为数值。

Math.trunc('123.456')
// 123
Math.sign()

Math.sign方法用来判断一个数到底是正数、负数、还是零。

它会返回五种值。
参数为正数，返回+1；
参数为负数，返回-1；
参数为0，返回0；
参数为-0，返回-0;
其他值，返回NaN。

Math.sign(-5) // -1
Math.sign(5) // +1
Math.sign(0) // +0
Math.sign(-0) // -0
Math.sign(NaN) // NaN
Math.sign('foo'); // NaN
Math.sign(); // NaN
Math.cbrt()

Math.cbrt方法用于计算一个数的立方根。（ 3的立方）

Math.cbrt(-1) // -1
Math.cbrt(0)  // 0
Math.cbrt(1)  // 1
Math.cbrt(2)  // 1.2599210498948734

对于非数值，Math.cbrt方法内部也是先使用Number方法将其转为数值。

Math.cbrt('8') // 2 
Math.cbrt('hello') // NaN

Math.clz32()
Math.clz32方法返回一个数的32位无符号整数形式有多少个前导0。

Math.clz32(0) // 32
Math.clz32(1) // 31
Math.clz32(1000) // 22
Math.clz32(0b01000000000000000000000000000000) // 1
Math.clz32(0b00100000000000000000000000000000) // 2

上面代码中，0的二进制形式全为0，所以有32个前导0；1的二进制形式是0b1，只占1位，所以32位之中有31个前导0；1000的二进制形式是0b1111101000，一共有10位，所以32位之中有22个前导0。

Math.imul()
Math.imul方法返回两个数以32位带符号整数形式相乘的结果，返回的也是一个32位的带符号整数。

Math.imul(2, 4)   // 8
Math.imul(-1, 8)  // -8
Math.imul(-2, -2) // 4

Math.fround()
Math.fround方法返回一个数的单精度浮点数形式。

Math.fround(0)     // 0
Math.fround(1)     // 1
Math.fround(1.337) // 1.3370000123977661
Math.fround(1.5)   // 1.5
Math.fround(NaN)   // NaN

Math.hypot()
Math.hypot方法返回所有参数的平方和的平方根。

Math.hypot(3, 4);        // 5
Math.hypot(3, 4, 5);     // 7.0710678118654755
Math.hypot();            // 0
Math.hypot(NaN);         // NaN
Math.hypot(3, 4, 'foo'); // NaN
Math.hypot(3, 4, '5');   // 7.0710678118654755
Math.hypot(-3);          // 3

Math.log2()
Math.log2(x)返回以2为底的x的对数。如果x小于0，则返回NaN。

**Math.log2(3)       // 1.584962500721156
Math.log2(2)       // 1
Math.log2(1)       // 0
Math.log2(0)       // -Infinity
Math.log2(-2)      // NaN
Math.log2(1024)    // 10
Math.log2(1 << 29) // 29**

Math.log10()
Math.log10(x)返回以10为底的x的对数。如果x小于0，则返回NaN。

Math.log10(2)      // 0.3010299956639812
Math.log10(1)      // 0
Math.log10(0)      // -Infinity
Math.log10(-2)     // NaN
Math.log10(100000) // 5

Math.log1p()
Math.log1p(x)方法返回1 + x的自然对数，即Math.log(1 + x)。如果x小于-1，返回NaN。

Math.log1p(1)  // 0.6931471805599453
Math.log1p(0)  // 0
Math.log1p(-1) // -Infinity
Math.log1p(-2) // NaN

Math.expm1()

Math.expm1(x)返回ex - 1，即Math.exp(x) - 1。

Math.expm1(-1) // -0.6321205588285577
Math.expm1(0)  // 0
Math.expm1(1)  // 1.718281828459045

Math.signbit()
Math.sign()用来判断一个值的正负，但是如果参数是-0，它会返回-0。

Math.signbit(2) //false
Math.signbit(-2) //true
Math.signbit(0) //false
Math.signbit(-0) //true

数组的扩展
Array.from()
Array.from方法用于将两类对象转为真正的数组：类似数组的对象（array-like object）和可遍历（iterable）的对象（包括ES6新增的数据结构Set和Map）。
下面是一个类似数组的对象，Array.from将它转为真正的数组。

 let arrayLike = {
    '0':'a',
    '1':'b',
    '2':'c',
    length:3
  };
  //ES5写法
  var arr1 = [].slice.call(arrayLike);
  //ES6写法
  let arr2 = Array.from(arrayLike);
  console.log(arr1);
  console.log(arr2); 

实际应用中，常见的类似数组的对象是DOM操作返回的NodeList集合，以及函数内部的arguments对象。Array.from都可以将它们转为真正的数组。

// arguments对象
function foo() {
  var args = Array.from(arguments);
  // ...
}

只要是部署了Iterator接口的数据结构，Array.from都能将其转为数组。

Array.from('hello')
// ['h', 'e', 'l', 'l', 'o']

let namesSet = new Set(['a', 'b'])
Array.from(namesSet) // ['a', 'b']

如果参数是一个真正的数组，Array.from会返回一个一模一样的新数组。

let arr = Array.from([1,2,3])
console.log(arr) //[1, 2, 3]

扩展运算符（…）也可以将某些数据结构转为数组。

// 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获取一组DOM节点的文本内容
举个例子：

<span>苹果</span>
<span>香蕉</span>
<span>梨</span>
<span>西瓜</span>
<span>桃子</span>
<script>
    var spans = document.querySelectorAll('span');
    //ES5写法
    var names1 = Array.prototype.map.call(spans,function(i){
        return i.textContent;
    })
    console.log(names1);

   //ES6写法
   let spans2 = document.querySelectorAll('span');
   let names2 = Array.from(spans2,i => i.textContent);
   console.log(names2);
</script>

控制台结果都相同：

Array.from可以将数组中布尔值为false的成员转为0。
例如：

Array.from([1, , 2, , 3], (n) => n || 0)
// [1, 0, 2, 0, 3]

经过测试：NaN、undefined转化也为0

let arr = Array.from([1,NaN, 2,undefined, 3], (n) => n || 0)
console.log(arr);

Array.from返回各种数据的类型
举个例子：

function typesOf () {
  return Array.from(arguments, value => typeof value)
}
typesOf(null, [], NaN)
// ['object', 'object', 'number']

Array.of()
Array.of方法用于将一组值，转换为数组。

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

Array方法没有参数、一个参数、三个参数时，返回结果都不一样。只有当参数个数不少于2个时，Array()才会返回由参数组成的新数组。参数个数只有一个时，实际上是指定数组的长度。

Array.of基本上可以用来替代Array()或new Array()，并且不存在由于参数不同而导致的重载。它的行为非常统一。

Array.of() // []
Array.of(undefined) // [undefined]
Array.of(1) // [1]
Array.of(1, 2) // [1, 2]

Array.of总是返回参数值组成的数组。如果没有参数，就返回一个空数组。

数组实例的copyWithin()
数组实例的copyWithin方法，在当前数组内部，将指定位置的成员复制到其他位置（会覆盖原有成员），然后返回当前数组。也就是说，使用这个方法，会修改当前数组

Array.prototype.copyWithin(target, start = 0, end = this.length)

三个参数:
target（必需）：从该位置开始替换数据。
start（可选）：从该位置开始读取数据，默认为0。如果为负值，表示倒数。
end（可选）：到该位置前停止读取数据，默认等于数组长度。如果为负值，表示倒数。*

举个例子：

let arr = Array.of(1,2,3,4,5);
console.log(arr.copyWithin(0,3)) //[4, 5, 3, 4, 5]

上面代码表示将从3号位直到数组结束的成员（4和5），复制到从0号位开始的位置，结果覆盖了原来的1和2。

注意：三个参数都应该是数值，如果不是，会自动转为数值。

例如刚才的例子，输出结果相同：

console.log(arr.copyWithin(0,'3')) //[4, 5, 3, 4, 5]

数组实例的find()和findIndex()
find方法，用于找出第一个符合条件的数组成员。它的参数是一个回调函数，所有数组成员依次执行该回调函数，直到找出第一个返回值为true的成员，然后返回该成员。如果没有符合条件的成员，则返回undefined。

[1, 4, -5, 10].find((n) => n < 0)
// -5

find方法的回调函数可以接受三个参数，依次为当前的值、当前的位置和原数组。
切记：是返回第一个符合条件的值，就不会找下一个了。例如：

  var arr = [1, 5, 10, 15].find(function(value, index, arr) {
  return value > 9;

}) 

 console.log(arr)  //10

findIndex方法的用法与find方法非常类似，返回第一个符合条件的数组成员的位置，如果所有成员都不符合条件，则返回-1。

切记：是返回第一个符合条件值的索引值

[1, 5, 10, 15].findIndex(function(value, index, arr) {
  return value > 9;
}) // 2

另外，这两个方法都可以发现NaN，弥补了数组的IndexOf方法的不足。

[NaN].indexOf(NaN)
// -1
[NaN].findIndex(y => Object.is(NaN, y))

注意：Object.is()是ES6新增的用来比较两个值是否严格相等的方法，与===的行为基本一致。

例如：

var a = 3; 
var b = "3"; 

a==b;    // true
a===b;   // false，因为*a*，*b*的类型不一样 
Object.is( a, b );  //false，因为*a*，*b*的类型不一样 

数组实例的fill()
fill方法使用给定值，填充一个数组。

  let arr = new Array('a','b','c');
  console.log(arr.fill(7)) //[7, 7, 7];

//fill方法用于空数组的初始化非常方便。数组中已有的元素，会被全部抹去。

  let arr2 = new Array(3).fill(6);
  console.log(arr2)// [6, 6, 6]

fill方法还可以接受第二个和第三个参数，用于指定填充的起始位置和结束位置
例如：fill方法从1号位开始，向原数组填充7，到2号位之前结束。

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

entries()，keys()和values()用于遍历数组
用于遍历数组。它们都返回一个遍历器对象，可以用for…of循环进行遍历。

keys()是对键名的遍历、values()是对键值的遍历，entries()是对键值对的遍历。

//entries()是对键值对的遍历

 let arr = new Array('A','B','C');
   for(let [index,elem] of arr.entries()){
      console.log(index,elem);
   }

//keys()是对键名的遍历

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

//values()是对键值的遍历
let arr = [['姓名','阿蔡'],['年龄','23']];
   for(var elem of arr.values()){  
         console.log(elem); 
  }

includes()
Array.prototype.includes方法返回一个布尔值，表示某个数组是否包含给定的值，与字符串的includes方法类似。

[1, 2, 3].includes(2);     // true
[1, 2, 3].includes(4);     // false
[1, 2, NaN].includes(NaN); // true