前端【数组】方法大全

目次

一、Array 属性
1、 constructor 属性返回对象的构造函数。
2、length 属性设置或返回数组中元素的数量。
二、Array 方法
1、concat()方法用于连接两个或多个数组。
2、copyWithin()方法将数组元素复制到数组中的另一个位置，覆盖现有值。
3、entries()方法返回带有键/值对的 Array Iterator 对象。
4、every()方法对数组中存在的每个元素实验一次函数
5、fill()方法用静态值添补数组中的指定元素。
6、filter() 过滤数组元素得到新的数组
7、find() 返回数组中第一个通过测试的元素的值。
8、findIndex()返回数组中通过测试的第一个元素的索引。
9、forEach()遍历数组元素
10、from() 从具有 length 属性或可迭代对象转为数组
 11、includes()确定数组是否包罗指定的元素。
12、indexOf()在数组中搜刮指定项目，并返回其位置。
13、isArray()判定对象是否为数组。
14、join()将数组作为字符串返回。
15、lastIndexOf()返回元素末了一次出现的角标。
16、map()为每个数组元素调用函数的结果创建新数组。
17、pop()移除数组的末了一个元素，并返回该元素。
18、push()向数组末端添加新项目，并返回新长度。
19、reduce()累计盘算
20、reduceRight()累计盘算
21、reverse()反转数组中元素的顺序。
22、shift()移除数组的第一项。
23、slice()截取数组元素，返回新的数组对象
24、some() 查抄数组元素是否通过测试（作为函数提供）。
25、sort()数组排序
26、splice()从数组添加/删除项目
27、toString()返回包罗所有数组值的字符串，以逗号分隔。
28、unshift()在数组的开头添加数据，并返回新的长度

---

一、Array 属性

属性描述constructor返回创建 Array 对象原型的函数。length设置或返回数组中元素的数量。prototype允许您向数组添加属性和方法。 1、 constructor 属性返回对象的构造函数。

  

1. var fruits = ["hello", "Java"];
2. fruits.constructor;
4. // ƒ Array() { [native code] }

复制代码

2、length 属性设置或返回数组中元素的数量。

  

1. var fruits = ["hello", "Java"];
2. fruits.length;
4. // 2

复制代码

二、Array 方法

方法描述concat()连接两个或多个数组，并返回已连接数组的副本。copyWithin()将数组中的数组元素复制到指定位置或从指定位置复制。entries()返回键/值对数组迭代对象。every()查抄数组中的每个元素是否通过测试。fill()用静态值添补数组中的元素。filter()使用数组中通过测试的每个元素创建新数组。find()返回数组中第一个通过测试的元素的值。findIndex()返回数组中通过测试的第一个元素的索引。forEach()为每个数组元素调用函数。from()从对象创建数组。includes()查抄数组是否包罗指定的元素。indexOf()在数组中搜刮元素并返回其位置。isArray()查抄对象是否为数组。join()将数组的所有元素连接成一个字符串。keys()返回 Array Iteration 对象，包罗原始数组的键.lastIndexOf()在数组中搜刮元素，从末端开始，并返回其位置。map()使用为每个数组元素调用函数的结果创建新数组。pop()删除数组的末了一个元素，并返回该元素。push()将新元素添加到数组的末端，并返回新的长度。reduce()将数组的值减为单个值（从左到右）。reduceRight()将数组的值减为单个值（从右到左）。reverse()反转数组中元素的顺序。shift()删除数组的第一个元素，并返回该元素。slice()选择数组的一部分，并返回新数组。some()查抄数组中的任何元素是否通过测试。sort()对数组的元素进行排序。splice()从数组中添加/删除元素。toString()将数组转换为字符串，并返回结果。unshift()将新元素添加到数组的开头，并返回新的长度。valueOf()返回数组的原始值。 1、concat()方法用于连接两个或多个数组。

concat() 方法不会更改现有数组，而是返回一个新数组。
  

1. var sedan = ["S60", "S90"];
2. var SUV = ["XC40", "XC60", "XC90"];
3. var wagon = ["V60", "V90", "V90CC"];
4. sedan.concat(SUV, wagon);

复制代码

2、copyWithin()方法将数组元素复制到数组中的另一个位置，覆盖现有值。

copyWithin() 方法永远不会向数组添加更多项。copyWithin() 方法会覆盖原始数组。
  

1. <em>array</em>.copyWithin(<em>target</em>, <em>start</em>, <em>end</em>)

复制代码

target	必须。将元素复制到的索引位置。
start	可选。开始复制元素的索引位置（默认为 0）。
end	可选。停止从中复制元素的索引位置（默认为 array.length）。

  将前两个数组元素复制到末了两个数组元素：
  

1. var fruits = ["Banana", "Orange", "Apple", "Mango"];
2. fruits.copyWithin(2, 0);
4. // (4) ['Banana', 'Orange', 'Banana', 'Orange']

复制代码

将前两个数组元素复制到第三和第四个位置：
  

1. var fruits = ["Banana", "Orange", "Apple", "Mango", "Kiwi", "Papaya"];
2. fruits.copyWithin(2, 0, 2);
3. // (6) ['Banana', 'Orange', 'Banana', 'Orange', 'Kiwi', 'Papaya']

复制代码

3、entries()方法返回带有键/值对的 Array Iterator 对象。

        对于原始数组中的每一项，新的迭代对象将包罗一个以索引为键，以项值为值的数组entries() 不会更改原始数组。
  

1. var fruits = ["Banana", "Orange", "Apple", "Mango"];
2. var f = fruits.entries();
3. f
5. // Array Iterator {}
7. for (x of f) {
8.   console.log(x)
9. }
10. // vconsole.min.js:10 (2) [0, 'Banana']
11. // vconsole.min.js:10 (2) [1, 'Orange']
12. // vconsole.min.js:10 (2) [2, 'Apple']
13. // vconsole.min.js:10 (2) [3, 'Mango']

复制代码

4、every()方法对数组中存在的每个元素实验一次函数

• 如果找到函数返回 false 值的数组元素，every() 返回 false（而且不查抄剩余值）
  
• 如果没有出现 false，every() 返回 true
  

every() 不对没有值的数组元素实验函数。every() 不改变原始数组。
  

1. <strong><em>array</em>.every(function(<em>currentValue</em>, <em>index</em>, <em>arr</em>), <em>thisValue</em>)</strong>

复制代码

function(currentValue, index, arr)	必须。为数组中的每个元素运行的函数。      参数描述
currentValue	必须。当前元素的值。
index	可选。当前元素的数组索引。
arr	可选。当前元素所属的数组对象

thisValue 可选。要通报给函数以用作其 "this" 值的值。
如果此参数为空，则值 "undefined" 将作为其 "this" 值通报。
   

1. var ages = [32, 33, 16, 40];
3. function checkAdult(age) {
4.   return age >= 18;
5. }
7. var ev = ages.every(checkAdult)
8. ev
10. // false

复制代码

5、fill()方法用静态值添补数组中的指定元素。

   

• 可以指定开始和竣事添补的位置。如果未指定，则将添补所有元素。
  
• fill() 会覆盖原始数组。
  

     array.fill(value, start, end)
  

value	必须。用于添补数组的值。
start	可选。开始添补数组的索引（默认为 0）。
end	可选。停止添补数组的索引（默认为 array.length）。

  用静态值添补所有数组元素：
  

1. var fruits = ["Banana", "Orange", "Apple", "Mango"];
2. fruits.fill("Kiwi");
4. // (4) ['Kiwi', 'Kiwi', 'Kiwi', 'Kiwi']

复制代码

用静态值添补末了两个数组元素：
  

1. var fruits = ["Banana", "Orange", "Apple", "Mango"];
2. fruits.fill("Kiwi", 2, 4);
4. // (4) ['Banana', 'Orange', 'Kiwi', 'Kiwi']

复制代码

6、filter() 过滤数组元素得到新的数组

不会对没有值的数组元素实验该函数。 不会改变原始数组。
  

1. var ages = [32, 33, 16, 40];
3. function checkAdult(age) {
4.   return age >= 18;
5. }
7. var newArr = ages.filter(checkAdult);
9. // (3) [32, 33, 40]

复制代码

7、find() 返回数组中第一个通过测试的元素的值。

方法对数组中存在的每个元素实验一次函数：

• 如果找到函数返回 true 值的数组元素，则 find() 返回该数组元素的值（而且不查抄剩余值）
  
• 否则返回 undefined
  

 不对空数组实验该函数。 不会改变原始数组。
  

1. var ages = [3, 10, 18, 20];
3. function checkAdult(age) {
4.   return age >= 18;
5. }
6. ages.find(checkAdult)
8. // 18

复制代码

8、findIndex()返回数组中通过测试的第一个元素的索引。

方法对数组中存在的每个元素实验一次函数：

• 如果找到函数返回 true 值的数组元素，则 findIndex() 返回该数组元素的索引（而且不查抄剩余值）
  
• 否则返回 -1
  

不会为没有值的数组元素实验函数。不会改变原始数组。
  

1. var ages = [3, 10, 18, 20];
3. function checkAdult(age) {
4.   return age >= 18;
5. }
6. ages.findIndex(checkAdult);
8. // 2

复制代码

9、forEach()遍历数组元素

对于没有值的数组元素，不实验forEach() 方法
  

1. var fruits = ["apple", "orange", "cherry"];
2. fruits.forEach(function (item) {
3.     console.log(item)
4. });
5. // apple
6. // orange
7. // cherry

复制代码

10、from() 从具有 length 属性或可迭代对象转为数组

  

1. Array.from("ABCDEFG");
3. // (7) ['A', 'B', 'C', 'D', 'E', 'F', 'G']

复制代码

 11、includes()确定数组是否包罗指定的元素。

如果数组包罗元素，则此方法返回 true，否则返回 false。
includes() 方法区分大小写。
  

1. <em>array</em>.includes(<em>element</em>, <em>start</em>)

复制代码

element	必须。要搜刮的元素。
start	可选。默认 0。在数组中的哪个位置开始搜刮。

   

1. var fruits = ["Banana", "Orange", "Apple", "Mango"];
2. var n = fruits.includes("Mango");
4. // true

复制代码

从位置 3 开始搜刮
  

1. var fruits = ["Banana", "Orange", "Apple", "Mango"];
2. var n = fruits.includes("Banana", 3);
4. // false

复制代码

12、indexOf()在数组中搜刮指定项目，并返回其位置。

搜刮将从指定位置开始，如果未指定开始位置，则从头开始，并在数组末端竣事搜刮。
如果未找到该项目，则 indexOf() 返回 -1。
如果该项目出现多次，则 indexOf() 方法返回第一次出现的位置。
  

1. <em>array</em>.indexOf(<em>item</em>, <em>start</em>)

复制代码

item	必须。要搜刮的项目。
start	可选。从那里开始搜刮。负值给定的位置将从末端计数，然后搜刮到末了。

   

1. var fruits = ["Banana", "Orange", "Apple", "Mango"];
2. var a = fruits.indexOf("Apple");
4. // 2

复制代码

从位置 4 开始搜刮
  

1. var fruits = ["Banana", "Orange", "Apple", "Mango", "Banana", "Orange", "Apple"];
2. var a = fruits.indexOf("Apple", 4);
4. // 6

复制代码

13、isArray()判定对象是否为数组。

如果对象是数组，则此函数返回 true，否则返回 false。
  

1. var fruits = ["Banana", "Orange", "Apple", "Mango"];
2. Array.isArray(fruits);
4. // true

复制代码

14、join()将数组作为字符串返回。

元素将由指定的分隔符分隔。默认分隔符是逗号 (,)；join() 方法不会改变原始数组。
  

1. var fruits = ["Banana", "Orange", "Apple", "Mango"];
2. var energy = fruits.join();
4. // 'Banana,Orange,Apple,Mango'

复制代码

使用差异的分隔符
  

1. var fruits = ["Banana", "Orange", "Apple", "Mango"];
2. var energy = fruits.join(" and ");
4. // 'Banana and Orange and Apple and Mango'

复制代码

15、lastIndexOf()返回元素末了一次出现的角标。

搜刮将从指定位置开始，如果未指定开始位置，则从末端开始，并在数组的开头竣事搜刮。
如果未找到该项目，则 lastIndexOf() 方法返回 -1。
  

1. var fruits = ["Banana", "Orange", "Apple", "Mango", "Banana", "Orange", "Apple"];
2. var a = fruits.lastIndexOf("Apple");
4. // 6

复制代码

从位置 4 开始搜刮
  

1. var fruits = ["Banana", "Orange", "Apple", "Mango", "Banana", "Orange", "Apple"];
2. var a = fruits.lastIndexOf("Apple", 4);
4. // 2

复制代码

16、map()为每个数组元素调用函数的结果创建新数组。

对没有值的数组元素不实验函数。不会改变原始数组。
  

1. var numbers = [65, 44, 12, 4];
2. var newarray = numbers.map(function(item) {
3.     return item*10
4. })
6. // (4) [650, 440, 120, 40]

复制代码

17、pop()移除数组的末了一个元素，并返回该元素。

  

1. var fruits = ["Banana", "Orange", "Apple", "Mango"];
2. fruits.pop();
4. // 'Mango'

复制代码

18、push()向数组末端添加新项目，并返回新长度。

  

1. var fruits = ["Banana", "Orange", "Apple", "Mango"];
2. fruits.push("Kiwi");
4. // 5

复制代码

19、reduce()累计盘算

为数组的每个值（从左到右）实验提供的函数。函数的返回值存储在累加器中（结果/总计）。
  

1. var numbers = [175, 50, 25];
3. var total = numbers.reduce(myFunc);
5. function myFunc(total, num) {
6.   return total - num;
7. }
9. // 100

复制代码

  

1. var numbers = [15.5, 2.3, 1.1, 4.7];
3. function getSum(total, num) {
4.   return total + num;
5. }
7. var t = numbers.reduce(getSum, 0);
9. // 23.6

复制代码

20、reduceRight()累计盘算

为数组的每个值（从右到左）实验提供的函数。函数的返回值存储在累加器中（结果/总计）。
  

1. var numbers = [175, 50, 25];
3. var total = numbers.reduceRight(myFunc);
5. function myFunc(total, num) {
6.   return total - num;
7. }
9. // -200

复制代码

  

1. var numbers = [15.5, 2.3, 1.1, 4.7];
3. function getSum(total, num) {
4.   return total + num;
5. }
7. var t = numbers.reduceRight(getSum, 0);
9. // 23.6

复制代码

21、reverse()反转数组中元素的顺序。

方法将改变原始数组。
  

1. var fruits = ["Banana", "Orange", "Apple", "Mango"];
2. fruits.reverse();
4. // (4) ['Mango', 'Apple', 'Orange', 'Banana']

复制代码

22、shift()移除数组的第一项。

会改变数组的长度。返回值是被移除的项目。会改变原始数组。
  

1. var fruits = ["Banana", "Orange", "Apple", "Mango"];
2. fruits.shift();
4. // 'Banana'

复制代码

23、slice()截取数组元素，返回新的数组对象

选择从给定的 start 参数开始的元素，并在给定的 end 参数处竣事，但不包括。
  

1. var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
2. var citrus = fruits.slice(1, 3);
4. // (2) ['Orange', 'Lemon']

复制代码

  

1. var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
2. var myBest = fruits.slice(-3, -1);
4. // (2) ['Lemon', 'Apple']

复制代码

24、some() 查抄数组元素是否通过测试（作为函数提供）。

• 如果找到函数返回真值的数组元素，some() 返回真（而且不查抄剩余值）
  
• 否则返回 false 
  

1. var ages = [3, 10, 18, 20];
3. function checkAdult(age) {
4.   return age >= 18;
5. }
7. var a = ages.some(checkAdult);
9. // true

复制代码

25、sort()数组排序

会改变原始数组

1. var fruits = ["Banana", "Orange", "Apple", "Mango"];
2. fruits.sort();
4. // (4) ['Apple', 'Banana', 'Mango', 'Orange']

复制代码

按升序对数组中的数字进行排序

1. var points = [40, 100, 1, 5, 25, 10];
2. points.sort(function(a, b){return a-b});
4. // (6) [1, 5, 10, 25, 40, 100]

复制代码

按降序对数组中的数字进行排序

1. var points = [40, 100, 1, 5, 25, 10];
2. points.sort(function(a, b){return b-a});
4. // (6) [100, 40, 25, 10, 5, 1]

复制代码

获取数组中的最小值

1. var points = [40, 100, 1, 5, 25, 10];
2. points.sort(function(a, b){return a-b})[0];
4. // 1

复制代码

获取数组中的最大值

1. var points = [40, 100, 1, 5, 25, 10];
2. points.sort(function(a, b){return b-a})[0];
4. // 100

复制代码

26、splice()从数组添加/删除项目

  

1. <em>array</em>.splice(<em>index</em>, <em>howmany</em>, <em>item1</em>, ....., <em>itemX</em>)

复制代码

index	必须。整数，指定在什么位置添加/删除项目，使用负值指定从数组末端开始的位置。
howmany	可选。要删除的项目数。如果设置为 0，则不会删除任何项目。
item1, ..., itemX	可选。要添加到数组中的新项目。

1. var fruits = ["Banana", "Orange", "Apple", "Mango"];
2. fruits.splice(2, 0, "Lemon", "Kiwi");
4. // (6) ['Banana', 'Orange', 'Lemon', 'Kiwi', 'Apple', 'Mango']

复制代码

在位置 2，添加新项目，并删除 1 个项目

1. var fruits = ["Banana", "Orange", "Apple", "Mango"];
2. fruits.splice(2, 1, "Lemon", "Kiwi");
3. fruits
4. // (5) ['Banana', 'Orange', 'Lemon', 'Kiwi', 'Mango']

复制代码

在位置 2，删除 2 个项目：

1. var fruits = ["Banana", "Orange", "Apple", "Mango", "Kiwi"];
2. fruits.splice(2, 2);
4. // (3) ['Banana', 'Orange', 'Kiwi']

复制代码

27、toString()返回包罗所有数组值的字符串，以逗号分隔。

不会改变原始数组。

1. var fruits = ["Banana", "Orange", "Apple", "Mango"];
2. var x = fruits.toString();
4. // 'Banana,Orange,Apple,Mango'

复制代码

28、unshift()在数组的开头添加数据，并返回新的长度

1. var fruits = ["Banana", "Orange", "Apple", "Mango"];
2. fruits.unshift("Lemon","Pineapple");
4. // 6

复制代码

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。