js数组的方法总结
一种总结了24种
字符串方法 截取方法
, 遍历方法
, 查找方法
…
按重要程度一次列出
开始喽!
let arr = ['aa', 'bb', 'cc', 'dd', 'ee', 'ff', 'gg']
添加删除类(4)
push()
向数组的末尾添加一个或更多元素,并返回新的长度。
let pus = arr.push('hh')
console.log(pus); // 8
console.log(arr); // ['aa', 'bb', 'cc', 'dd', 'ee', 'ff', 'gg', 'hh']
pop()
删除数组的最后一个元素并返回删除的元素。
let po = arr.pop()
console.log(po); // hh
console.log(arr); // ['aa', 'bb', 'cc', 'dd', 'ee', 'ff', 'gg']
unshift()
向数组的开头添加一个或更多元素,并返回新的长度。
let unS = arr.unshift('11')
console.log(unS); // 8
console.log(arr); // ['11', 'aa', 'bb', 'cc', 'dd', 'ee', 'ff', 'gg']
shift()
删除并返回数组的第一个元素。
let shi = arr.shift()
console.log(shi); // 11
console.log(arr); // ['aa', 'bb', 'cc', 'dd', 'ee', 'ff', 'gg']
截取类(2)
slice(start, end)
选取数组的一部分,并返回一个新数组。
let sli = arr.slice(3)
let sli2 = arr.slice(-2)
let sli3 = arr.slice(3, -2)
console.log(sli); // ["dd", "ee", "ff", "gg"]
console.log(sli2); // ["ff", "gg"]
console.log(sli3); // ["dd", "ee"]
splice()
splice(index, howmany, item1, ……, itemX)
从数组中添加或删除元素。
–howmany 可选。规定应该删除多少元素。必须是数字,但可以是 “0”。如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。
–item1, …, itemX 可选。要添加到数组的新元素
let spli = arr.splice(3)
console.log(arr); // ["aa", "bb", "cc"]
let spli2 = arr.splice(3, 0, 'dd', 'ee', 'ff', 'gg')
console.log(spli); //["dd", "ee", "ff", "gg"]
console.log(arr); // ["aa", "bb", "cc", "dd", "ee", "ff", "gg"]
转字符串(2)
join()
把数组的所有元素放入一个字符串。
let arr1 = ['aaa', 'bbb', 'vvv', 'mmm']
let joi = arr1.join('-')
console.log(joi); // aaa-bbb-vvv-mmm
console.log(arr1); // ["aaa", "bbb", "vvv", "mmm"]
toString()
方法可把数组转换为字符串,并返回结果。
数组中的元素之间用逗号分隔。
let tos = arr.toString()
console.log(tos); // aa,bb,cc,dd,ee,ff,gg
遍历类(6)
forEach()
forEach(function(currentValue, index, arr), thisValue)
数组每个元素都执行一次回调函数。
arr.forEach((i, index) => {
console.log(i, '--------', index);
/*
aa -------- 0
bb -------- 1
cc -------- 2
dd -------- 3
ee -------- 4
ff -------- 5
gg -------- 6
*/
})
map()
map(function(currentValue,index,arr), thisValue)
通过指定函数处理数组的每个元素,并返回处理后的数组。
let ma = arr.map(m => m + '-' + m)
console.log(ma); // ["aa-aa", "bb-bb", "cc-cc", "dd-dd", "ee-ee", "ff-ff", "gg-gg"]
filter()
filter(function(currentValue,index,arr), thisValue)
检测数值元素,并返回符合条件所有元素的数组。
let fil = arr.filter(f => f !== 'dd')
console.log(fil); // ["aa", "bb", "cc", "ee", "ff", "gg"]
every()
every(function(currentValue,index,arr), thisValue)
如果
所有
元素都满足条件,则返回true
如果数组中检测到有一个元素不满足,则整个表达式返回 false
let eve = arr.every(e => e == 'aa')
console.log(eve); // false
some()
some(function(currentValue,index,arr), thisValue)
如果有
一个
元素满足条件,则表达式返回true
, 剩余的元素不会再执行检测。如果没有满足条件的元素,则返回false。
let som = arr.some(s => s == 'aa')
console.log(som); // true
reduce()
reduce(function (total, currentValue, currentIndex, arr), initialValue)
方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值
let red = arr.reduce((prev, current) => {
let obj = {}
obj[current] = current + '-' + current
prev.push(obj)
return prev
}, [])
console.log(red);
/***
[
{aa: "aa-aa"},
{bb: "bb-bb"},
{cc: "cc-cc"},
{dd: "dd-dd"},
{ee: "ee-ee"},
{ff: "ff-ff"},
{gg: "gg-gg"}
]
* **/
查找类(4)
includes() – ES6
includes(searchElement, fromIndex)
用来判断一个数组是否包含一个指定的值,如果是返回 true,否则false。
–searchElement 需要查找的元素值
let inc = arr.includes('aa')
let inc2 = arr.includes('qq')
console.log(inc); // true
console.log(inc2); // false
find() – ES6
find(function (currentValue, index, arr), thisValue)
返回通过测试(函数内判断)的数组的第一个元素的值
let fin = arr.find(f => f == 'bb')
let fin2 = red.find(f => f.aa == 'aa-aa')
console.log(fin); // bb
console.log(fin2); // {aa: "aa-aa"}
findIndex() – ES6
findIndex(function (currentValue, index, arr), thisValue)
返回传入一个测试条件(函数)符合条件的数组第一个元素位置 如果没有符合条件的元素返回 - 1
let finI = arr.findIndex(i => i == 'dd')
let finI2 = arr.findIndex(i => i == 'qq')
let finI3 = red.findIndex(i => i.cc == 'cc-cc')
console.log(finI); // 3
console.log(finI2); // -1
console.log(finI3); // 2
indexOf(item,start)
返回数组中某个指定的元素位置 , 如果没有符合条件的元素返回 -1
let indf = arr.indexOf('cc')
let indf2 = arr.indexOf('11')
console.log(indf); // 2
console.log(indf2); // -1
合并重复类(1)
concat()
array1**.**concat(array2,array3,…,arrayX)
用于连接两个或多个数组
let [aa, bb, cc] = [['111', '333', '555'], ['aaa', 'bbb', 'ccc'], ['QQQ', 'WWW', 'EEE']]
let con = aa.concat(bb, cc)
console.log(con); // ["111", "333", "555", "aaa", "bbb", "ccc", "QQQ", "WWW", "EEE"]
其他(5)
reverse()
用于颠倒数组中元素的顺序
let rev = arr.reverse()
console.log(arr); // ["gg", "ff", "ee", "dd", "cc", "bb", "aa"]
console.log(rev); // ["gg", "ff", "ee", "dd", "cc", "bb", "aa"]
arr.reverse()
sort()
方法用于对数组的元素进行排序。
let points = [40, 100, 1, 5, 25, 10];
points.sort(function (a, b) { return a - b });
console.log(points); // [1, 5, 10, 25, 40, 100]
from() – ES6
Array.from(object, mapFunction, thisValue)
用于通过拥有 length 属性的对象或可迭代的对象来返回一个数组。 对象是数组返回 true,否则返回 false
– object 必需,要转换为数组的对象
– mapFunction 可选,数组中每个元素要调用的函数。
– thisValue 可选,映射函数(mapFunction)中的 this 对象。
let fro = Array.from([1, 2, 3], x => x * 10);
console.log(fro); // [10, 20, 30]
let myArr = Array.from("RUNOOB");
console.log(myArr); // ["R", "U", "N", "O", "O", "B"]
flat() – ES6
用于将嵌套的数组“拉平”,变成一维的数组。该方法返回一个新数组,对原数据没有影响。
–默认只会“拉平”一层
–不管有多少层嵌套,都要转成一维数组,可以用
Infinity
关键字作为参数。–
flat()
方法会跳过空位
[1, 2, [3, [4, 5]]].flat()
// [1, 2, 3, [4, 5]]
[1, 2, [3, [4, 5]]].flat(2)
// [1, 2, 3, 4, 5]
[1, [2, [3]]].flat(Infinity)
// [1, 2, 3]
[1, 2, , 4, 5].flat()
// [1, 2, 4, 5]
flatMap() – ES6
对原数组的每个成员执行一个函数(相当于执行
Array.prototype.map()
),然后对返回值组成的数组执行flat()
方法。该方法返回一个新数组,不改变原数组。–
flatMap()
只能展开一层数组。
// 相当于 [[2, 4], [3, 6], [4, 8]].flat()
[2, 3, 4].flatMap((x) => [x, x * 2])
// [2, 4, 3, 6, 4, 8]
// 相当于 [[[2]], [[4]], [[6]], [[8]]].flat()
[1, 2, 3, 4].flatMap(x => [[x * 2]])
// [[2], [4], [6], [8]]
flatMap()
方法的参数是一个遍历函数,该函数可以接受三个参数,分别是当前数组成员、当前数组成员的位置(从零开始)、原数组。
arr.flatMap(function callback(currentValue[, index[, array]]) {
// ...
}[, thisArg])
人生最大的幸福,是发现自己爱的人正好也爱着自己。——张爱玲