ES7 ES8 ES9 ES10新特性

ES7 新特性

  • Array.prototype.includes()方法来判断一个数组是否包含一个指定的值,根据情况,如果包含则返回true,否则返回false。
    在 es7 之前有两种方式 判断一个数组中是否包含某个元素代码如下:
第一种方式:  indexof()
var arr = [1, 2, 3, 18, 20];
for(var=i; i {
        return item > 50;
      });
      console.log(newarr); // 返回第一个符合条件的数组元素

var arr = [1, 2, 3, 100, 101, 102];
      var newarr = arr.findIndex((item, index) => {
        return item > 50;
      });
      console.log(newarr); // 返回第一个符合条件的数组元素的下标

ES7新特性 arr.includes() 找到数组中是否包含某一项 ,返回的是布尔值

var arr = [1,2,3,4,5];
console.log(arr.includes(1))  true

es7 求幂运算符:

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

Object.values方法返回一个数组,成员是参数对象 key value当中的value,组成的是一个数组自身的(不含继承的)所有可遍历(enumerable)属性的键值。

var obj = { a: "吃饭", b: "睡觉", c: "打豆豆~" };
      var arr = Object.values(obj);
      console.log(arr);  结果: ["吃饭", "睡觉", "打豆豆~"]

Object.entries()方法返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历(enumerable)属性的键值对数组。这个特性我们后面介绍ES10的Object.fromEntries()还会再提到。

 var obj = { a: "吃饭", b: "睡觉", c: "打豆豆~" };
      var arr = Object.entries(obj);
console.log(arr); // 结果
      [
        [a, "吃饭"],
        [b, "睡觉"],
        [c, "打豆豆~"]
      ];

ES8 引入了 Object.getOwnPropertyDescriptors() 返回指定对象所有自身属性(非继承属性)的描述对象。

ES5的Object.getOwnPropertyDescriptor()方法会返回某个对象属性的描述对象

const obj = {
  name: '浪里行舟',
  get bar () {
    return 'abc'
  }
}
console.log(Object.getOwnPropertyDescriptors(obj))

该方法的引入目的,主要是为了解决Object.assign()无法正确拷贝get属性和set属性的问题。

const source = {
  set foo (value) {
    console.log(value)
  },
  get bar () {
    return '浪里行舟'
  }
}
const target2 = {}
Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source))
console.log(Object.getOwnPropertyDescriptor(target2, 'foo'))

ES9新特性 for await of

for of 能够遍历Symbol.iterator的同步迭代数据,但是不能遍历Symbol.iterator异步迭代数据
ES9 新增的 for await of 可以用来处理异步的迭代数据

//   for await of遍历
function Gen (time) {
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      resolve(time)
    }, time)
  })
}
async function test () {
  let arr = [Gen(2000), Gen(100), Gen(3000)]
  for await (let item of arr) {
    console.log(Date.now(), item.then(console.log))
  }
}
test()
//结果: 
// 1575536194608 2000
// 1575536194608 100
// 1575536195608 3000

扩展运算符的使用 ...

var obj = {
        a: "吃饭",
        b: "睡觉",
        c: "打豆豆~"
      };
      var ipt = {
        ...obj,
        d: "看电影"
      };
      console.log(ipt);

剩余运算符的使用 ...rest

 var obj = {
        a: "吃饭",
        b: "睡觉",
        c: "打豆豆~"
      };
      var { a, ...rest } = obj;
      console.log(a, rest); // 结果: 吃饭 {b: "睡觉", c: "打豆豆~"}b: "睡觉"c: "打豆豆~"

Array.prototype.flat()

将多维数组转为一维数组

flat() 默认值是1 ,意思将二维数组转为一维数组
当flat() 是2,意思将三维数组转为一维数组

将二维数组转为一维数组

var arr = [1, 2, 3, [4, 5, 6,]];
      var arr1 = arr.flat(1);
      console.log(arr1);

将三维数组转为一维数组

var arr = [1, 2, 3, [4, 5, 6, [7, 8, 9]]];
      var arr1 = arr.flat(2);
      console.log(arr1);

你可能感兴趣的:(ES7 ES8 ES9 ES10新特性)