常用的数组API

sweet曹操

已于 2022-07-06 22:06:30 修改

阅读量3.2k

点赞数 3

文章标签： javascript

于 2022-07-06 22:00:05 首次发布

本文链接：https://blog.csdn.net/m0_72247725/article/details/125646452

版权

第一大类：常用单独数组API

①给数组的开头添加一个或者多个元素：unshift

②，shift 从数组中删除第一个元素，返回值为删除的元素的值。此方法会更改数组的长度

描述

③，pop ：从数组中删除最后一个元素，并返回该元素，该方法会更改数组的长度。

④，push ：将一个或多个元素添加到数组的末尾，并返回该数组的新长度

⑤，splice 通过删除或者替换现有元素或者原地添加新的元素来修改数组，并以数组形式返回被修改的内容。此方法会改变原数组。

⑥， concat 用于合并两个或多个数组。该方法不会更改现有的的数组，而返回一个新数组。

⑦，sort : 对数组的元素按照码表进行排序，并返回数组（排列后的数组）。默认排列顺序是将元素转换为字符串，然后再按照码表进行排序。

返回值

⑧，reverse : 数组的反转 ,将数组的元素位置颠倒，并返回该数组。会改变原来的数组。

⑨，join : 将一个数组（或者一个类数组对象）的所有元素连成一个字符串，并返回这个字符串。

⑩，slice ：截取一段数组，该方法会返回一个新数组，这个数组有开始下标和结束下标决定的，为原数组的浅拷贝，（包括开始下标，但是不包括结束的下标）。原数组也不会更变。

返回值

第二大类批处理的数组的API

①，forEach ：对数组的每个元素执行一次给定的函数（类似于遍历数组）

②， map : 创建一个新数组，这个新数组由原数组的每个元素都调用一次提供的函数后的返回值组成。

返回值

③，filter : 创建一个新数组，包含通过给定的函数实现测试的所有元素。

返回值

④ some：测试数组中是不是至少有1 个元素通过了给定的函数测试。返回值为布尔类型

⑤， every : 测试一个数组的所有元素是否都能通过给定的函数，会返回一个布尔值。

第一大类：常用单独数组API

①给数组的开头添加一个或者多个元素：unshift

语法：arr.unshift(element1, ..., elementN) 要添加到数组开头的元素或多个元素。

返回值：返回该数组的新长度（长度不是数组）（该方法修改原来的数组）

当一个对象调用该方法时，返回其 length 属性值。

var array1 = [1, 2, 3];

console.log(array1.unshift(4, 5));
// expected output: 5  （这里是打印返回值）

console.log(array1);
// expected output: Array [4, 5, 1, 2, 3] （这里事打印数组（已经被改变））

例子2

var arr = [4,5,6];
arr.unshift(1,2,3);
console.log(arr); // [1, 2, 3, 4, 5, 6]

arr = [4,5,6]; // 重置数组
arr.unshift(1);
arr.unshift(2);
arr.unshift(3);
console.log(arr); // [3, 2, 1, 4, 5, 6]

②，shift 从数组中删除第一个元素，返回值为删除的元素的值。此方法会更改数组的长度

语法：arr.shift()

返回值：从数组删除的元素，如果数组为空数组，则返回 undefined、

var array1 = [1, 2, 3];

var firstElement = array1.shift();

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

console.log(firstElement);
// expected output: 1  （返回删除的元素）

描述

shift 方法移除索引为 0 的元素 (即第一个元素)，并返回被移除的元素，其他元素的索引值随之减 1。如果 length 属性的值为 0 (长度为 0)，则返回 undefined。

--------------------------------------------------------------------------------------------------------------------------------

③，pop ：从数组中删除最后一个元素，并返回该元素，该方法会更改数组的长度。

   语法：arr.pop()

返回值：从数组中删除的个数（如果当前是空数组，则返回 undefined）

例子：

var plants = ['broccoli', 'cauliflower', 'cabbage', 'kale', 'tomato'];

console.log(plants.pop());
// expected output: "tomato"

console.log(plants);
// expected output: Array ["broccoli", "cauliflower", "cabbage", "kale"]

plants.pop();

console.log(plants);
// expected output: Array ["broccoli", "cauliflower", "cabbage"]

---------------------------------------------------------------------------------------------------------------------------------

④，push ：将一个或多个元素添加到数组的末尾，并返回该数组的新长度

语法：arr.push(element1, ..., elementN)

例子：

var animals = ['pigs', 'goats', 'sheep'];

var count = animals.push('cows');
console.log(count);
// expected output: 4
console.log(animals);
// expected output: Array ["pigs", "goats", "sheep", "cows"]

animals.push('chickens', 'cats', 'dogs');
console.log(animals);
// expected output: Array ["pigs", "goats", "sheep", "cows", "chickens", "cats", "dogs"]

返回值：调用该方法后，返回新的length 属性值

---------------------------------------------------------------------------------------------------------------------------------

⑤，splice 通过删除或者替换现有元素或者原地添加新的元素来修改数组，并以数组形式返回被修改的内容。此方法会改变原数组。

语法： array.splice(start（开始的下标，默认从0开始计数）[, deleteCount（结束的下标）[, item1（添加进数组的元素）[, item2[, ...]]]])

返回值：由被删除的元素组成的一个数组，如果只删除了一个元素，则返回只包含一个元素的数组，如果没有删除元素，则返回空数组。

例子：

var 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 （替换：把新增的元素增加到下标4号里面）
console.log(months);
// expected output: Array ["Jan", "Feb", "March", "April", "May"]

start

指定修改的开始位置（从 0 计数）。如果超出了数组的长度，则从数组末尾开始添加内容；如果是负值，则表示从数组末位开始的第几位（从 -1 计数，这意味着 -n 是倒数第 n 个元素并且等价于 array.length-n）；如果负数的绝对值大于数组的长度，则表示开始位置为第 0 位

deleteCount 可选

整数，表示要移除的数组元素的个数。如果 deleteCount 大于 start 之后的元素的总数，则从 start 后面的元素都将被删除（含第 start 位）。如果 deleteCount 被省略了，或者它的值大于等于array.length - start(也就是说，如果它大于或者等于start之后的所有元素的数量)，那么start之后数组的所有元素都会被删除。如果 deleteCount 是 0 或者负数，则不移除元素。这种情况下，至少应添加一个新元素。

item1, item2, ... 可选

要添加进数组的元素，从start 位置开始。如果不指定，则 splice() 将只删除数组元素。

---------------------------------------------------------------------------------------------------------------------------------

⑥， concat 用于合并两个或多个数组。该方法不会更改现有的的数组，而返回一个新数组。

语法：var newArray =Array.concat(value1[, value2[, ...[, valueN]]])

可以拼接单个元素，不过多用于合并两个或者多个数组，数组/或值，

返回值: 新的数组。

例子：

avr array1 = ['a', 'b', 'c'];
var array2 = ['d', 'e', 'f'];
var array3 = array1.concat(array2);

console.log(array3);
// expected output: Array ["a", "b", "c", "d", "e", "f"]

---------------------------------------------------------------------------------------------------------------------------------

⑦，sort : 对数组的元素按照码表进行排序，并返回数组（排列后的数组）。默认排列顺序是将元素转换为字符串，然后再按照码表进行排序。

语法：arr.sort([compareFunction]（可选）) ，

这里的compare Function 用来指定某种进行排列的函数。如果省略，元素将按照转换为字符串后按照码表进行排序。

例子：

var months = ['March', 'Jan', 'Feb', 'Dec'];
months.sort();
console.log(months);
// expected output: Array ["Dec", "Feb", "Jan", "March"] (按照字母顺序排序）

var array1 = [1, 30, 4, 21, 100000];
array1.sort();
console.log(array1);
// expected output: Array [1, 100000, 21, 30, 4]  （把元素的首位数字按照阿拉伯顺序排序）

返回值

排序后的数组。请注意，数组已原地排序，并且不进行复制。

---------------------------------------------------------------------------------------------------------------------------------

⑧，reverse : 数组的反转 ,将数组的元素位置颠倒，并返回该数组。会改变原来的数组。

语法： arr.reverse()

返回值：颠倒后的数组

例子：

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

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

⑨，join : 将一个数组（或者一个类数组对象）的所有元素连成一个字符串，并返回这个字符串。

如果数组只有一个项目，那么将返回的这个项目不适用分隔符，默认分隔符为“，”逗号。

语法： arr.join([separator]（separator 为分隔符的意思，可以自定义分隔符)

返回值：使用join后会把数组变成一个数组，所以返回的是一个所有数组元素连接的字符串，如果 arr.length 为0，那么会返回空字符串。

例子：

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"

首先创建了一个数组 a，包含有三个元素，然后用四种不同的分隔符连接所有数组元素。首先是默认的分隔符逗号，然后是一个逗号加空格，接下来是一个加号前后加空格，最后是一个空字符串。

---------------------------------------------------------------------------------------------------------------------------------

⑩，slice ：截取一段数组，该方法会返回一个新数组，这个数组有开始下标和结束下标决定的，为原数组的浅拷贝，（包括开始下标，但是不包括结束的下标）。原数组也不会更变。

语法： arr.slice([begin[, end]])

begin 可选

提取起始处的索引（从 0 开始），从该索引开始提取原数组元素。如果该参数为负数，则表示从原数组中的倒数第几个元素开始提取，slice(-2) 表示提取原数组中的倒数第二个元素到最后一个元素（包含最后一个元素）。如果省略 begin，则 slice 从索引 0 开始。如果 begin 超出原数组的索引范围，则会返回空数组。

end 可选

提取终止处的索引（从 0 开始），在该索引处结束提取原数组元素。slice 会提取原数组中索引从 begin 到 end 的所有元素（包含 begin，但不包含 end）。slice(1,4) 会提取原数组中从第二个元素开始一直到第四个元素的所有元素（索引为 1, 2, 3 的元素）。如果该参数为负数，则它表示在原数组中的倒数第几个元素结束抽取。 slice(-2,-1) 表示抽取了原数组中的倒数第二个元素到最后一个元素（不包含最后一个元素，也就是只有倒数第二个元素）。如果 end 被省略，则 slice 会一直提取到原数组末尾。如果 end 大于数组的长度，slice 也会一直提取到原数组末尾。

返回值

一个含有被提取元素的新数组。

---------------------------------------------------------------------------------------------------------------------------------

第二大类批处理的数组的API

①，forEach ：对数组的每个元素执行一次给定的函数（类似于遍历数组）

语法： arr.forEach(callback(currentValue（） [, index [, array]])[, thisArg])

可依次向 callback 函数传入三个参数：

数组当前项的值
数组当前项的索引
数组对象本身

callback：为数组中每个元素执行的函数，该函数接收一至三个参数：

currentValue：数组中正在处理的当前元素。

index：数组中正在处理的当前元素的索引。

array ：forEach() 方法正在操作的数组。

thisArg ：可选参数。当执行回调函数 callback 时，用作 this 的值。

返回值： undefined

例子：

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

array1.forEach(element => console.log(element));

// expected output: "a"
// expected output: "b"
// expected output: "c"

---------------------------------------------------------------------------------------------------------------------------------

②， map : 创建一个新数组，这个新数组由原数组的每个元素都调用一次提供的函数后的返回值组成。

语法：

var new_array = arr.map(function callback(currentValue[, index[, array]]) {
 // Return element for new_array 
}[, thisArg])

callback

生成新数组元素的函数，使用三个参数：

currentValue

callback 数组中正在处理的当前元素。

index可选

callback 数组中正在处理的当前元素的索引。

array可选

map 方法调用的数组。

thisArg可选

执行 callback 函数时值被用作this

例子：

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

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

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

返回值

一个由原数组每个元素执行回调函数的结果组成的新数组。

---------------------------------------------------------------------------------------------------------------------------------

③，filter : 创建一个新数组，包含通过给定的函数实现测试的所有元素。

语法：var newArray = arr.filter(callback(element[, index[, array]])[, thisArg])

callback

用来测试数组的每个元素的函数。返回 true 表示该元素通过测试，保留该元素，false 则不保留。它接受以下三个参数：

element

数组中当前正在处理的元素。

index可选

正在处理的元素在数组中的索引。

array可选

调用了 filter 的数组本身。

thisArg可选

执行 callback 时，用于 this 的值。

例子：

var words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];

var result = words.filter(word => word.length > 6);

console.log(result);
// expected output: Array ["exuberant", "destruction", "present"]

返回值

一个新的、由通过测试的元素组成的数组，如果没有任何数组元素通过测试，则返回空数组。

---------------------------------------------------------------------------------------------------------------------------------

④ some：测试数组中是不是至少有1 个元素通过了给定的函数测试。返回值为布尔类型

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

callback

用来测试每个元素的函数，接受三个参数：

element

数组中正在处理的元素。

index 可选

数组中正在处理的元素的索引值。

array可选

some()被调用的数组。

thisArg可选

执行 callback 时使用的 this 值。

例子：

var array = [1, 2, 3, 4, 5];

// checks whether an element is even
var even = (element) => element % 2 === 0;

console.log(array.some(even));
// expected output: true

返回值：数组中至少有一个元素通过给定函数的测试就会返回 true，所有元素都没有通过给定函数的测试，就会返回 false

---------------------------------------------------------------------------------------------------------------------------------

⑤， every : 测试一个数组的所有元素是否都能通过给定的函数，会返回一个布尔值。

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

callback

用来测试每个元素的函数，它可以接收三个参数：

element

用于测试的当前值。

index可选

用于测试的当前值的索引。

array可选

调用 every 的当前数组。

thisArg

执行 callback 时使用的 this 值。

例子：

var isBelowThreshold = (currentValue) => currentValue < 40;

var array1 = [1, 30, 39, 29, 10, 13];

console.log(array1.every(isBelowThreshold));
// expected output: true

如果回调函数的每一次返回都为 truthy 值，返回 true，否则返回 false。