JavaScript 数组方法梳理

559 阅读3分钟

1. 会改变自身的方法

array.copyWithin(target, start [, end = this.length])

  • target(必需):从该位置开始替换数据。如果为负值,表示倒数。
  • start(可选):从该位置开始读取数据,默认为 0。如果为负值,表示倒数。
  • end(可选):到该位置前停止读取数据,默认等于数组长度。如果为负值,表示倒数。 就是从target开始替换,替换的数据来自于本身,并从start开始读取,end结束读取,将读取的数据覆盖从targt开始,有几个换几个
 [1, 2, 3, 4, 5, 6].copyWithin(4, 0, 1);
 // 从5开始替换,读取到的数据为1,那么只将5替换成1 输出  [1, 2, 3, 4, 1, 6]
 [1, 2, 3, 4, 5, 6].copyWithin(4, 0, 5); 
 // 从5开始替换,读取到的数据为【1,2,3,4],那么只将5替换成1 输出  [1, 2, 3, 4, 1, 2]

array.fill(value [,statrt = 0[, end = this.length]])

同上 start end 不填写默认为全部填充

[1, 2, 3, 4, 5, 6].fill(null, 0, 12) // [null, null, null, null, null]
[1, 2, 3, 4, 5, 6].fill(null, 0, 1) // [null,2,3,4,5]

array.pop()

删除数组中最后一个元素,并且返回这个元素

array.push(element1, …elementN)

添加一个或者多个元素到末尾,并且返回新数组的长度

array.reverse()

前后颠倒数组中的元素,第一个元素会变成最后一个

array.shift()

删除数组的第一个元素,并且返回这个元素

array.unshift(element1, …elementN)

在数组的开头插入一个或者多个元素 并返回数组的新长度

array.sort(fn(a,b))

排序 传入函数(a, b)的返回值 小于 0 a会在b前面,等于0 位置不变,大于0 a在b后面

array.splice(start, deleteCount[, item1[, item2...])

  • start: 开始操作的索引
  • deleteCount: 要移除的数组元素的个数
  • itemN: 要添加进数组的元素,如果不指定,则splice只删除数组元素

2. 不会改变自身的方法

array.concat(value1, value2.....)

将传入的数组或者非数组值合并,组成一个新的数组并返回

array.includes(searchElement, [, fromIndex])

第一个参数为查找的值,第二个参数为从原数组中的什么索引位置开始查找 默认为0 注意此处使用的是 === 严格匹配

[1, 2, 3, 4, 5, 6].includes(1); // true 从索引为0 开始找包含1 返回ture
[1, 2, 3, 4, 5, 6].includes(1, 1); // false 从索引为1 开始找 不含1 返回 false

array.indexOf(searchElement[, fromIndex = 0])

同 includes 第一个匹配上的索引值

array.lastIndexOf(searchElement[, fromIndex = arr.length - 1])

同 indexOf 最后一个匹配上的索引值

array.join([separator = ',’])

, 替换为指定的字符串,并返回字符串

array.slice([begin = 0 [, end = this.length - 1]])

浅复制

array.toString()

每一项的元素都toString() 组合返回值

[1, 2, {a: 1}].toString(); // 1,2,[object Object]

array.toLocaleString()

同上 只不过每一项调用的是 toLocaleString

3. 遍历方法

array.forEach((v, i, a) => {})

v: 每一项的值 i每一项的索引 a 当前这个数组 无返回值

array.entries()

返回 Array Iterator 对象 Iterator参考 iterator

var arr = ["a", "b", "c"];
var eArr = arr.entries();

console.log(eArr.next().value); // [0, "a"]
console.log(eArr.next().value); // [1, "b"]
console.log(eArr.next().value); // [2, "c"]

array.keys()

返回索引的iterator

array.every(callback(v, i, a){})

返回一个bool, 每一项的callback返回的值都为true 时返回true 否则返回false,注意,其中如果有某一次返回了false 循环将不再继续

[1, 2, 3, 4].every(item => {
    console.log('====');
    return item < 2;
}); // 输出两次 ==== 返回false

array.some()

某一项为true 即返回true,注意:其中如果有某一次返回了true,循环将不再继续

array.filter((v, i, a) => {})

将callback返回true的保留

array.find((v, i, a) =>{})

找到满足的条件的元素,并返回该值。注意一旦找到了,循环将不再继续

array.map((v, i, a) => {})

返回新的数组

array.reduce(callback[, initialValue]) >

如果initialValue没有值那么prev 为数组中的第一个值,next为数组中的第二个值

[0, 1, 2, 3, 4, 5].reduce((p, v, i , a) => {
    return p + v
}) // 15

array.reduceRight()

同上