高级开发人员知识:JavaScript 数组方法第 3 部分
今天让我们来点高级的。这些数组方法总是遍历数组。基本上,您可以通过基本的 for 循环获得相同的功能。如果是这样,我们为什么要使用它们?让我们始终使用 for 循环(!)。使用数组方法有几个优点。在开发人员体验方面,它们更加简洁,已经优化,更易于阅读等。无需再次发明轮子。你需要好好利用你宝贵的时间。当您想打印 hello world 1000 次时。您不会将相同的代码编写 1000 次,对吧?
笔记:
第1部分: https://medium.com/@the.soylemez/powerful-tools-javascript-array-methods-part-1-be1fe55ea29e _
第2部分:_ https://medium.com/@the.soylemez/do-you-really-know-javascript-array-methods-part2-8d3349e33986
Array.prototype.findIndex()
你还记得第 2 部分中的 find 方法吗?这两种方法非常相似。基本上,findIndex 方法接受一个返回条件的函数。数组中第一个满足条件的元素,将返回其索引。如果没有满足条件的元素,该方法将返回-1。
假设我们有一个充满名称的数组。我们想得到哈利的索引。
const names = ['Hermione', 'Harry', 'Ron', 'Harry', 'Albus'];
const harryIndex = names.findIndex((element) => element === 'Harry');
console.log(harryIndex);
输出:
1
Array.prototype.findLastIndex()
此方法与 findIndex 方法完全相同,只是有一个区别。与 findIndex 方法不同,此方法从最后一个元素开始。这意味着该方法将返回满足条件的最后一个元素。
让我们尝试上面的相同示例。但这一次我们要找到最后一个哈利。
const names = ['Hermione', 'Harry', 'Ron', 'Harry', 'Albus'];
const lastHarryIndex = names.findLastIndex((element) => element === 'Harry');
控制台.log(lastHarryIndex);
输出
3
Array.prototype.findLast()
就像 find 方法一样,但是这个方法是从最后一个索引开始的。 findLast 方法接受一个返回条件的函数参数。将返回数组中满足条件的最后一个元素。
让我们在给定的 numbers 数组中找到最后一个奇数元素。
常量数 = [1, 2, 3, 4, 5, 6];
const lastOddNumber = numbers.findLast((element) => element % 2 !== 0);
控制台.log(lastOddNumber);
输出:
5
Array.prototype.flat()
这个可能看起来很复杂。 flat 方法将数组中的子数组展平。如果您有嵌套数组。 flat 方法将帮助您将这些元素升级到给定的深度。接受一个论点。这个论点回答了你想要走多深和扁平化的问题。
假设我们有嵌套数组。我们希望这个数组只是一个包含所有值的数组。在下面的示例中,我们的数组有多深?好吧,我看到 1 个元素周围有 3 个方括号。所以我们需要深入 3 倍。
常量嵌套 = [1,2,[3,4],[[[5,6,7]]]];
const flattened = nested.flat(3);
console.log(扁平化);
输出:
[ 1、2、3、4、5、6、7]
注意:尝试给出 1 或 2 作为参数。查看结果。
Array.prototype.forEach()
顾名思义,forEach 方法遍历数组中的所有元素。并执行给定的函数参数。
假设我们要记录数组中的每个元素。
const names = ['Hermione', 'Ron', 'Harry', 'Albus'];
names.forEach((element) => console.log(element));
输出:
赫敏
罗恩
哈利
阿不思
Array.prototype.includes()
包含方法从给定的 startIndex 开始搜索数组作为第二个参数。如果匹配,则返回 true,否则返回 false。
const names = ['Hermione', 'Ron', 'Harry', 'Albus'];
const isRonIn = names.includes('Ron');
const isRonInAfterSecondIndex = names.includes('Ron',2);
const isTomRiddleIn = names.includes('Tom Riddle');
控制台.log(isRonIn);
控制台.log(isRonInAfterSecondIndex);
console.log(isTomRiddleIn);
首先,我们询问“Ron”是否在数组中。其次,我们询问“Ron”是否在从第二个索引开始的数组范围内。最后我们询问“Tom Riddle”是否在数组中。
输出:
真的
错误的
错误的
Array.prototype.indexOf()
indexOf 方法与 include 方法非常相似。不同之处在于 indexOf 方法返回找到的元素的索引。 indexOf 方法有 2 个参数(searchElement、startIndex)。如果 searchElement 在数组的给定范围内,则返回它的索引,否则返回 -1。 startIndex 参数的默认值为 0。
让我们尝试上面的相同示例,看看有什么不同。
const names = ['Hermione', 'Ron', 'Harry', 'Albus'];
const isRonIn = names.indexOf('Ron');
const isRonInAfterSecondIndex = names.indexOf('Ron',2);
const isTomRiddleIn = names.indexOf('汤姆谜语');
控制台.log(isRonIn);
控制台.log(isRonInAfterSecondIndex);
console.log(isTomRiddleIn);
输出:
1
-1
-1
恭喜!你有更多的知识
you.includes('知识')
输出:
真的
我的领英账户: https://www.linkedin.com/in/musabsoylemez/
资源:
https://developer.mozilla.org/
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明
本文链接:https://www.qanswer.top/5758/58113123
标签:const,log,Ron,开发人员,JavaScript,names,数组,方法 From: https://www.cnblogs.com/amboke/p/16645021.html