JavaScript 数组方法总结

Array属性及方法

array.length:数组长度
Array.isArray():判断变量是否是数组对象
Array.of():根据一组参数来创建新的数组实例,支持任意的参数数量和类型。

Array.of(7);       // [7] 
Array.of(1, 2, 3); // [1, 2, 3]

Array(7);          // [ , , , , , , ]
Array(1, 2, 3);    // [1, 2, 3]

修改器方法

修改器方法会改变调用它们的对象自身的值。

array.copyWithin(target, start, end):浅复制数组的一部分到同一数组中的另一个位置,并返回它,不会改变原数组的长度。

  • 如果 target 大于等于 arr.length,将会不发生拷贝。如果 target 在 start 之后,复制的序列将被修改以符合 arr.length。
  • 如果 start 被忽略,copyWithin 将会从0开始复制。
  • 如果 end 被忽略,copyWithin 方法将会一直复制至数组结尾(默认为 arr.length)。
const array1 = ['a', 'b', 'c', 'd', 'e'];

// copy to index 0 the element at index 3
console.log(array1.copyWithin(0, 3, 4));
// expected output: Array ["d", "b", "c", "d", "e"]

// copy to index 1 all elements from index 3 to the end
console.log(array1.copyWithin(0, 3));
// expected output: Array ["d", "d", "e", "d", "e"]

console.log(array1.copyWithin(4, 3));
// expected output: Array ["d", "d", "e", "d", "d"]

array.fill():用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。
array.pop():删除数组的最后一个元素,并返回这个元素。
array.push():将一个或多个元素添加到数组的末尾,并返回该数组的新长度。
array.reverse():颠倒数组中元素的排列顺序
array.shift():删除数组的第一个元素,并返回这个元素。
array.sort():对数组元素进行排序,并返回当前数组。
array.splice():在任意的位置给数组添加或删除任意个元素。

const months = ['Jan', 'March', 'April', 'June'];
months.splice(1, 0, 'Feb');
// inserts at index 1
console.log(months);
// expected output: Array ["Jan", "Feb", "March", "April", "June"]

months.splice(4, 1, 'May');
// replaces 1 element at index 4
console.log(months);
// expected output: Array ["Jan", "Feb", "March", "April", "May"]

splice和findIndex协作,方便找到一个位置后删除

      const index = projects.findIndex(x => x.id == project.id);
      if (index !== -1) {
        projects.splice(index, 1);
      }

array.unshift():在数组的开头增加一个或多个元素,并返回数组的新长度。

访问方法

这些方法绝对不会改变调用它们的对象的值,只会返回一个新的数组或者返回一个其它的期望值。
array.concat():返回一个由当前数组和其它若干个数组或者若干个非数组值组合而成的新数组。
array.includes():判断当前数组是否包含某指定的值,如果是返回 true,否则返回 false。
array.join():将一个数组(或一个类数组对象)的所有元素连接成一个字符串并返回这个字符串。

  • 如果数组只有一个项目,那么将返回该项目而不使用分隔符。
const elements = ['Fire', 'Air', 'Water'];

console.log(elements.join());
// expected output: "Fire,Air,Water"

console.log(elements.join(''));
// expected output: "FireAirWater"

console.log(elements.join('-'));
// expected output: "Fire-Air-Water"

array.slice():返回一个新的数组对象,这一对象是一个由 begin 和 end 决定的原数组的浅拷贝(包括 begin,不包括end)。原始数组不会被改变。

const animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];

console.log(animals.slice(2));
// expected output: Array ["camel", "duck", "elephant"]

console.log(animals.slice(2, 4));
// expected output: Array ["camel", "duck"]

array.toString():返回一个字符串,表示指定的数组及其元素。

const array1 = [1, 2, 'a', '1a'];

console.log(array1.toString());
// expected output: "1,2,a,1a"

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

const array1 = [1, 'a', new Date('21 Dec 1997 14:12:00 UTC')];
const localeString = array1.toLocaleString('en', { timeZone: 'UTC' });

console.log(localeString);
// expected output: "1,a,12/21/1997, 2:12:00 PM",
// This assumes "en" locale and UTC timezone - your results may vary

array.indexOf():返回在数组中可以找到一个给定元素的第一个索引,如果不存在,则返回-1。
array.lastIndexOf():返回指定元素(也即有效的 JavaScript 值或变量)在数组中的最后一个的索引,如果不存在则返回 -1。从 fromIndex 处开始,从数组的后面向前查找。

var array = [2, 5, 9, 2];
var index = array.lastIndexOf(2);
// index is 3
index = array.lastIndexOf(7);
// index is -1
index = array.lastIndexOf(2, 3);
// index is 3
index = array.lastIndexOf(2, 2);
// index is 0
index = array.lastIndexOf(2, -2);
// index is 0
index = array.lastIndexOf(2, -1);
// index is 3

迭代方法

推荐使用lodash,可以同时处理空数组。
array.forEach():为数组中的每个元素执行一次回调函数。
array.entries():返回一个新的Array Iterator对象,该对象包含数组中每个索引的键/值对。

const array1 = ['a', 'b', 'c'];

const iterator1 = array1.entries();

console.log(iterator1.next().value);
// expected output: Array [0, "a"]

console.log(iterator1.next().value);
// expected output: Array [1, "b"]

array.every():如果数组中的每个元素都满足测试函数,则返回 true,否则返回 false。
array.some():如果数组中的每个元素都满足测试函数,则返回 true,否则返回 false。
array.filter():将所有在过滤函数中返回 true 的数组元素放进一个新数组中并返回
array.find():找到第一个满足测试函数的元素并返回那个元素的值,如果找不到,则返回 undefined。
array.findIndex():找到第一个满足测试函数的元素并返回那个元素的索引,如果找不到,则返回 -1。
array.keys():返回一个数组迭代器对象,该迭代器会包含所有数组元素的键。

const array1 = ['a', 'b', 'c'];
const iterator = array1.keys();

for (const key of iterator) {
  console.log(key);
}

// expected output: 0
// expected output: 1
// expected output: 2

array.map()创建一个新数组,其结果是该数组中的每个元素是调用一次提供的函数后的返回值。

const array1 = [1, 4, 9, 16];

// pass a function to map
const map1 = array1.map(x => x * 2);

console.log(map1);
// expected output: Array [2, 8, 18, 32]

array.reduce():对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值。

const array1 = [1, 2, 3, 4];
const reducer = (accumulator, currentValue) => accumulator + currentValue;

// 1 + 2 + 3 + 4
console.log(array1.reduce(reducer));
// expected output: 10

// 5 + 1 + 2 + 3 + 4
console.log(array1.reduce(reducer, 5));
// expected output: 15

array.reduceRight():接受一个函数作为累加器(accumulator)和数组的每个值(从右到左)将其减少为单个值。

const array1 = [[0, 1], [2, 3], [4, 5]].reduceRight(
  (accumulator, currentValue) => accumulator.concat(currentValue)
);

console.log(array1);
// expected output: Array [4, 5, 2, 3, 0, 1]

array.values():返回一个新的 Array Iterator 对象,该对象包含数组每个索引的值

const array1 = ['a', 'b', 'c'];
const iterator = array1.values();

for (const value of iterator) {
  console.log(value);
}

// expected output: "a"
// expected output: "b"
// expected output: "c"
posted @ 2020-11-01 19:12  Shaw_喆宇  阅读(136)  评论(0编辑  收藏  举报