zoukankan      html  css  js  c++  java
  • ES6 数组、对象的扩展

    8. 数组的扩展

    1. 扩展运算符(...),将一个数组转为用逗号分隔的参数序列。

      • 复制数组 const a2=[...a1]
      • 合并数组 [...arr1, ...arr2, ...arr3]; arr1.concat(arr2, arr3);// ES5 的合并数组 这是浅拷贝,如果修改了原数组的成员,会同步反映到新数组。
      • 替代函数的 apply 方法
        // ES6 的写法
        let arr1 = [0, 1, 2];
        let arr2 = [3, 4, 5];
        arr1.push(...arr2);
    2. Array.from() 方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括 ES6 新增的数据结构 Set 和 Map)。

      let ps = document.querySelectorAll('p');
      Array.from(ps).filter(p => {
        return p.textContent.length > 100;
      });
    3. Array.of() 方法用于将一组值,转换为数组

      Array.of(3, 11, 8) // [3,11,8]
    4. 数组实例的 copyWithin()
      【替换位置,读取数据开始位置,结束位置】,如果为负值,表示倒数。

      [1, 2, 3, 4, 5].copyWithin(0, 3)
      // [4, 5, 3, 4, 5]
    5. 数组实例的 find()findIndex()
      find()所有数组成员依次执行该回调函数,直到找出第一个返回值为true的成员,然后返回该成员。如果没有符合条件的成员,则返回undefined。
      findIndex()

    6. fill() 方法使用给定值,填充一个数组

    7. entries()keys() , values() 用于遍历数组
      keys()是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历。

      for (let [index, elem] of ['a', 'b'].entries()) {
        console.log(index, elem);
      }
      // 0 "a"
      // 1 "b"
    8. includes() 表示某个数组是否包含给定的值
      indexOf方法有两个缺点,一是不够语义化,它的含义是找到参数值的第一个出现位置,所以要去比较是否不等于-1,表达起来不够直观。二是,它内部使用严格相等运算符(===)进行判断,这会导致对NaN的误判。

    9. flat()flatMap()
      flat()用于将嵌套的数组“拉平”,变成一维的数组。该方法返回一个新数组,对原数据没有影响。可以将flat()方法的参数写成一个整数,表示想要拉平的层数,默认为1,Infinity所有层。如果原数组有空位,跳过空位。
      Array.prototype.map(),然后对返回值组成的数组执行flat()方法。该方法返回一个新数组,不改变原数组。

      // 相当于 [[2, 4], [3, 6], [4, 8]].flat()
      [2, 3, 4].flatMap((x) => [x, x * 2])
      // [2, 4, 3, 6, 4, 8]
    10. 数组的空位
      ES6 则是明确将空位转为undefined

    9. 对象的扩展

    1. 属性、方法简写

      {f} 等同于 {f:f}
      method() {
          return "Hello!";
      }
      //等同于
      method: function() {
          return "Hello!";
      }
    2. 属性名表达式
      obj['a' + 'bc'] = 123;

    3. 方法的name属性返回函数名(即方法名)

    4. Object.is() 比较两个值是否相等

    5. Object.assign方法用于对象的合并

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

      Object.assign方法的第一个参数是目标对象,后面的参数都是源对象。
      注意:如果目标对象与源对象有同名属性,或多个源对象有同名属性,则后面的属性会覆盖前面的属性。是浅拷贝

    6. 属性的可枚举性和遍历

    7.
    8.
    9.

    1. Object.keys(),Object.values(),Object.entries()
      Object.keys() 返回一个数组,所有键名
      Object.values() 返回一个数组,所有属性的值
      Object.entries() 键值对数组 [ ["key", "value"], ["key", value] ]

    2. 对象的扩展运算符(...)
      和数组相似

  • 相关阅读:
    leetcode 190 Reverse Bits
    vs2010 单文档MFC 通过加载位图文件作为客户区背景
    leetcode 198 House Robber
    记忆化搜索(DP+DFS) URAL 1183 Brackets Sequence
    逆序数2 HDOJ 1394 Minimum Inversion Number
    矩阵连乘积 ZOJ 1276 Optimal Array Multiplication Sequence
    递推DP URAL 1586 Threeprime Numbers
    递推DP URAL 1167 Bicolored Horses
    递推DP URAL 1017 Staircases
    01背包 URAL 1073 Square Country
  • 原文地址:https://www.cnblogs.com/conglvse/p/9759137.html
Copyright © 2011-2022 走看看