ES6实用新增

1.立即执行的匿名函数

// IIFE 写法
(function () {
  var tmp = ...;
  ...
}());
// 块级作用域写法
{
  let tmp = ...;
  ...
}

2.函数参数的解构赋值和默认值

function move({x = 0, y = 0} = {}) {
  return [x, y];
}
move({x: 3, y: 8}); // [3, 8]
move({x: 3}); // [3, 0]
move({}); // [0, 0]
move(); // [0, 0]

函数move的参数是一个对象，通过对这个对象进行解构，得到变量x和y的值。如果解构失败，x和y等于默认值。

function move({x, y} = { x: 0, y: 0 }) {
  return [x, y];
}
move({x: 3, y: 8}); // [3, 8]
move({x: 3}); // [3, undefined]
move({}); // [undefined, undefined]
move(); // [0, 0]

为函数move的参数指定默认值，而不是为变量x和y指定默认值，所以会得到与前一种写法不同的结果。

3.模板字符串

function authorize(user, action) {
  if (!user.hasPrivilege(action)) {
    throw new Error(
      // 传统写法为
      // 'User '
      // + user.name
      // + ' is not authorized to do '
      // + action
      // + '.'
      `User ${user.name} is not authorized to do ${action}.`);
  }
}
//可嵌套
const tmpl = addrs => `
  <table>
  ${addrs.map(addr => `
    <tr><td>${addr.first}</td></tr>
    <tr><td>${addr.last}</td></tr>
  `).join('')}
  </table>
`;

4.字符串新增方法

        indexOf新增3方法

• includes()：返回布尔值，表示是否找到了参数字符串。
• startsWith()：返回布尔值，表示参数字符串是否在原字符串的头部。
• endsWith()：返回布尔值，表示参数字符串是否在原字符串的尾部。
• 这三个方法都支持第二个参数，表示开始搜索的位置。

let s = 'Hello world!';
s.startsWith('world', 6) // true
s.includes('Hello', 6) // false
//从原文中 第6个位置开始查找第一个参数

s.endsWith('Hello', 5) // true
//从原文中前5个位置查找第一个参数

         repeat()

'x'.repeat(3) // "xxx"
'x'.repeat('3') // "xxx"
'hello'.repeat(2) // "hellohello"
'na'.repeat(0) // ""
'na'.repeat(-1) //RangeError
'na'.repeat(-0.9) // "" 取小数时会向上取整 且repeat(-0)=repeat(0)
'na'.repeat(NaN) // ""
'na'.repeat('na') // ""

        字符串补全：padStart()，padEnd()

'x'.padStart(5, 'ab') // 'ababx'
'x'.padStart(4, 'ab') // 'abax'
'x'.padEnd(5, 'ab') // 'xabab'
'x'.padEnd(4, 'ab') // 'xaba'
 //接受两个参数，第一个参数是字符串补全生效的 最大长度， 第二个参数是用来补全的字符串。

'xxx'.padStart(2, 'ab') // 'xxx'
'xxx'.padEnd(2, 'ab') // 'xxx'
//字符串的长度，等于或大于最大长度，则字符串补全不生效，返回原字符串

'abc'.padStart(10, '0123456789')
// '0123456abc'  实际使用较多
//如果用来补全的字符串与原字符串，两者的长度之和超过了最大长度，则会截去超出位数的补全字符串

'x'.padStart(4) // '   x'
'x'.padEnd(4) // 'x   '
//省略第二个参数，默认使用空格补全长度

        空白清除：trimStart()，trimEnd()

const s = '  abc  ';
s.trim() // "abc"
s.trimStart() // "abc  "
s.trimEnd() // "  abc"

5.数组新增方法

        Number.isFinite() 如果参数类型不是数值，Number.isFinite一律返回false

        Number.isNaN()  如果参数类型不是NaN，Number.isNaN一律返回false

// ES5的写法
parseInt('12.34') // 12
parseFloat('123.45#') // 123.45
// ES6的写法
Number.parseInt('12.34') // 12
Number.parseFloat('123.45#') // 123.45

6.Math新增

        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('123.456') // 123
Math.trunc(true) //1
Math.trunc(false) // 0
Math.trunc(null) // 0
Math.trunc(NaN);      // NaN
Math.trunc('foo');    // NaN
Math.trunc();         // NaN
Math.trunc(undefined) // NaN

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

Math.sign(-5) // -1
Math.sign(5) // +1
Math.sign(0) // +0
Math.sign(-0) // -0
Math.sign(NaN) // NaN
Math.sign('')  // 0
Math.sign(true)  // +1
Math.sign(false)  // 0
Math.sign(null)  // 0
Math.sign('9')  // +1
Math.sign('foo')  // NaN
Math.sign()  // NaN
Math.sign(undefined)  // NaN

Math.cbrt()方法用于计算一个数的立方根

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

7.尾调用优化

function f(x) {
  if (x > 0) {
    return m(x)
  }
  return n(x);
}
//尾调用不一定出现在函数尾部，只要是最后一步操作即可

 常用优化：尾递归

function tailFactorial(n, total) {
  if (n === 1) return total;
  return tailFactorial(n - 1, n * total);
}
function factorial(n) {
  return tailFactorial(n, 1);
}
factorial(5) // 120

8.数组扩展

        合并数组：数组是复合的数据类型，直接复制的话，只是复制了指向底层数据结构的指针，而不是克隆一个全新的数组，以下都是浅拷贝

const arr1 = ['a', 'b'];
const arr2 = ['c'];
const arr3 = ['d', 'e'];
// ES5 的合并数组
arr1.concat(arr2, arr3);
// [ 'a', 'b', 'c', 'd', 'e' ]
// ES6 的合并数组
[...arr1, ...arr2, ...arr3]
// [ 'a', 'b', 'c', 'd', 'e' ]

        Array.from() 方法用于将两类对象转为真正的数组

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

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

数组实例的 includes()

[1, 2, 3].includes(2)     // true
[1, 2, 3].includes(4)     // false
[1, 2, NaN].includes(NaN) // true
//该方法的第二个参数表示搜索的起始位置，如果第二个参数为负数，则表示倒数的位置如果这时它大于数组长度（比如第二个参数为-4，但数组长度为3），则会重置为从0开始
[1, 2, 3].includes(3, 3);  // false
[1, 2, 3].includes(3, -1); // true

数组降维 flat()

[1, [2, [3]]].flat(Infinity)
// [1, 2, 3]
//flat的参数代表拉平几次 Infinity时会拉平所有
//原数组有空位，flat()方法会跳过空位
[1, 2, , 4, 5].flat()
// [1, 2, 4, 5]