js Array常用方法

106 阅读3分钟

js中Array对象极其常用,这里分享下Array对象常用的方法

1,concat,链接多个数组并返回连接后的副本

let arr1 = [1, 3, 5];
let arr2 = [2, 4, 7];
console.log(arr1.concat(arr2));

2,forEach,按顺序为数组中的每个元素调用一次函数

let arr1 = [1, 3, 5];
arr1.forEach((item, index) => {
  console.log('val:' + 2 * item);
});

3,数组如果下标使用了字符串,则会将数组变成Object类型,length将变成0

let arr2 = [];
arr2['abc'] = 'ccc';
console.log(arr2.length);  // 输出:0

4,注意数组初始化的不同结果

console.log(new Array(5));
console.log(new Array(4, 5));

5,判断一个对象是否是数组类型的方法

let arr1 = [1, 2, 3];
console.log(typeof arr1); // object
console.log(Array.isArray(arr1)); //true
console.log( arr1 instanceof Array); //true

6,shift和unshift,shift是移除第一个元素,并返回该元素,如果数组为空则返回undefined,unshift是在第一位插入元素,并返回数组长度。

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

7,sort,对数组进行排序,默认会对元素进行toString后比较,升序排列,如果要改变这个排序规则可以传入一个比较函数,如果要升序,则第一个元素大于第一个元素则返回1,等于返回0,小于返回-1;降序相反。

var a = [1, 2, 3, 13];
a.sort();
console.log(a); // 1,13,2,3
var compare = function(a, b) {
  if (a > b) {
    return 1;
  } else if (a === b) {
    return 0;
  } else {
    return -1;
  }
}
a.sort(compare);
console.log(a); // 1, 2, 3, 13

8,reverse, 对数组里的元素进行反转。

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

9,slice(开始下标,结束下标),将数组切片,返回从开始下标到结束下标之间元素(不包含结束下标)的新数组,如果只有开始下标,则返回开始下标到结束的所有元素,如果下标是负数,则先用数组长度加上该下标作为最终参数值。

var a = [1, 2, 3, 13];
var b = a.slice(1,2); // [2]
var c = a.slice(1); // [2, 3, 13]
var d = a.slice(1, -1); // [2, 3]
var e = a.slice(-3, -1); // [2, 3]

10,splice,拼接数组,可以实现删除元素、替换元素、增加元素等功能,参数1是开始操作的数组下标,参数2是要操作的项数,参数3及之后的参数是需要替换前面需要替换的元素

var a = [1, 2, 3, 13];
var b = a.splice(1, 0, 5); 
console.log(b);
console.log(a); // 1,5,2,3,13
var c = a.splice(1, 2); 
console.log(a); // 1,3,13
var d = a.splice(1, 1, 4, 6); 
console.log(a); // 1,4,6,13

11,map,对数组中的每个元素执行一次回调函数,并将回调函数返回的值作为新数组的元素

var a = [1, 2, 3, 13];
var b =  a.map((item) => item * item); 
console.log(b); // 1, 4, 9, 169

12,filter,对数组内的元素进行搜索过滤,将满足条件的元素返回组成新数组

var a = [1, 2, 3, 13];
var b =  a.filter((item, index) => {
  return item > 4 && index > 2;
});
console.log(b); // 13

13,every,如果数组内的元素都满足条件,则返回true,否则返回false

var a = [1, 2, 3, 13];
var b =  a.every((item, index) => {
  return item > 0;
});
console.log(b); // true

14,some,如果数组内的元素有一个满足条件,则返回true,否则返回false

var a = [1, 2, 3, 13];
var b =  a.some((item, index) => {
  return item > 10;
});
console.log(b); // true

15,reduce和reduceRight,迭代遍历数组元素,并将本次迭代结果传递给下个元素迭代,reduce是从左到右迭代,reduceRight是从右到左迭代,可以设置迭代初始值。

var a = [1, 2, 3, 13];
var b =  a.reduce((pre, cur, index, array) => {
  return pre + cur;
}, 100);
console.log(b); // 119