ES7特性

数组includes()方法，用来判断一个数组是否包含一个指定的值，根据情况，如果包含则返回true，否则返回false。
指数运算符，它与 Math.pow(a, b)相同。

Array.prototype.includes()

includes() 函数用来判断一个数组是否包含一个指定的值，如果包含则返回 true，否则返回false。

includes 函数与 indexOf 函数很相似.

arr.includes(x)
arr.indexOf(x) >= 0

在ES7之前判断数字中是否包含某个元素

使用indexOf()验证数组中是否存在某个元素，这时需要根据返回值是否为-1来判断：

let arr = ['react', 'angular', 'vue'];

if (arr.indexOf('react') !== -1)
{
    console.log('react存在');
}

ES7之后用includes()判断

let arr = ['1', '2', '3'];

if (arr.includes('1'))
{
    console.log('1');
}

指数操作符

在ES7中引入了指数运算符**，**具有与Math.pow(..)等效的计算结果。

不使用指数操作符

使用自定义的递归函数calculateExponent或者Math.pow()进行指数运算：

function calculateExponent(base, exponent)
{
    if (exponent === 1)
    {
        return base;
    }
    else
    {
        return base * calculateExponent(base, exponent - 1);
    }
}

console.log(calculateExponent(2, 10)); // 输出1024
console.log(Math.pow(2, 10)); // 输出1024

使用指数操作符

使用指数运算符**，就像+、-等操作符一样：

console.log(2**10);// 输出1024

ES8特性

async/await
Object.values()
Object.entries()
padStart()和padEnd()，填充字符串达到当前长度
函数参数列表结尾允许逗号
Object.getOwnPropertyDescriptors()

async/await

async function process(array) {
  for await (let i of array) {
    doSomething(i);
  }
}

Object.values()

Object.values()是一个与Object.keys()类似的新函数，但返回的是Object自身属性的所有值，不包括继承的值。

假设我们要遍历如下对象obj的所有值：

const obj = {a: 1, b: 2, c: 3};
const values=Object.values(obj1);
console.log(values);//[1, 2, 3]

Object.values()为我们省去了遍历key，并根据这些key获取value的步骤。

Object.entries()

Object.entries()函数返回一个给定对象自身可枚举属性的键值对的数组。

for(let [key,value] of Object.entries(obj1)){
	console.log(`key: ${key} value:${value}`)
}
//key:a value:1
//key:b value:2
//key:c value:3

String padding

在ES8中String新增了两个函数String.prototype.padStart和String.prototype.padEnd，允许将空字符串或其他字符串添加到原始字符串的开头或结尾。

String.padStart(targetLength,[padString])
- targetLength:当前字符串需要填充到的目标长度。如果这个数值小于当前字符串的长度，则返回当前字符串本身。
- padString:(可选)填充字符串。如果字符串太长，使填充后的字符串长度超过了目标长度，则只保留最左侧的部分，其他部分会被截断，此参数的缺省值为 " "。

console.log('0.0'.padStart(4,'10')) //10.0
console.log('0.0'.padStart(20))// 0.00

String.padEnd(targetLength,padString])
- targetLength:当前字符串需要填充到的目标长度。如果这个数值小于当前字符串的长度，则返回当前字符串本身。
- padString:(可选) 填充字符串。如果字符串太长，使填充后的字符串长度超过了目标长度，则只保留最左侧的部分，其他部分会被截断，此参数的缺省值为 " "；

console.log('0.0'.padEnd(4,'0')) //0.00    
console.log('0.0'.padEnd(10,'0'))//0.00000000

Object.getOwnPropertyDescriptors()

Object.getOwnPropertyDescriptors()函数用来获取一个对象的所有自身属性的描述符,如果没有任何自身属性，则返回空对象。

Object.getOwnPropertyDescriptors(obj)

const obj2 = {
	name: 'XXX',
	get age() { return '18' }
};
Object.getOwnPropertyDescriptors(obj2)
// {
//   age: {
//     configurable: true,
//     enumerable: true,
//     get: function age(){}, //the getter function
//     set: undefined
//   },
//   name: {
//     configurable: true,
//     enumerable: true,
//		value:"XXX",
//		writable:true
//   }
// }

ES9新特性

Promise.finally()
Rest/Spread 属性

Promise.finally()

一个Promise调用链要么成功到达最后一个.then()，要么失败触发.catch()。在某些情况下，你想要在无论Promise运行成功还是失败，运行相同的代码，可以使用.finally()。

function doSomething() {
  doSomething1()
  .then(doSomething2)
  .then(doSomething3)
  .catch(err => {
    console.log(err);
  })
  .finally(() => {
    // finish here!
  });
}

Rest/Spread 属性

ES2015引入了Rest参数和扩展运算符

Rest剩余参数）：

在对象的解构赋值中，Rest属性可以用来收集对象中剩余的属性，并将它们组成一个新的对象。这样可以方便地从对象中提取部分属性，而不需要一个个地指定每个属性的名称。

const person = {
  name: 'John',
  age: 30,
  country: 'USA',
  job: 'Engineer'
};

const { name, age, ...other } = person;

console.log(name);  // 'John'
console.log(age);   // 30
console.log(other); // { country: 'USA', job: 'Engineer' }

在这个例子中，name 和 age 是从 person 对象中解构出来的属性，而 ...other 则收集了剩余的属性，并组成了一个新的对象。

Spread（展开操作符）：

在对象的解构赋值中，Spread属性可以将一个对象的属性展开成多个独立的变量，或者合并多个对象的属性到一个新的对象中。这样可以方便地将对象的属性拷贝到其他对象中，或者将多个对象的属性合并到一个对象中。

const person = {
  name: 'John',
  age: 30
};

const job = 'Engineer';

const personWithJob = {
  ...person,
  job
};

console.log(personWithJob);
// { name: 'John', age: 30, job: 'Engineer' }

在这个例子中，personWithJob 对象通过Spread属性将 person 对象的属性展开，然后再添加了 job 属性，得到了一个新的对象。

ES10新特性

引入了 flat() 和 flatMap() 方法，用于扁平化数组和映射并降维数组。
新增了 trimStart() 和 trimEnd() 方法，用于删除字符串头部和尾部的空格。
新增了 Symbol.description 属性，用于获取 Symbol 对象的描述字符串。
新增了 Object.fromEntries() 方法，用于将键值对数组转换为对象。

`flat()` 和 `flatMap()` 方法：

flat() 方法：用于将嵌套的数组扁平化为指定深度的一维数组。如果不提供深度参数，则默认扁平化所有嵌套层级。

const nestedArray = [1, 2, [3, 4, [5, 6]]];
const flatArray = nestedArray.flat(); // [1, 2, 3, 4, [5, 6]]

flatMap() 方法：首先映射每个元素，然后将结果压缩成一个新数组。与 map() 方法不同的是，flatMap() 方法会先执行映射函数，然后再对结果进行一次扁平化。

const numbers = [1, 2, 3, 4];
const doubled = numbers.flatMap(num => [num, num * 2]); // [1, 2, 2, 4, 3, 6, 4, 8]

`trimStart()` 和 `trimEnd()` 方法：

trimStart() 方法：用于删除字符串头部（开头）的空格。

const str = "   Hello World   ";
const trimmed = str.trimStart(); // "Hello World   "

trimEnd() 方法：用于删除字符串尾部（结尾）的空格。

const str = "   Hello World   ";
const trimmed = str.trimEnd(); // "   Hello World"

`Symbol.description` 属性：

Symbol.description 属性允许获取Symbol对象的可选描述字符串。

const mySymbol = Symbol('My custom symbol');
console.log(mySymbol.description); // 'My custom symbol'

`Object.fromEntries()` 方法：

Object.fromEntries() 方法将一个键值对的数组转换为一个对象。

const entries = [['a', 1], ['b', 2], ['c', 3]];
const obj = Object.fromEntries(entries); // { a: 1, b: 2, c: 3 }

从ES7到ES10的特性总结