8 个有用的JavaScript中的数组函数


英文 | https://javascript.plainenglish.io/8-useful-array-functions-in-javascript-with-code-snippets-b8d5222bcab

翻译 | 杨小二


JavaScript 从一开始就有数组。这是一个非常有用的对象类型,它允许我们创建一个我们想要的任何类型的元素列表。子数组、购物清单或表中的数据都可以来自数组。
我不会在这里详细介绍数组,我假设你知道它们是如何工作的。但是,数组类型中内置了相当多的函数,当你在不同场景中实际使用数组时,这些函数非常有用。
1、Some and Every
有时,你想检查数组中的元素是否符合任何预设测试。这个测试应该是一个函数的形式。如果你愿意,这可以是一个箭头函数。它应该为测试考虑一个论点。some 函数至少查找一个通过测试的元素,而 each 仅在所有值都通过测试时才返回 true。
let arr [4, 5, 7, 8]let some = arr.some((x) => x > 6);// -> True
let every = arr.every((x) => x > 5);// -> false

2、Concat

可以使用 + 运算符对字符串进行连接,但是,这不能用数组完成。我们可以使用扩展运算符,也可以使用 concat 函数。我们可以在一个参数中给出我们想要添加到我们调用函数的数组中的数组。

const arr1 = ['a', 'b', 'c'];const arr2 = ['d', 'e', 'f'];const arr3 = arr1.concat(arr2);// -> ["a", "b", "c", "d", "e", "f"]

3、Length

最重要的函数之一(实际上只是一个值)是长度值。它返回数组中元素的数量。如果数组具有从索引 0 到 4 的值,它将返回 5,因为它有五个元素。这在创建传统的 for 循环时非常有用。

let arr = ['orange', 'apple', 'pear', 'dragonfruit'];let num = arr.length;// -> 4

4、Includes

在数组中要做的另一个非常重要的任务是检查数组中是否包含特定值。你可能想查看用户是否是素食主义者,或者食谱列表中是否包含某种成分。该函数将返回一个布尔值,具体取决于是否在数组中找到了该值。

let fruits = ['apple', 'banana', 'lemon', 'lime'];let hasCheeseburger = fruits.includes("cheeseburger");// -> false

5、Find and FindIndex

find 和 findIndex 函数非常相似。我们向函数传递一个测试,就像 some 一样。该函数将返回通过测试的第一个值,在 findIndex 的情况下,它将返回通过测试的第一个元素所在的索引。

let arr = [1, 2, 3, 4, 5]let found = arr.find((x) => x > 3)// -> 4
let foundIndex = arr.findIndex((x) => x > 3)// -> 3

6、Map

map 函数是一个非常有名的函数,它简单地将给定的函数应用于数组中的每个元素。它将返回一个新数组。这对于创建 React 元素列表非常有用。

const arr = [1, 4, 9, 16];
// pass a function to map that multiplies every itemconst arr2 = arr.map((item) => { return item * 2});
console.log(arr2);// expected output: Array [2, 8, 18, 32]

7、Filter

过滤数组是另一个具有许多用例的基本功能。你必须为它提供一个函数。如果某个元素通过了该测试,则将其包含在新数组中,否则不包含在新数组中。

function isOldEnough(value) {  return value >= 18;}
var filtered = [12, 5, 8, 34, 44].filter(isOldEnough);// -> [34, 44]

8、ForEach

除了使用for 循环,你还可以使用内置于数组中的 forEach 函数。它将为数组中的每个项目执行一个函数。它本质上将 for(i=0;i<arr.length;i++) 语法缩短为 arr.forEach() 。这是循环数组的一种非常优雅的方式。你可以在函数中输入 item 和 index 参数。

let arr = [1, 2, 3, 4]arr.forEach((item) => {  console.log(item) })

结论

使用数组会很有趣。它也可能是可怕的,如果你不知道如何与他们合作。幸运的是,它们非常容易掌握,有了这些函数,你在代码中处理数组时就无需担心了。

非常感谢你的阅读,祝你有美好的一天。


—————END—————

推荐阅读:



10 个CSS技巧前端开发必须要知道

做一些动图,学习一下 EventLoop

万字总结,体系化带你全面认识 Nginx !

Vue超好玩的新特性:在CSS中使用JS变量


8 个有用的JavaScript中的数组函数
最近面试BAT,整理一份面试资料前端面试BAT通关手册,覆盖了前端技术、CSS、JavaScript、框架、 数据库、数据结构等等。
获取方式:关注公众号并回复 前端 领取,更多内容陆续奉上。
明天见(。・ω・。)ノ♡

原创文章,作者:栈长,如若转载,请注明出处:https://www.cxyquan.com/13516.html

(0)
上一篇 2021年7月19日 17:33
下一篇 2021年7月20日 17:31

相关推荐

发表评论

登录后才能评论