常见数组的api

1.改变原数组的方法

① push/pop方法

push:在数组尾部添加元素,会增加数组的长度。可以一次添加多个元素

pop:在数组尾部删除元素,会减少数组的长度

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

let b =arr.pop();
console.log(arr); // [1, 2, 3, 4, 5]
console.log(b); // 6

② shift/unshift方法

unshift:在头部添加元素,会增加数组的长度

shift:在头部删除元素,会减少数组的长度

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

arr.unshift(6);
console.log(arr); // [6, 2, 3, 4, 5]

 ③ sort:排序

对数组进行排序

var arr = [21, 1, 3, 45, 2];
arr.sort();
console.log(arr); // (5) [1, 2, 21, 3, 45]
arr.sort((a, b)=>a-b); 
console.log(arr); // (5) [1, 2, 3, 21, 45]

④ reverse:数组翻转

var arr = [1,2,3];
arr.reverse();
console.log(arr); // [3,2,1]

⑤ fill:元素填充

fill()方法用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引

//格式   
arr.fill( value[,  start [, end]])

参数

value:用来填充数组元素的值

start:可选,起始索引,默认值为0

end:可选,终止索引,默认值为this.length

var arr = [1, 2, 3, 2, 5];
arr.fill(1,2,4); // 用1填充数组中从起始索引到终止索引内的全部元素
console.log(arr); // (5) [1, 2, 1, 1, 5]

⑥ splice方法

它通过删除或替换现有元素或者原地添加新的元素来修改数组,并以数组的形式返回被修改的内容。它是功能最强大的一个方法

//格式   
.splice(start[, deleteCount[, item1[, item2[, ...]]]])

参数

start
指定修改的开始位置(从0计数)。如果超出了数组的长度,则从数组末尾开始添加内容;如果是负值,则表示从数组末位开始的第几位(从-1计数,这意味着-n是倒数第n个元素并且等价于array.length-n);如果负数的绝对值大于数组的长度,则表示开始位置为第0位。

deleteCount: 可选
整数,表示要移除的数组元素的个数。
如果 deleteCount 大于 start 之后的元素的总数,则从 start 后面的元素都将被删除(含第 start 位)。
如果 deleteCount 被省略了,或者它的值大于等于array.length - start(也就是说,如果它大于或者等于start之后的所有元素的数量),那么start之后数组的所有元素都会被删除。
如果 deleteCount 是 0 或者负数,则不移除元素。这种情况下,至少应添加一个新元素。

item1, item2, ... :可选
要添加进数组的元素,从start 位置开始。如果不指定,则 splice() 将只删除数组元素。

可以实现的功能:添加功能,删除功能,修改功能

var arr = [1, 2, 3];
arr.splice(0,0,'a','b'); // 向数据的头部添加元素'a', 'b'
arr.splice(0,3); // 从下标为0的元素开始,删除3个元素。以数组的格式返回删除的元素
arr.splice(2,1,"a");// 从下标为2的元素开始,删除1个,并插入a。相当于arr[2] = "a"。以数组的格式返回删除的元素

2.不改变原数组的方法

① concat

作用:实现拼接数组,不会改变数组,会返回一个拼接后的新数组

var arr1 = [1,2,3];
var arr2 = [3,4];
arr1.concat(arr2);
console.log(arr1.length); // 3。arr1不会变化。
console.log(arr1.concat(arr2)) // [1, 2, 3, 3, 4]

② slice方法

作用:从数组中截取出一部分,并以数组的格式返回,不会改变原数组

// 格式
    slice(下标起点,下标终点)

var arr = [1,2,3,4,5,6];
console.log(arr); // (6) [1, 2, 3, 4, 5, 6]
console.log(arr.length); // 6
console.log(arr.slice(1,4)); // (3) [2, 3, 4]

③ join方法

作用:返回一个字符串。不会改变原数组。

var arr = [1,2,3,4,5];
arr.join('-');
console.log(arr); // [1, 2, 3, 4, 5]
console.log(arr.join('-')); // '1-2-3-4-5'

④  indexOf / lastIndexOf方法

在数组中查找元素所在的下标。不会改变数组,返回指定数值的数组下标

var arr = [1, 2, 3, 2, 5];
console.log(arr.indexOf(2)); // 1 返回值为2的数组的下标
console.log(arr.indexOf(2,2)); // 3 第一个参数表示要查找的数,第二个参数表示查找起点位置的索引
console.log(arr.indexOf(6)); // -1
console.log(arr.lastIndexOf(2)); // 3 从数组的末尾开始向前查找,返回正序下标
console.log(arr.lastIndexOf(2,2)); // 1 从数组的末尾开始向前查找,返回正序下标

⑤  forEach方法

最常见的遍历操作,它不会改变数组且方法没有返回值

  var arr = [1, 2, 3, 2, 5];
  arr.forEach(function(a, index, array) { 
    // 循环遍历,对每一项运行给定函数,这个方法没有返回值
    // 参数分别为:遍历的数组内容,内容对应的数组索引,数组本身
  console.log(a, index, array === arr);
    // 1 0 true
    // 2 1 true
    // 3 2 true
    // 2 3 true
    // 5 4 true
  })
  console.log(arr); // [1, 2, 3, 2, 5]
  var arr1 = arr.forEach(function(a) { // forEach方法没有返回值
    return a * 2;
  })
  console.log(arr1); // undefined

⑥ map方法

返回一个新数组,这个新数组中的每一项是对原数组中每一项调用某个函数而得到的。

var arr = [1, 2, 3, 2, 5];
var arr1 = arr.map(function(a) { 
   // 对每一项运行给定函数,返回每次函数调用的结果组成的数组
   return a * 2;
})
console.log(arr); // (5) [1, 2, 3, 2, 5]
console.log(arr1); // (5) [2, 4, 6, 4, 10]

⑦ filter方法

不会改变原数组,且返回一个新数组,新数组中的项是从原数组中选出来的某些项组成。

 var arr = [1, 2, 3, 2, 5];
  var arr1 = arr.filter(function(a) { 
      // 返回满足过滤条件组成的数组
    return a > 2;
  })
  console.log(arr); // (5) [1, 2, 3, 2, 5]
  console.log(arr1); // (2) [3, 5]

⑧ every方法

不会改变原数组,且返回一个布尔值 。
判断数组中每一项都是否满足条件,所有项都满足条件才会返回true

  var arr = [1, 2, 3, 2, 5];
  var arr1 = arr.every(function(a) { 
    // 判断数组中每一项都是否满足条件,所有项都满足条件才会返回true
    return a > 2;
  })
  console.log(arr); // (5) [1, 2, 3, 2, 5]
  console.log(arr1); // false

⑨  some方法

不会改变原数组,且返回一个布尔值**

  var arr = [1, 2, 3, 2, 5];
  var arr1 = arr.some(function(a) { 
      // 判断数组中每一项都是否满足条件,只要有一项满足条件就会返回true
    return a > 2;
  })
  console.log(arr); // (5) [1, 2, 3, 2, 5]
  console.log(arr1); // true

⑩  reduce方法

不会改变原数组,迭代数组的所有项,然后构建一个最终返回的值,从数组的第一项开始,逐个遍历到最后。

  var arr = [1, 2, 3, 2, 5];
  // reduce方法有两个参数:在每一项上调用的函数和(可选的)作为归并基础的初始值
  // reduce方法的函数接收 4 个参数:前一个值、当前值、项的索引和数组对象
  // 这个函数返回的任何值都会作为第一个参数自动传给下一项
  // 第一次迭代发生在数组的第二项上,因此第一个参数是数组的第一项,第二个参数是数组的第二项
  var sum = arr.reduce(function(pre, cur, index, array) { 
    return pre + cur;
  }, 10)
  console.log(arr); // (5) [1, 2, 3, 2, 5]
  console.log(sum); // 23

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值