!!javascript_只需8分钟即可学习JavaScript数组方法！！

!! Javascript

数组方法&＃xff1a;

1.迭代方法 &＃xff1a;

• 检查方法 &＃xff1a;观察数组的上下文。
• 转换方法 &＃xff1a;从接收器派生一个新的数组。
• 归约方法 &＃xff1a;根据接收者的元素计算结果。
• From Loops &＃xff1a; 从循环迭代数组。

1.1考试方法

1.1.1 Array.forEach&＃xff08;回调&＃xff0c;thisValue&＃xff1f;&＃xff09;

遍历数组的每个条目。 它需要一个回调函数&＃xff0c;您可以在其中进行编码。 您不能脱离它或从中返回值。

范例&＃xff1a;

1.1.2 Array.every&＃xff08;回调&＃xff0c;thisValue&＃xff1f;&＃xff09;

如果回调对每个元素都返回true&＃xff0c;则返回true。 一旦回调返回false&＃xff0c;它将停止迭代。

范例&＃xff1a;

1.1.3 Array.some&＃xff08;回调&＃xff0c;thisValue&＃xff1f;&＃xff09;

如果回调函数对至少一个元素返回true&＃xff0c;则返回true。 一旦回调返回true&＃xff0c;它就会停止迭代。

范例&＃xff1a;

1.2。 转换方法

1.2.1 Array.map&＃xff08;callback&＃xff0c;thisValue&＃xff1f;&＃xff09;&＃xff1a;在为元素提供新值时进行复制。

这会将所有值映射到一个表达式&＃xff0c;并返回数组的修改后的副本&＃xff0c;而保留原始内容。

范例&＃xff1a;

1.2.2 Array.filter&＃xff08;callback&＃xff0c;thisValue&＃xff1f;&＃xff09;&＃xff1a;仅保留一些元素。

这将仅保留符合条件的元素&＃xff0c;并返回数组的修改后的副本&＃xff0c;而保持原始状态不变。

范例&＃xff1a;

1.3。 减少方法

1.3.1 Array.reduce&＃xff08;callback&＃xff0c;initialValue&＃xff1f;&＃xff09;&＃xff1a;从一个数组派生一个值

这会将所有元素简化为单个值&＃xff0c;而reducer function total取值和累加器。 要求将累加器设置为起始值&＃xff0c;并返回修改后的数组副本&＃xff0c;而保留原始格式。

范例&＃xff1a;

1.4。 从循环迭代数组

1.4.1对于循环

for loop是循环遍历数组的基本循环之一。 它需要一个起始索引&＃xff0c;然后循环到结束索引。 索引&＃61;&＃61;&＃61;整数。

范例&＃xff1a;

1.4.2 While循环

只要条件为真&＃xff0c; while loop就会循环。 下面的代码使用while循环。 在每次循环迭代中&＃xff0c;它都通过.shift&＃xff08;&＃xff09;删除数组的第一个元素&＃xff0c;并将其记录下来。

范例&＃xff1a;

1.4.3 Do-while循环

do-while循环的工作原理与while loops类似&＃xff0c;但是它将在每次循环迭代之后&＃xff08;而不是之前&＃xff09;检查其条件&＃xff0c;并且始终执行第一次迭代。

范例&＃xff1a;

2.数组构造方法 &＃xff1a;

2.1 Array.isArray&＃xff08;对象&＃xff09;

如果object是一个数组&＃xff0c;则返回true。 这是检查元素是否为数组的便捷方法。

范例&＃xff1a;

3.数组原型方法&＃xff1a;

这些按功能分组&＃xff1a;

• 破坏性的 &＃xff1a;它们更改了对其调用的数组。
• 非破坏性的 &＃xff1a;他们不修改接收者&＃xff0c;这样的方法经常返回新的数组

3.1。 破坏性方法

3.1.1 Array.shift&＃xff08;&＃xff09;

删除索引为0的元素并返回它。 后续元素的索引递减1。

范例&＃xff1a;

3.1.2 Array.unshift&＃xff08;elem1 ?, elem2 ?, ...&＃xff09;

将给定元素添加到数组中。 它返回新的长度。

范例&＃xff1a;

3.1.3 Array.pop&＃xff08;&＃xff09;

删除数组的最后一个元素并返回它。

范例&＃xff1a;

3.1.4 Array.push&＃xff08;elem1 ?, elem2 ?, ...&＃xff09;

将给定的元素添加到数组的末尾。 它返回新的长度。

范例&＃xff1a;

3.1.5 Array.splice&＃xff08;startIndex&＃xff0c;delete Count ?, elem1 ?, elem2 ?, ...&＃xff09;

从startIndex开始&＃xff0c;删除delete-Count元素并插入给定的元素。 简单来说&＃xff0c;我们将startIndex位置处的deleteCount元素替换为elem1, elem2等。 此方法返回已删除的元素。 Start可以为负&＃61;&＃xff08;-1&＃xff09;表示最后一个元素&＃xff0c;依此类推。

范例&＃xff1a;

3.1.6 Array.reverse&＃xff08;&＃xff09;

反转数组中元素的顺序&＃xff0c;并返回对原始&＃xff08;修改后的&＃xff09;数组的引用。

范例&＃xff1a;

3.1.7 Array.fill&＃xff08;新元素&＃xff0c;开始索引&＃xff0c;结束索引&＃xff09;

Array.fill将使用从start Index到end Index指定的元素添加或替换该元素。 如果未定义start Index则它将从0开始&＃xff0c;如果未定义end index &＃xff0c;则它将更改值直到数组的结尾。

范例&＃xff1a;

3.1.8 Array.sort&＃xff08;比较功能&＃xff1f;&＃xff09;

它将对数组排序并返回它。 这种排序通过将值转换为字符串来比较值&＃xff0c;这意味着数字不是数字排序的&＃xff0c;我们可以通过提供可选参数compareFunction()来解决此问题。

范例&＃xff1a;

3.2非破坏性方法

3.2.1 Array.concat&＃xff08;arr1 ?, arr2 ?, ...&＃xff09;

创建一个包含接收方所有元素的新数组&＃xff0c;如果参数之一不是数组&＃xff0c;则将其作为元素添加到结果中。 因此&＃xff0c;如果我们可以简单地说&＃xff0c;它将为新数组添加不同的数组元素。

范例&＃xff1a;

3.2.2 Array.join&＃xff08;分隔符&＃xff1f;&＃xff09;

在将条目转换为字符串之后&＃xff0c;使用每个条目之间的分隔符将它们连接起来&＃xff0c;这将返回一个字符串。 最适合与字符串和数字数组一起使用。 如果省略了分隔符&＃39;,&＃39;则使用&＃39;,&＃39; 。

范例&＃xff1a;

3.2.3 Array.slice&＃xff08;startIndex ?, endIndex&＃xff1f;&＃xff09;

它将数组元素复制到新数组中&＃xff0c;从start Index &＃xff0c;直到并排除end Index处的元素&＃xff0c;这意味着start Index到endIndex-1 。 如果两个索引中的任何一个为负&＃xff0c;则将数组长度添加到其中&＃xff0c;因此&＃xff08;-1&＃xff09;指向最后一个元素&＃xff0c;依此类推。

范例&＃xff1a;

3.2.4 Array.includes&＃xff08;&＃xff09;

Array.includes()检查项目是否在数组中退出。 它接受函数可以比较的数字或字符串。

范例&＃xff1a;

3.2.5 Array.indexOf&＃xff08;searchaValue&＃xff0c;startIndex&＃xff1f;&＃xff09;

从start Index开始&＃xff0c;它将在数组中search Value 。 它返回第一次出现的索引&＃xff0c;或者如果找不到任何内容&＃xff0c;则返回-1 。 如果start Index为负&＃xff0c;则将数组长度添加到其中&＃xff1b;如果缺少&＃xff0c;则搜索整个数组。

范例&＃xff1a;

3.2.6 Array.lastIndexOf&＃xff08;searchElement&＃xff0c;startIndex&＃xff1f;&＃xff09;

它将在数组中search Element &＃xff0c;从start Index &＃xff0c;向后。 它返回第一次出现的索引&＃xff0c;或者如果找不到则返回-1 。

范例&＃xff1a;

4.其他重要的阵列方法&＃xff1a;

4.1删除阵列中的重复项

4.1.1 Array.from&＃xff08;new Set&＃xff08;array&＃xff09;&＃xff09;

Set是一个不能有重复条目的对象。 您可以从数组创建新的Set &＃xff0c;然后将其转换回数组。

范例&＃xff1a;

4.2在数组中查找元素

4.2.1 Array.find&＃xff08;&＃xff09;

Array.find将以给定条件返回数组中的元素。 例如&＃xff0c;如果我们要从数组中获取某些元素并分别处理该元素。

范例&＃xff1a;

4.2.2 Array.findIndex&＃xff08;&＃xff09;

Array.findIndex将在给定条件下返回数组中元素的索引。 它与indexOf方法相同&＃xff0c;但唯一的区别是indexOf仅适用于原始值。 如果希望在object(array, object or function)找到一个object(array, object or function) &＃xff0c;则需要使用findIndex方法。

范例&＃xff1a;

仅使用Array.slice&＃xff08;&＃xff09;和Array.concat&＃xff08;&＃xff09;操纵数组。

有这么多的方法&＃xff0c;如push &＃xff0c; pop &＃xff0c; shift &＃xff0c; unshift &＃xff0c;和splice &＃xff0c;因为它们更容易为初学者使用&＃xff0c;如果我们打开任何书籍或网站&＃xff0c;他们使用这些方法来操纵数组。 但是这些方法会对数组进行变异&＃xff0c;以确保数组不会变异。 您可以对这五个方法使用slice和concat &＃xff0c;因为这两个是非破坏性方法&＃xff0c;它们不会修改现有数组&＃xff0c;它们将返回一个新数组。

1.添加元素

1.1将项目添加到数组的开头。

• 转换项目以将其添加到数组中&＃xff08;如果尚未添加&＃xff09;
• 将数组与concat结合在一起

范例&＃xff1a;

1.2将项目添加到数组的末尾

我们可以使用称为concat的方法将元素添加到数组的末尾。

范例&＃xff1a;

1.3将项目添加到数组的中间

我们的想法是将元素添加到中间的阵列是您的阵列分成两个部分与slice然后在这个序列中加入三个阵列一起&＃xff1a; first part, items to add, second part 。

范例&＃xff1a;

2.移除元件

2.1从正面卸下物品

我们可以使用方法slice从数组的slice删除元素。

范例&＃xff1a;

2.2从末端取出物品

我们可以使用相同的方法从数组的开头删除元素。 但首先&＃xff0c;我们需要传递正确的endIndex值。 这样您就可以删除最后一项&＃xff0c;并可以使用Array.length - 1作为endIndex值。

范例&＃xff1a;

2.3从中间取出物品

从数组中间删除项目要比从末尾删除项目更为棘手。 这个想法是用slice复制要保留的部分&＃xff0c;然后用concat将复制的数组连接在一起。

范例&＃xff1a;

在Instagram上关注我 &＃64;hypnosisss___ 和Twitter &＃64;akash_Rajvanshi

查看我其他的生产力工具帖子&＃xff1a;

1. 完成家庭媒体服务器的安装&＃xff01;&＃xff01;
2. 从头开始设置Manjaro Linux&＃xff01;
3. 为Front_End_Development设置Visual Studio代码&＃xff01;&＃xff01;

翻译自: https://hackernoon.com/how-to-manipulate-arrays-in-Javascript-ea5ln2ata

!! Javascript