前言

我正在参加「掘金·启航计划」

参考资料

Array - JavaScript | MDN

数组方法

说明

以下均对数组原型的操作

注意: MDN中如果是 Array.xxx 就可以直接用，如果是 Array.prototype.xxx 既可以直接用也可以 数组.xxx ，前者存在数组函数中， 后者存在数组原型中

以下均对数组原型的操作,其它里面不是

后面看到 modified , 代表 会改变原数组

增

• arr.push() 在尾部加元素，返回数组的最新长度 modified

• arr.unshift() 在头部加元素，返回数组的最新长度 modified

• arr.splice() 在中间添加元素，改变原数组 modified

  • arr.splice(index, 0, 'x') 在 index 处插入'x'

• arr.concat() 连接两个或更多的数组，并返回新数组

  • arr.concat(arr1, arr2) 连接多个数组

删

• arr.pop() 在尾部弹出元素，返回数组的最新长度 modified

• arr.shift() 在头部提出元素，返回数组的最新长度 modified

• arr.splice() 在中间或结尾删除元素，改变原数组 modified

  • arr.splice(start, c, replacement) 从 arr 的 start 开始删掉 c 个元素，并替换为 replacement, 同时返回被删掉的元素组成的数组
  • arr.splice(index, 2) 从 index 开始删除 2 个
  • arr.splice(index, 2, 'x', 'y') 从 index 开始删除 2 个，并添加 'x' 'y'

• arr.slice() 截取一个数组的一部分（不改变原数组）

  • arr.slice(0) 复制一个数组 注意： JS 只提供浅拷贝
  • arr.slice(1) 从第二个元素开始
  • arr.slice(index1, index2) 截取下标 大于等于 index1 ，小于 index2 的

改

• arr.splice(index, 1, 'x') 把 arr[index] 的值改成 ‘x’ modified

• arr.copyWithin() 从数组的指定位置拷贝元素到数组的另一个指定位置 modified

  var a = ['a', 'b', 'c', 'd', 'e']
  a.copyWithin(0, 2, 3) 
  // 在索引为 0 的这个位置， 从索引 2 到 3 之间（不包括3的）取索引 2 的位置，放到索引 0 的位置上替换之前的值 
  // 结果 ['c', 'b', 'c', 'd', 'e']  
  // 这个 a 也变了, 会改变原数组
  
  a.copyWithin(1, 2, 4) 
  // ['c', 'b', 'c', 'd', 'e'] 选中多个的话，它会依次替换原有数值
  // 结果 ['c', 'c', 'd', 'd', 'e']
  

• arr.fill() 使用一个固定值来全部填充数组 modefied

  var arr = [0, 1, 2]
  arr.fill(2)  // 填一个参数的意思是 数组用 2 来填充
  // [2, 2, 2]
  
  var arr = [0, 4, 6]
  arr.fill(2, 2) // 第一个参数表示填充的数，第二个参数表示 被填充数组的索引
  // [0, 4, 2]
  arr.fill(1, 1) 
  // [0, 1, 2]
  

查

• arr.indexOf() 正向返回要查找的元素在数组中的位置，如果没找到则返回-1

• arr.lastIndexOf() 反向返回要查找的元素在数组中的位置，如果没找到则返回 -1

• arr.at() 返回该索引的值，允许正数和负数。负整数从数组中的最后一个开始倒数。

• arr.includes() 查找元素，找到返回true，否则false ，可以正确判断数组里是否有 NaN

• arr.find()返回第一个匹配的元素

  • arr.find(item ⇒ item % 2 === 0) 找第一个偶数
  • 返回符合传入测试（函数）条件的数组元素,从数组的一堆对象里找出满足条件的第一个对象, find() 只找一个，filter() 可找多个

  var a = [0, 1, 2] 
  a.find( (i) => i === 2 ) // 2  也可写成 a.find(i => i === 2)
  var a = [{name:'a1',  {name: 'a2', value: 'xxx'}, {name: 'a3'}]
  a.find((item) => item.name === 'a2')  // {name: 'a2', value: 'xxx'}
  
  // 不用 find 
  for(let i = 0; i < a.length; i++){
     if(a[i].name === 'a2'){
        console.log(a[i])
     }
  }
  
  // find 和 filter 区别
  var a = [{name: 'a1', age: 80}, {name: 'a2', age: 18}, {name: 'a3', age: 18}]
  a.find(item => item.age === 18) // {name: 'a2', age: 18}
  a.filter(item => item.age === 18) // {name: 'a2', age: 18}, {name: 'a3', age: 18}
  

• arr.findIndex() 返回符合传入测试（函数）条件的数组元素索引

  • arr.findIndex(item ⇒ item % 2 === 0) 找第一个偶数的索引（下标）

排序

• arr.reverse() 反转顺序 modefied

• arr.sort() 自定义顺序 modefied

  • 默认变成字符串，同时按字典序排
  • arr.sort((a,b) ⇒ a - b)

转换

• join() 将一个 数组 / 类数组 对象的所有元素连接成一个字符串，并返回这个字符串

  • arr = ['dasd','dada','fgsdgsd']
  • arr.join(';') // 通过分号连接 'dasd;dada;fgsdgsd’
  • arr.join() // 默认连接 'dasd,dada,fgsdgsd’

迭代

• arr.some() 对数组每一项都运行传入的函数，如果有任何一项函数返回 true ，则这个方法返回 true， 既 检测数组元素中是否有元素符合指定条件

  let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]
  let someResult = numbers.some((item, index, array) => item > 2)
  console.log(someResult) // true
  

• arr.every() 对数组每一项都运行传入的函数，如果所有项函数满足条件，则这个方法返回 true（可以用来做全选框），既 检测数值元素的每个元素是否都符合条件

  var ages = [3, 10, 18, 20]
  
  function checkAdult(age) {
  return age >= 18
  }
  
  ages.every(checkAdult) // false
  

• arr.forEach() 用 for 访问 array 每一项， 对每一项调用 fn(array[i], i, array)

  let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
  numbers.forEach((item, index, array) => {
      // 执行某些操作
  })
  

• arr.map() 映射， n 变 n

  for (let i = 0; i < arr.length; i++) {
  	arr[i] = arr[i] * arr[i]
  }
  
  // 相当于
  arr.map( item => item * item )
  

• arr.filter() 过滤 ， n 变少

  	arr.filter( item => item % 2 === 0 )
  

• arr.reduce() n 变 1 ， 从数组的第一项开始，逐个遍历到最后

  let sum = 0
  let arr = [1, 2, 3, 4, 5, 6, 7, 8]
  for (let i = 0; i < arr.length; i++) {
    sum += arr[i]
  }
  
  // 相当于
  arr.reduce((sum, item) => {return sum + item}, 0)
  
  // reduce 初始值为 0
  

• arr.entries() 一项一项的去读数组的 key 和 value

  arr.entries().next()
  

其它

• Array.isArray() 用于确定传递的值是否是一个 Array

• Array.from() 对一个类似数组或可迭代对象创建一个新的，浅拷贝的数组实例，既 对伪数组转换成数组

  • ES5中 使用 Array.prototype.splice.call(a, 0) 把伪数组变成数组，这个 a 是那个伪数组

  • 以上 slice 做了这几件事

    var a = { 0: '000',1: '111', 2: '222',length: 3}
       Array.prototype.splice.call(a, 0)
       // slice做了这几件事
       function slice(假数组){
          var b = []  // 这个可以写成 =>   var b = new Array()
          for(let i = 0; i < 假数组.length; i++){
             b[i] = 假数组[i]
          }
          return b
       }
    

• Array.of() 创建一个具有可变数量参数的新数组实例，不考虑参数的数量或类型

  • Array.of(1, {}, 'xx', new set()) 打印出 [1, {}, ‘xx’, new set()]

• arr.flat() 按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。

  • a.flat(Infinity) 全部展平

• arr.keys() 返回一个包含数组中每个索引键的Array Iterator对象。

• arr.values() 返回一个新的 Array Iterator对象，该对象包含数组每个索引的值。

• arr.toString() 返回一个字符串，表示指定的数组及其元素