JavaScript 数组常用操作方法

创建数组

var fruits = ['Apple', 'Banana'];
console.log(fruits.length);  // 2

遍历数组

fruits.forEach(function (item, index, array) {
    console.log(item, index);
});
// Apple 0
// Banana 1

查找索引

找出某个元素在数组中的索引

fruits.push('Mango');
// ["Strawberry", "Banana", "Mango"]

var pos = fruits.indexOf('Banana');
// 1

添加元素

添加元素到数组的末尾

var newLength = fruits.push('Orange');
// newLength:3; fruits: ["Apple", "Banana", "Orange"]

添加元素到数组的头部

var newLength = fruits.unshift('Strawberry') // add to the front
// ["Strawberry", "Banana"];

删除元素

删除数组末尾的元素

var last = fruits.pop(); // remove Orange (from the end)
// last: "Orange"; fruits: ["Apple", "Banana"];

删除数组最前面(头部)的元素

var first = fruits.shift(); // remove Apple from the front
// first: "Apple"; fruits: ["Banana"];

通过索引删除某个元素

fruits.push('Mango');
// ["Strawberry", "Banana", "Mango"]
var pos = fruits.indexOf('Banana');
var removedItem = fruits.splice(pos, 1);
// ["Strawberry", "Mango"]

从一个索引位置删除多个元素

var vegetables = ['Cabbage', 'Turnip', 'Radish', 'Carrot'];

var pos = 1, n = 2;

var removedItems = vegetables.splice(pos, n);

console.log(vegetables);
// ["Cabbage", "Carrot"] (the original array is changed)

console.log(removedItems);
// ["Turnip", "Radish"]

复制一个数组

var shallowCopy = fruits.slice();
// ["Strawberry", "Mango"]

修改数组

copyWithin

在数组内部,将一段元素序列拷贝到另一段元素序列上,覆盖原有的值。
语法:

arr.copyWithin(target[, start[, end]])

DEMO:

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"]

fill

将数组中指定区间的所有元素的值,都替换成某个固定的值。
DEMO:

const array1 = [1, 2, 3, 4];

// fill with 0 from position 2 until position 4
console.log(array1.fill(0, 2, 4));
// expected output: [1, 2, 0, 0]

// fill with 5 from position 1
console.log(array1.fill(5, 1));
// expected output: [1, 5, 5, 5]

console.log(array1.fill(6));
// expected output: [6, 6, 6, 6]

reverse

颠倒数组中元素的排列顺序,即原先的第一个变为最后一个,原先的最后一个变为第一个。

const array1 = ['one', 'two', 'three'];
console.log('array1:', array1);
// expected output: "array1:" Array ["one", "two", "three"]

const reversed = array1.reverse();
console.log('reversed:', reversed);
// expected output: "reversed:" Array ["three", "two", "one"]

// Careful: reverse is destructive -- it changes the original array.
console.log('array1:', array1);
// expected output: "array1:" Array ["three", "two", "one"]

排序

sort

对数组元素进行排序,并返回当前数组。

Array.from()

Array.from()方法从一个类似数组或可迭代对象创建一个新的,浅拷贝的数组实例。

从 String 生成数组

Array.from('foo');
// [ "f", "o", "o" ]

从 Set 生成数组

const set = new Set(['foo', 'bar', 'baz', 'foo']);
Array.from(set);
// [ "foo", "bar", "baz" ]

从 Map 生成数组

const map = new Map([[1, 2], [2, 4], [4, 8]]);
Array.from(map);
// [[1, 2], [2, 4], [4, 8]]

const mapper = new Map([['1', 'a'], ['2', 'b']]);
Array.from(mapper.values());
// ['a', 'b'];

Array.from(mapper.keys());
// ['1', '2'];

从类数组对象(arguments)生成数组

function f() {
  return Array.from(arguments);
}

f(1, 2, 3);

// [ 1, 2, 3 ]

Array.isArray()

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

Array.isArray([1, 2, 3]);
// true
Array.isArray({foo: 123});
// false
Array.isArray("foobar");
// false
Array.isArray(undefined);
// false

Array.of()

根据一组参数来创建新的数组实例,支持任意的参数数量和类型。

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

发表评论

邮箱地址不会被公开。 必填项已用*标注