数组方法总结(全部)

push 添加

向数组的末尾添加一个或多个元素,并返回新的数组长度。原数组改变。(**把元素添加到数组尾部**)
var arr = [1, 2, 3]
arr.push(4)
arr.push(5, 6, 7)

console.log(arr);  结果:[1, 2, 3, 4, 5, 6, 7]

pop 删除

删除并返回数组的最后一个元素,若该数组为空,则返回undefined。原数组改变。(**移除数组最后一个元素**)
var arr = [1, 2, 3, 4]

console.log(arr.pop()); 结果:4
console.log(arr); 结果:[1, 2, 3]

shift 删除

删除数组的第一项,并返回第一个元素的值。若该数组为空,则返回undefined。原数组改变。(**移除数组的第一个元素**)
var arr = ['broccoli', 'cauliflower', 'cabbage']

console.log(arr.shift()); 结果:broccoli
console.log(arr); 结果:['cauliflower', 'cabbage']

unshift 添加

向数组的开头添加一个或多个元素,并返回新的数组长度。原数组改变。(**在数组头部插入元素**)
var arr = [1, 2, 3]

console.log(arr.unshift(0)); 结果:4
console.log(arr.unshift(8, 9)); 结果:6
console.log(arr); 结果:[8, 9, 0, 1, 2, 3]

concat 合并

合并两个或多个数组,生成一个新的数组。原数组不变。(**把元素衔接到数组中。**)
var arr = [1, 2, 3]
var arr2 = [4, 5]
var arr3 = [6, 7]

arr.concat(arr2) 结果:[1, 2, 3, 4, 5]
arr.concat(arr2, arr3) 结果:[1, 2, 3, 4, 5, 6, 7]

join 拆分连接

将数组的每一项用指定字符连接形成一个字符串。默认连接字符为 “,” 逗号。(**将数组的所有元素转化为字符串**)
var arr = [1, 2, 3]

console.log(arr.join('-')); 结果:1-2-3
console.log(arr.join('>')); 结果:1>2>3

reverse 反转

将数组倒序。原数组改变。(**在原数组中颠倒元素的顺序**)
var arr = [1, 2, 3]

arr.reverse()
console.log(arr);结果:[3, 2, 1]

sort 排序

对数组元素进行排序。按照字符串UniCode码排序,原数组改变。(**在原数组中对数组元素进行排序**)
var arr = [3, 1, 8, 7, 13, 81, 9]

arr.sort()
console.log(arr); 结果:[1, 13, 3, 7, 8, 81, 9]

map 循环遍历

原数组的每一项执行函数后,返回一个新的数组。原数组不变。(注意该方法和forEach的区别)。(**从数组的元素中,计算出新的数组**)
var arr = [1, 2, 3]

const mp = arr.map(x => x * 10)
console.log(mp); 结果:[10, 20, 30]
console.log(arr); 结果:[1, 2, 3]

forEach 循环遍历

用于调用数组的每个元素,并将元素传递给回调函数。原数组不变。(注意该方法和map的区别,若直接打印Array.forEach,结果为undefined)。(**为数组的每一个元素调用指定函数**)
var arr = [1, 2, 3]

arr.forEach(x => console.log(x)) 结果:1 2 3

filter 循环过滤

过滤数组中,符合条件的元素并返回一个新的数组。原数组不变。(**返回满足断言函数的数组元素**)
var arr = [1, 2, 3, 4]

const filArr = arr.filter(x => {
    return x > 2
})

console.log(filArr); 结果:[3, 4]
console.log(arr); 结果:[1, 2, 3, 4]

every循环遍历 返回boolean值

对数组中的每一项进行判断,若都符合则返回true,否则返回false。只要有一个不符合条件就返回false,所有都符合条件返回true(**测试断言函数是否对每个数组元素都为真**)
var arr = [1, 2, 3, 4]

const newArr = arr.every(x => {
    return x <= 4
})

console.log(newArr); 结果:true

some循环遍历 返回boolean值

对数组中的每一项进行判断,若都不符合则返回false,否则返回true。只要有一个符合条件就返回true(**测试是否至少有一个数组元素能让断言函数为真**)
var arr = [1, 2, 3, 4]

const newArr = arr.some(x => {
    return x < 1
})

console.log(newArr); 结果:false

slice 浅拷贝

 从start开始,end之前结束,不到end;如果不给end值,从start开始到数组结束。start可以给负值,-1表示数组最后位				    置,-2表示倒数第二个,以此类推,顾前不顾后。原数组不变(**返回数组的一部分**)

var arr = [1, 2, 3, 4, 5, 6]
console.log(arr.slice(2)); 结果:[3, 4, 5, 6]
console.log(arr.slice(2, 4)); 结果:[3, 4]
console.log(arr.slice(-2)); 结果:[5, 6]
console.log(arr.slice(2, -1)); 结果:[3, 4, 5]
console.log(arr.slice()); 结果:[1, 2, 3, 4, 5, 6]

splice 添加,替换,删除

通过删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容。此方法会改变原数组。原 数组改变。(**插入、删除或替换数组元素**)
var arr = [1, 2, 3]

arr.splice(0, 1, 5); //从第0个开始,删除一个,在插入0 一个 结果:[5, 2, 3]
arr.splice(0, 1, 5, 8, 9); //从第0个开始,删除一个,在插入5,8,9三个元素 结果:[5, 8, 9, 2, 3]
arr.splice(0, 0, 5); // 从第0个开始,不删,添加一个元素 结果:[5, 1, 2, 3]
arr.splice(0, 0, 5, 6); // 从第0个开始,不删,添加两个元素 结果:[5, 6, 1, 2, 3]

reduce 累加器

方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。不改变原数组(**从数组的元素中,计算出一个值**)
var arr = [1, 2, 3, 4]

const reduceRes = arr.reduce((pre, curr) => {
    return pre + curr
}, 0)

console.log(reduceRes); 结果:10

from浅拷贝的数组

对一个类似数组或可迭代对象创建一个新的,浅拷贝的数组实例。
var array = [1, 2, 3, 4, 5, 6, 7];

const res = Array.from(array, (x) => {
    return x * 10
})
console.log(res); 结果: [10, 20, 30, 40, 50, 60, 70]

var arr2 = "zhangsan"
console.log(Array.from(arr2)); 结果:['z', 'h', 'a', 'n', 'g', 's', 'a', 'n']

reduceRight 累加器

方法接受一个函数作为累加器(accumulator)和数组的每个值(从右到左)将其减少为单个值。
var arr = [1, 2, 3, 4]

const reduceRes = arr.reduceRight((pre, curr) => {
    console.log(pre, curr);
    return pre + curr
}, 0)

console.log(reduceRes); 结果:10

toString 数组转换成字符串

 把数组转换为数组值(逗号分隔)的字符串。(**将数组转化为字符串**)
 var arr = [1, "2", 3, '张三']

 console.log(typeof arr.toString());

length 获取长度

length 属性提供了向数组追加新元素的简易方法:
var arr = [1, 2, 3]

arr[arr.length] = 4;
console.log(arr); 结果:[1, 2, 3, 4]

keys 获取数组key

方法返回一个包含数组中每个索引键的Array Iterator对象。

var array = [1, 2, 3];

let arr = array.keys()
for (const i of arr) {
    console.log(i); 结果: 1 2 3
}

console.log(Object.keys(array)); 结果:['0', '1', '2']
console.log([...array.keys()]); 结果:[0, 1, 2]

values

 方法返回一个新的 Array Iterator 对象,该对象包含数组每个索引的值

isArray 判断是否数组

用于确定传递的值是否是一个 Array。

// 下面的函数调用都返回 true
Array.isArray([]);
Array.isArray([1]);
Array.isArray(new Array());
Array.isArray(new Array('a', 'b', 'c', 'd'))
// 鲜为人知的事实:其实 Array.prototype 也是一个数组。
Array.isArray(Array.prototype);

// 下面的函数调用都返回 false
Array.isArray();
Array.isArray({});
Array.isArray(null);
Array.isArray(undefined);
Array.isArray(17);
Array.isArray('Array');
Array.isArray(true);
Array.isArray(false);
Array.isArray(new Uint8Array(32))
Array.isArray({ __proto__: Array.prototype });  

includes 判断是否包含某个值

方法用来判断一个数组是否包含一个指定的值,根据情况,如果包含则返回 true,否则返回
const array1 = [1, 2, 3];

console.log(array1.includes(2)); 结果:true
console.log(array1.includes(5)); 结果:false

indexOf 判断是否存在

返回在数组中可以找到一个给定元素的第一个索引,如果不存在,则返回-1。如果参数中提供的索引值是一个负值,则将其作为数组末尾的一个抵消,即-1表示从最后一个元素开始查找,-2表示从倒数第二个元素开始查找 ,以此类推。 
var array = [2, 5, 9];

array.indexOf(2); 结果: 0
array.indexOf(7); 结果: -1
array.indexOf(9, 2); 结果: 2
array.indexOf(2, -1); 结果: -1
array.indexOf(2, -3); 结果: 0

lastIndexOf 反向判断

返回指定元素在数组中的最后一个的索引,如果不存在则返回 -1。从数组的后面向前查找

语法:
    arr.lastIndexOf(searchElement[, fromIndex])
参数
    searchElement 被查找的元素。
    fromIndex 可选 从此位置开始逆向查找。默认为数组的长度减 1(arr.length - 1),即整个数组都被查找。如果该值大于或等于数组的长度,则整个数组会被查找。如果为负值,将其视为从数组末尾向前的偏移。即使该值为负,数组仍然会被从后向前查找。如果该值为负时,其绝对值大于数组长度,则方法返回 -1,即数组不会被查找。
例子
    var array = [2, 5, 9, 2];
    var index = array.lastIndexOf(2); 结果:3
    index = array.lastIndexOf(7); 结果:-1
    index = array.lastIndexOf(2, 3); 结果:3
    index = array.lastIndexOf(2, 2); 结果:0
    index = array.lastIndexOf(2, -2); 结果:0
    index = array.lastIndexOf(2, -1); 结果:3

toLocaleString 把数组转换为本地字符串。

 返回一个字符串表示数组中的元素。数组中的元素将使用各自的 toLocaleString 方法转成字符串,这些字符串将使用一个特定语言环境的字符串(例如一个逗号 ",")隔开。

find 查找

找到满足条件的第一个元素返回,如果未找到,则返回undefined。Array.find()和Array.findIndex()是Es6为数组新增的两个方法。
var arr = [1, 2, 3]

const res = arr.find((x) => {
    return x > 1
})
console.log(res); 结果:2

findIndex 查找

找到满足条件的第一个元素,返回其位置,如果未找到,则返回-1。
var arr = [1, 2, 3]

const res = arr.findIndex((x) => {
    return x > 2
})
console.log(res); 结果:2

at 当前索引内容

返回指定索引的内容,如果为负数则从后面开始数
 var arr = [1, 2, 3, 4, 5]

console.log(arr.at(-2)); 结果:4
console.log(arr.at(3)); 结果:4
console.log(arr.at(1)); 结果:2

copyWithin 复制

方法浅复制数组的一部分到同一数组中的另一个位置,并返回它,不会改变原数组的长度。

参数:
    1.从什么位置开始复制(负数从后面开始数)
    2.从第几位开始 默认0(负数从后面开始数)
    3.从第几位索引结束(默认为当前数组的长度,不包括结尾)

var array = [1, 2, 3, 4, 5, 6, 7];

console.log(array.copyWithin(2, 3, 6)); 结果:1 2 4 5 6 6 7
console.log(array.copyWithin(2)); 结果: 1 2 1 2 3 4 5
console.log(array.copyWithin(-2)); 结果: 1 2 3 4 5 1 2
console.log(array.copyWithin(-2, -3, -1)); 结果: 1 2 3 4 5 5 6

entries 获取数组键值对

方法返回一个新的Array Iterator对象,该对象包含数组中每个索引的键/值对。

var array = [1, 2, 3, 4, 5, 6, 7];

let res = array.entries()

for (let e of res) {
    console.log(e);
}

结果:[0, 1]
结果:[1, 2]
结果:[2, 3]
结果:[3, 4]
结果:[4, 5]
结果:[5, 6]
结果:[6, 7]

// console.log(res.next().value);
// console.log(res.next().value);

fill 填充数组

方法用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引。
参数
    value:用来填充数组元素的值。
    start:起始索引,默认值为0。
    end:终止索引,默认值为 this.length。

[1, 2, 3].fill(4);               结果: [4, 4, 4]
[1, 2, 3].fill(4, 1);            结果: [1, 4, 4]
[1, 2, 3].fill(4, 1, 2);         结果: [1, 4, 3]
[1, 2, 3].fill(4, 1, 1);         结果: [1, 2, 3]
[1, 2, 3].fill(4, 3, 3);         结果: [1, 2, 3]
[1, 2, 3].fill(4, -3, -2);       结果: [4, 2, 3]
[1, 2, 3].fill(4, NaN, NaN);     结果: [1, 2, 3]
[1, 2, 3].fill(4, 3, 5);         结果: [1, 2, 3]
Array(3).fill(4);                结果: [4, 4, 4]
[].fill.call({ length: 3 }, 4);  结果: {0: 4, 1: 4, 2: 4, length: 3}

flat 提取嵌套数组的结构

方法会按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。

参数 
    depth:指定要提取嵌套数组的结构深度,默认值为 1。

var arr1 = [1, 2, [3, 4]];
arr1.flat(); 结果:[1, 2, 3, 4]

var arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat(); 结果:[1, 2, 3, 4, [5, 6]]

var arr3 = [1, 2, [3, 4, [5, 6]]];
arr3.flat(2); 结果:[1, 2, 3, 4, 5, 6]

//使用 Infinity,可展开任意深度的嵌套数组
var arr4 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]];
arr4.flat(Infinity); 结果:[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

var arr5 = [1, 2, , 4, 5];
arr5.flat();结果:[1, 2, 4, 5]

of 创建数组

方法创建一个具有可变数量参数的新数组实例,而不考虑参数的数量或类型。
Array.of(1);         结果:[1]
Array.of(1, 2, 3);   结果:[1, 2, 3]
Array.of(undefined); 结果:[undefined]

flatMap

groupBy

groupByToMap

toSource 查看数组源码

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值