数组 API 整理

本文参考


Array.from()

Array.from(arrayLike[, mapFn[, thisArg]])

将一个类数组对象(array-like object)或可迭代(iterable)对象转为真正的数组。

let arrayLike = {
  '0': 'a',
  '1': 'b',
  '2': 'c',
  length: 3
};
let arr = Array.from(arrayLike); // ['a', 'b', 'c']

在实际应用中,常见的类数组对象是 DOM 操作返回的 NodeList 集合,以及函数内部的arguments对象。Array.from都可以将它们转为真正的数组。

let ps = document.querySelectorAll('p');
Array.from(ps).filter(p => {
  return p.textContent.length > 100;
});

// arguments对象
function foo() {
  console.log(arguments);
  var args = Array.from(arguments);
  console.log(args);
}
foo(1, 2, 3);

只要是部署了 Iterator 接口的数据结构,Array.from都能将其转为数组。

Array.from('hello');
// ['h', 'e', 'l', 'l', 'o']

let namesSet = new Set(['a', 'b']);
Array.from(namesSet); // ['a', 'b']

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

实际上,扩展运算符(...)也可以将某些数据结构转为数组。如果一个对象有迭代器接口(Symbol.iterator),就可以通过扩展运算符转换。

let ps = document.querySelectorAll('p');
[...ps].filter(p => {
  return p.textContent.length > 100;
});

// arguments对象
function foo() {
  console.log(arguments);
  var args = [...arguments];
  console.log(args);
}
foo(1, 2, 3);

Array.from可以接受第二个参数,作用类似于数组的map方法,用来对每个元素进行处理,将处理后的值放入返回的数组。

Array.from(arrayLike, x => x * x);
// 等同于
Array.from(arrayLike).map(x => x * x);

Array.from([1, 2, 3], (x) => x * x) // [1, 4, 9]

// 返回每个参数的数据类型
function typesOf () {
  return Array.from(arguments, value => typeof value)
}
typesOf(null, [], NaN)
// ['object', 'object', 'number']

数组去重合并

function combine(){ 
  let arr = [].concat.apply([], arguments); //没有去重复的新数组
  return Array.from(new Set(arr));
} 

var m = [1, 2, 2], n = [2,3,3]; 
console.log(combine(m,n));                     // [1, 2, 3]

Array.isArray()

Array.isArray(obj)

判断一个对象是否为数组

Array.isArray([1, 2, 3]); // true
Array.isArray({foo: 123}); // false
Array.isArray("foobar"); // false
Array.isArray(undefined); // false
// 鲜为人知的事实:其实 Array.prototype 也是一个数组。
Array.isArray(Array.prototype); 

Array.of()

Array.of(element0[, element1[, ...[, elementN]]])

将一组值转换为数组

Array.of(3, 11, 8) // [3,11,8]
Array.of(3) // [3]
Array.of(3).length // 1

该方法的主要目的,是弥补数组构造函数Array()的不足。因为Array()参数不同,会有不同的行为。

Array() // []
Array(3) // [, , ,]
Array(3, 11, 8) // [3, 11, 8]

Array.prototype.concat()

var new_array = old_array.concat(value1[, value2[, ...[, valueN]]])

合并两个或多个数组,该方法不会更改现有数组,而是返回一个新数组。ES6 的扩展运算符也提供了新的合并方法,这两种方法都是浅拷贝。

const arr1 = ['a', 'b'];
const arr2 = ['c'];
const arr3 = ['d', 'e'];

arr1.concat(arr2, arr3);
// [ 'a', 'b', 'c', 'd', 'e' ]

// ES6 的合并数组
[...arr1, ...arr2, ...arr3]
// [ 'a', 'b', 'c', 'd', 'e' ]

Array.prototype.copyWithin()

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

  • target(必需):从该位置开始替换数据。如果为负值,表示倒数。
  • start(可选):从该位置开始读取数据,默认为 0。如果为负值,表示倒数。
  • end(可选):到该位置前停止读取数据,默认等于数组长度。如果为负值,表示倒数。

在当前数组内部,将指定位置的成员复制到其他位置(会覆盖原有成员),然后返回当前数组,会修改现有数组。

// 将3号位复制到0号位
[1, 2, 3, 4, 5].copyWithin(0, 3, 4)
// [4, 2, 3, 4, 5]

// -2相当于3号位,-1相当于4号位
[1, 2, 3, 4, 5].copyWithin(0, -2, -1)
// [4, 2, 3, 4, 5]

// 将3号位复制到0号位
[].copyWithin.call({length: 5, 3: 1}, 0, 3)
// {0: 1, 3: 1, length: 5}

// 将2号位到数组结束,复制到0号位
let i32a = new Int32Array([1, 2, 3, 4, 5]);
i32a.copyWithin(0, 2);
// Int32Array [3, 4, 5, 4, 5]

// 对于没有部署 TypedArray 的 copyWithin 方法的平台
// 需要采用下面的写法
[].copyWithin.call(new Int32Array([1, 2, 3, 4, 5]), 0, 3, 4);
// Int32Array [4, 2, 3, 4, 5]

Array.prototype.entries()

arr.entries()

用于遍历数组键值对,返回一个数组迭代器对象

let arr = ['a', 'b'];
for (let [index, elem] of arr.entries()) {
  console.log(index, elem);
}
// 0 "a"
// 1 "b"

Array.prototype.every()

arr.every(callback(element[, index[, array]])[, thisArg])

测试数组的所有元素是否都通过了指定函数的测试,该方法不会改变原数组。当所有的元素都符合条件才返回true,否则返回 false。callback被调用时传入三个参数:元素值,元素的索引,原数组

// 检测数组中的所有元素是否都大于 10
function isBigEnough(item, index, array) {
  return item>= 10;
}
passed1 = [12, 5, 8, 130, 44].every(isBigEnough);
// passed1 is false
passed2 = [12, 54, 18, 130, 44].every(isBigEnough);
// passed2 is true

Array.prototype.fill()

arr.fill(value[, start[, end]])

使用给定值,填充一个数组。用于空数组的初始化非常方便,可以接受第二个和第三个参数,用于指定填充的起始位置和结束位置

new Array(3).fill(7)
// [7, 7, 7]

['a', 'b', 'c'].fill(7, 1, 2)
// ['a', 7, 'c']

如果填充的类型为对象,那么被赋值的是同一个内存地址的对象,而不是深拷贝对象

let arr = new Array(3).fill({name: "Mike"});
arr[0].name = "Ben";
console.log(arr);
// [{name: "Ben"}, {name: "Ben"}, {name: "Ben"}]

let arr = new Array(3).fill([]);
arr[0].push(5);
arr
// [[5], [5], [5]]

Array.prototype.filter()

var new_array = arr.filter(callback(element[, index[, array]])[, thisArg])

创建一个新数组,返回包含通过所提供函数实现的测试的所有元素的一个新数组。它不会改变原数组,返回过滤后的新数组

// 使用filter()创建具有非零id的json
var arr = [
  { id: 15 },
  { id: -1 },
  { id: 0 },
  { id: 3 },
  { id: 12.2 },
  { },
  { id: null },
  { id: NaN },
  { id: 'undefined' }
];

var invalidEntries = 0;

function isNumber(obj) {
  return obj !== undefined && typeof(obj) === 'number' && !isNaN(obj);
}

function filterByID(item) {
  if (isNumber(item.id) && item.id !== 0) {
    return true;
  } 
  invalidEntries++;
  return false; 
}

var arrByID = arr.filter(filterByID);

console.log('Filtered Array\n', arrByID); 
// Filtered Array
// [{ id: 15 }, { id: -1 }, { id: 3 }, { id: 12.2 }]

console.log('Number of Invalid Entries = ', invalidEntries); 
// Number of Invalid Entries = 5
// 在数组中搜索
var fruits = ['apple', 'banana', 'grapes', 'mango', 'orange'];

const filterItems = (query) => {
  return fruits.filter((el) =>
    el.toLowerCase().indexOf(query.toLowerCase()) > -1
  );
}

console.log(filterItems('ap')); // ['apple', 'grapes']
console.log(filterItems('an')); // ['banana', 'mango', 'orange']

Array.prototype.find()

arr.find(callback(element[, index[, array]])[, thisArg])

用于找出第一个符合条件的数组成员,它的参数是一个回调函数,所有数组成员依次执行该回调函数,直到找出第一个为true的成员,然后返回该成员。如果没有符合条件的成员,则返回undefined,该方法不会改变原数组

[1, 5, 10, 15].find(function(value, index, arr) {
  return value > 9;
}) // 10

Array.prototype.findIndex()

arr.findIndex(callback(element[, index[, array]])[, thisArg])

用于找出第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回 -1

[1, 5, 10, 15].findIndex(function(value, index, arr) {
  return value > 9;
}) // 2

find()findIndex()方法都可以发现NaN,弥补了数组的indexOf方法的不足

[NaN].indexOf(NaN) // -1

[NaN].findIndex(y => Object.is(NaN, y)) // 0

Array.prototype.flat()(实验性 API)

var newArray = arr.flat(depth)

数组扁平化,返回一个新数组

[1, 2, [3, 4]].flat(); // [1, 2, 3, 4]

[1, 2, [3, [4, 5]]].flat(2); // [1, 2, 3, 4, 5]

[1, [2, [3]]].flat(Infinity); // [1, 2, 3]

Array.prototype.flatMap()(实验性 API)

var new_array = arr.flatMap(callback(element[, index[, array]])[, thisArg])

对原数组的每个成员执行一个函数(相当于执行map()方法),然后对返回值组成的数组执行flat()方法,flatMap()只能展开一层数组

// 相当于 [[2, 4], [3, 6], [4, 8]].flat()
[2, 3, 4].flatMap((x) => [x, x * 2])
// [2, 4, 3, 6, 4, 8]

Array.prototype.forEach()

array.forEach(callback(element[, index[, array]])[, thisArg])

注意: 没有返回一个新数组! & 没有返回值!
没有办法中止或者跳出 forEach 循环

对数组的每个元素执行一次提供的函数

// 如果数组在迭代时被修改了,则其他元素会被跳过
var words = ["one", "two", "three", "four"];
words.forEach(function(word) {
  console.log(word);
  if (word === "two") {
    words.shift();
  }
});
// one
// two
// four

Array.prototype.includes()

arr.includes(searchElement[, fromIndex)]

查找数组是否包含某个值,返回布尔值。第二个参数表示搜索的起始位置,默认为0。如果第二个参数为负数,则表示倒数的位置,如果这时它大于数组长度(比如第二个参数为-4,但数组长度为3),则会重置为从0开始。

[1, 2, 3].includes(2); // true
[1, 2, 3].includes(4); // false
// 注意,includes 查找 NaN 返回 true,indexOf 查找返回 -1
[1, 2, NaN].includes(NaN); // true
[1, 2, 3].includes(3, 3); // false
[1, 2, 3].includes(3, -1); // true

Array.prototype.indexOf()

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

查找数组中指定元素的第一个索引,如果不存在则返回 -1。第二个参数表示搜索的起始位置,默认为0。如果第二个参数为负数,则表示倒数的位置,如果这时它大于数组长度(比如第二个参数为-4,但数组长度为3),则会重置为从0开始。

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

找出指定元素出现的所有位置

var indices = [];
var array = ['a', 'b', 'a', 'c', 'a', 'd'];
var element = 'a';
var idx = array.indexOf(element);
while (idx != -1) {
  indices.push(idx);
  idx = array.indexOf(element, idx + 1);
}
console.log(indices);
// [0, 2, 4]

判断一个元素是否在数组里,不在则更新数组

function updateVegetablesCollection (veggies, veggie) {
    if (veggies.indexOf(veggie) === -1) {
        veggies.push(veggie);
        console.log('New veggies collection is : ' + veggies);
    } else if (veggies.indexOf(veggie) > -1) {
        console.log(veggie + ' already exists in the veggies collection.');
    }
}

var veggies = ['potato', 'tomato', 'chillies', 'green-pepper'];

// New veggies collection is : potato,tomato,chillies,green-papper,spinach
updateVegetablesCollection(veggies, 'spinach'); 
// spinach already exists in the veggies collection.
updateVegetablesCollection(veggies, 'spinach');

Array.prototype.join()

str = arr.join([separator])

将一个数组(或类数组对象)的所有元素连接成一个字符串并返回这个字符串,如果数组长度为0,则转化为空字符串,该方法不改变原数组。可选参数 separator 默认用逗号分隔,separator 为空字符串 "" 时,所有o元素之间没有任何字符。

var a = ['Wind', 'Rain', 'Fire'];
var myVar1 = a.join(); // myVar1的值变为"Wind,Rain,Fire"
var myVar2 = a.join(', '); // myVar2的值变为"Wind, Rain, Fire"
var myVar3 = a.join(' + '); // myVar3的值变为"Wind + Rain + Fire"
var myVar4 = a.join(''); // myVar4的值变为"WindRainFire"

// 连接类数组对象
function f(a, b, c) {
  var s = Array.prototype.join.call(arguments);
  console.log(s); // '1,a,true'
}
f(1, 'a', true);

Array.prototype.keys()

arr.keys()

用于遍历数组键名,返回一个数组迭代器对象

let arr = ['a', 'b'];
for (let index of arr.keys()) {
  console.log(index);
}
// 0
// 1

Array.prototype.lastIndexOf()

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

查找指定元素在数组中的最后一个索引,如果不存在则返回 -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

出指定元素出现的所有位置

var indices = [];
var array = ['a', 'b', 'a', 'c', 'a', 'd'];
var element = 'a';
var idx = array.lastIndexOf(element);

while (idx != -1) {
  indices.push(idx);
  // 注意,要单独处理idx==0 时的情况,因为如果是第一个元素,
  // 忽略了fromIndex参数则第一个元素总会被查找
  idx = (idx > 0 ? array.lastIndexOf(element, idx - 1) : -1);
}

console.log(indices);
// [4, 2, 0];

Array.prototype.map()

var new_array = array.map(callback(element[, index[, array]])[, thisArg])

返回一个新数组,每个元素都是回调函数的结果,map()不修改调用它的原数组本身

// 使用 map 重新格式化数组中的对象
var kvArray = [
  {key: 1, value: 10}, 
  {key: 2, value: 20}, 
  {key: 3, value: 30}
];

var reformattedArray = kvArray.map(function(obj) { 
   var rObj = {};
   rObj[obj.key] = obj.value;
   return rObj;
});

// reformattedArray 数组为: [{1: 10}, {2: 20}, {3: 30}], 

// kvArray 数组未被修改: 
// [{key: 1, value: 10}, 
//  {key: 2, value: 20}, 
//  {key: 3, value: 30}]
// 使用 map 方法获取字符串中每个字符所对应的 ASCII 码组成的数组
var map = Array.prototype.map;
var a = map.call("Hello World", function(x) { 
  return x.charCodeAt(0); 
})
// a的值为[72, 101, 108, 108, 111, 32, 87, 111, 114, 108, 100]
// 反转字符串
var str = '12345';
Array.prototype.map.call(str, function(x) {
  return x;
}).reverse().join(''); 

// 输出: '54321'
// Bonus: use '===' to test if original string was a palindrome

Array.prototype.pop()

arr.pop()

从数组中删除最后一个元素,并返回该元素的值,此方法更改数组的长度

let myFish = ["angel", "clown", "mandarin", "surgeon"];
let popped = myFish.pop();
console.log(myFish); // ["angel", "clown", "mandarin"]
console.log(popped); // surgeon

Array.prototype.push()

arr.push(element1, ..., elementN)

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

var sports = ["soccer", "baseball"];
var total = sports.push("football", "swimming");
console.log(sports); // ["soccer", "baseball", "football", "swimming"]
console.log(total); // 4

合并两个数组

var vegetables = ['parsnip', 'potato'];
var moreVegs = ['celery', 'beetroot'];

// 相当于 vegetables.push('celery', 'beetroot');
Array.prototype.push.apply(vegetables, moreVegs);

console.log(vegetables); 
// ['parsnip', 'potato', 'celery', 'beetroot']

Array.prototype.reduce()

arr.reduce(callback(accumulator, element[, index[, array]])[, initialValue])

  • accumulator:累加器累加回调的返回值;它是上一次调用回调时返回的累积值,或 initialValue
  • initialValue:第一个调用 callback的第一个参数的值。 如果没有提供初始值,则将使用数组中的第一个元素

对累加器和数组中的每个元素(从左到右)应用一个函数,将其减少为单个值

注意:如果没有提供initialValuereduce会从索引1的地方开始执行callback方法,跳过第一个索引。如果提供initialValue,从索引0开始。如果数组为空且没有提供initialValue,会抛出TypeError

var maxCallback = ( pre, cur ) => Math.max( pre.x, cur.x );

// reduce() without initialValue
[ { x: 22 }, { x: 42 } ].reduce( maxCallback ); // 42
[ { x: 22 }            ].reduce( maxCallback ); // { x: 22 }
[                      ].reduce( maxCallback ); // TypeError

**reduce如何运行 **

// 数组求和
[0, 1, 2, 3, 4].reduce(function(accumulator, currentValue, currentIndex, array){
  return accumulator + currentValue;
});

// ES6 写法
[0, 1, 2, 3, 4].reduce((prev, curr) => prev + curr );

callback 被调用四次,每次调用的参数和返回值如下表:

callback accumulator currentValue currentIndex array return value
first call 0 1 1 [0, 1, 2, 3, 4] 1
second call 1 2 2 [0, 1, 2, 3, 4] 3
third call 3 3 3 [0, 1, 2, 3, 4] 6
fourth call 6 4 4 [0, 1, 2, 3, 4] 10

将二维数组转化为一维

var flattened = [[0, 1], [2, 3], [4, 5]].reduce((acc, cur) => acc.concat(cur),[]);
// flattened is [0, 1, 2, 3, 4, 5]

计算数组中每个元素出现的次数

var names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];
var countedNames = names.reduce((allNames, name) => { 
  if (name in allNames) {
    allNames[name]++;
  }
  else {
    allNames[name] = 1;
  }
  return allNames;
}, {});
// countedNames is: { 'Alice': 2, 'Bob': 1, 'Tiff': 1, 'Bruce': 1 }

数组去重

let arr = [1,2,1,2,3,5,4,5,3,4,4,4,4];
let result = arr.sort().reduce((init, current) => {
    if(init.length === 0 || init[init.length-1] !== current){
        init.push(current);
    }
    return init;
}, []);
console.log(result); //[1,2,3,4,5]

Array.prototype.reduceRight()

arr.reduceRight(callback(accumulator, element[, index[, array]])[, initialValue])

对累加器和数组中的每个元素(从右到左)应用一个函数,将其减少为单个值

// reduce 与 reduceRight 之间的区别
var a = ['1', '2', '3', '4', '5']; 
var left  = a.reduce(function(prev, cur)      { return prev + cur; }); 
var right = a.reduceRight(function(prev, cur) { return prev + cur; }); 

console.log(left); // "12345"
console.log(right); // "54321"

Array.prototype.reverse()

arr.reverse()

颠倒数组中元素的位置,并返回该数组的引用

var myArray = ['one', 'two', 'three'];
myArray.reverse(); 
console.log(myArray) // ['three', 'two', 'one']

Array.prototype.shift()

arr.shift()

从数组中删除第一个元素,并返回该元素的值。此方法更改数组的长度

let myFish = ['angel', 'clown', 'mandarin', 'surgeon'];
console.log('调用 shift 之前: ' + myFish);
// "调用 shift 之前: angel,clown,mandarin,surgeon"
var shifted = myFish.shift(); 
console.log('调用 shift 之后: ' + myFish); 
// "调用 shift 之后: clown,mandarin,surgeon" 
console.log('被删除的元素: ' + shifted); 
// "被删除的元素: angel"

Array.prototype.slice()

arr.slice([begin[, end]])

从开始到结束(不包括结束)选择的数组的一部分浅拷贝到一个新数组对象,该方法不会修改原数组

var fruits = ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango'];
// 复制一个数组
var shallowCopy = fruits.slice();
var citrus = fruits.slice(1, 3);

// fruits contains ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']
// shallowCopy contains ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']
// citrus contains ['Orange','Lemon']

将一个类数组(Array-like)对象/集合转换成一个新数组

function list() {
  return Array.prototype.slice.call(arguments);
}

var list1 = list(1, 2, 3); // [1, 2, 3]

Array.prototype.some()

arr.some(callback(element[, index[, array]])[, thisArg])

测试数组中的某些元素是否通过由提供的函数实现的测试,该方法不会改变原数组。当某个元素符合条件就返回true,否则返回 false

// 检测在数组中是否有元素大于 10
[2, 5, 8, 1, 4].some(x => x > 10);  // false
[12, 5, 8, 1, 4].some(x => x > 10); // true

// 判断数组元素中是否存在某个值
var fruits = ['apple', 'banana', 'mango', 'guava'];

function checkAvailability(arr, val) {
  return arr.some(arrVal => val === arrVal);
}

checkAvailability(fruits, 'kela');   // false
checkAvailability(fruits, 'banana'); // true

Array.prototype.sort()

arr.sort([compareFunction])

对数组的元素进行排序,并返回排序后的数组。如果省略参数的话,默认会按照转换为的字符串的各个字符的Unicode位点进行排序

compareFunction格式如下:

function compare(a, b) {
  // 按某种排序标准进行比较, a 小于 b
  if (a < b ) {
    return -1;
  }
  if (a > b ) {
    return 1;
  }
  // a must be equal to b
  return 0;
}

要比较数字而非字符串,比较函数可以简单的以 a 减 b

function compareNumbers(a, b) {
  return a - b;
}

对非 ASCII 字符排序

var items = ['réservé', 'premier', 'clichä', 'communiqué', 'cafè', 'adieu'];
items.sort(function (a, b) {
  // 一些非英语语言的字符串需要使用 String.localeCompare,才可以将函数排序到正确的顺序
  return a.localeCompare(b);
});

// items is ["adieu", "cafè", "clichä", "communiqué", "premier", "réservé"]

使用映射改善排序
compareFunction较为复杂,且元素较多的时候,某些 ompareFunction可能会导致很高的负载,使用map辅助排序将会是一个好主意。基本思想是首先将数组中的每个元素比较的实际值取出来,排序后再将数组恢复。

// 需要被排序的数组
var list = ['Delta', 'alpha', 'CHARLIE', 'bravo'];

// 对需要排序的数字和位置的临时存储
var mapped = list.map(function(el, i) {
  return { index: i, value: el.toLowerCase() };
})

// 按照多个值排序数组
mapped.sort(function(a, b) {
  return +(a.value > b.value) || +(a.value === b.value) - 1;
});

// 根据索引得到排序的结果
var result = mapped.map(function(el){
  return list[el.index];
});

// result is ["alpha", "bravo", "CHARLIE", "Delta"]

Array.prototype.splice()

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

通过删除现有元素和/或添加新元素来更改一个数组的内容,返回由被删除的元素组成的一个数组。如果只删除了一个元素,则返回只包含一个元素的数组。如果没有删除元素,则返回空数组。

从第2位开始删除0个元素,插入“drum”

var myFish = ["angel", "clown", "mandarin", "surgeon"]; 
//从第 2 位开始删除 0 个元素,插入 "drum" 
var removed = myFish.splice(2, 0, "drum"); 
//运算后的 myFish:["angel", "clown", "drum", "mandarin", "surgeon"] 
//被删除元素数组:[],没有元素被删除

从第3位开始删除1个元素

var myFish = ['angel', 'clown', 'drum', 'mandarin', 'sturgeon'];
var removed = myFish.splice(3, 1);
//运算后的myFish:["angel", "clown", "drum", "sturgeon"]
//被删除元素数组:["mandarin"]

从第2位开始删除1个元素,然后插入“trumpet”

var myFish = ['angel', 'clown', 'drum', 'sturgeon'];
var removed = myFish.splice(2, 1, "trumpet"); 
//运算后的myFish: ["angel", "clown", "trumpet", "surgeon"] 
//被删除元素数组:["drum"]

从第0位开始删除2个元素,然后插入"parrot","anemone"和"blue"

var myFish = ['angel', 'clown', 'trumpet', 'sturgeon'];
var removed = myFish.splice(0, 2, 'parrot', 'anemone', 'blue');
// 运算后的myFish: ["parrot", "anemone", "blue", "trumpet", "sturgeon"] 
// 被删除元素数组:["angel", "clown"]

从第2位开始删除2个元素

var myFish = ['parrot', 'anemone', 'blue', 'trumpet', 'sturgeon'];
var removed = myFish.splice(-3, 2);
// 运算后的myFish: ["parrot", "anemone", "sturgeon"] 
// 被删除元素数组:["blue", "trumpet"]

从第2位开始删除所有元素

var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
var removed = myFish.splice(2);
// 运算后的myFish :["angel", "clown"] 
// 被删除的元素数组: ["mandarin", "sturgeon"]

Array.prototype.toLocaleString()

arr.toLocaleString([locales[,options]]);

返回一个字符串表示数组中的元素。

使用locales和options

var array1 = [1, 'a', new Date('21 Dec 1997 14:12:00 UTC')];
var localeString = array1.toLocaleString('en', {timeZone: "UTC"});
console.log(localeString);
// expected output: " 1,a,1997/12/21 下午10:12:00"

Array.prototype.toString()

arr.toString()

该特性是非标准的,请尽量不要在生产环境中使用它!

返回一个字符串,表示指定的数组及其元素

var array1 = [1, 2, 'a', '1a'];
console.log(array1.toString());
// expected output: "1,2,a,1a"

Array.prototype.unshift()

arr.unshift(element1, ..., elementN)

将一个或多个元素添加到数组的开头,并返回新数组的长度

var arr = [1, 2];
arr.unshift(0); //result of call is 3, the new array length
//arr is [0, 1, 2]
arr.unshift(-2, -1); // = 5
//arr is [-2, -1, 0, 1, 2]
arr.unshift( [-3] );
//arr is [[-3], -2, -1, 0, 1, 2]

Array.prototype.values()

arr.values()

用于遍历数组键值,返回一个数组迭代器对象

let arr = ['a', 'b'];
for (let elem of arr.values()) {
  console.log(elem);
}
// 'a'
// 'b'
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 157,012评论 4 359
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 66,589评论 1 290
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 106,819评论 0 237
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,652评论 0 202
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 51,954评论 3 285
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,381评论 1 210
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,687评论 2 310
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,404评论 0 194
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,082评论 1 238
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,355评论 2 241
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 31,880评论 1 255
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,249评论 2 250
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 32,864评论 3 232
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,007评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,760评论 0 192
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,394评论 2 269
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,281评论 2 259

推荐阅读更多精彩内容