首页 > 编程语言 >每个开发人员都应该掌握的 JavaScript 数组方法(第 1 部分)

每个开发人员都应该掌握的 JavaScript 数组方法(第 1 部分)

时间:2024-09-26 21:25:56浏览次数:1  
标签:console log 开发人员 age JavaScript element returns 数组

“能力越大,责任越大。”— 本叔叔,蜘蛛侠 (2002)就像蜘蛛侠必须掌握他新发现的能力一样,开发人员需要掌握 javascript 强大的数组方法才能高效、负责任地进行编码。 让我们深入研究一些必须知道的数组方法! 1. 查找find() 方法返回满足所提供的测试函数的第一个数组元素的值。arr.find(callback(element, index, arr),thisarg)立即学习“Java免费学习笔记(深入)”;返回数组中满足给定函数的第一个元素的值。如果没有元素满足该函数,则返回未定义const cuties = [ { name: "wanda maximoff", age: 31 }, { name: "natasha romanoff", age: 32 }, { name: "jane foster", age: 27 }, { name: "gwen stacy", age: 26 },];// find method returns the value of the first element // in the array that satisfies the given function // or else returns undefinedlet cuty = cuties.find(({ age }) =&gt; age &gt;= 30);// output: { name: 'wanda maximoff', age: 31 }console.log(cuty);登录后复制 2. 查找索引findindex() 方法返回满足所提供的测试函数的第一个数组元素的索引,否则返回 -1。arr.findindex(callback(element, index, arr),thisarg)返回数组中满足给定函数的第一个元素的索引。如果没有元素满足该函数,则返回-1。const cuties = [ { name: "wanda maximoff", age: 31 }, { name: "natasha romanoff", age: 32 }, { name: "jane foster", age: 27 }, { name: "gwen stacy", age: 26 },];// findindex method returns the index of the first array element // that satisfies the provided test function or else returns -1.let cutyindex = cuties.findindex(({ age }) =&gt; age &gt;= 30);// output: 0console.log(cutyindex);登录后复制 3.索引indexof() 方法返回数组元素出现的第一个索引,如果未找到,则返回 -1。arr.indexof(searchelement, fromindex)如果元素在数组中至少出现一次,则返回该元素的第一个索引。如果在数组中未找到该元素,则返回-1。const productprices = [5, 12, 3, 20, 5, 2, 50];// indexof() returns the first index of occurance // of an array element, or?-1?if it is not found.let firstindex = productprices.indexof(20);console.log(firstindex); // 3let secondindex = productprices.indexof(5);console.log(secondindex); // 0// the second argument specifies the search start indexlet thirdindex = productprices.indexof(5, 1);console.log(thirdindex); // 4// indexof returns -1 if not foundlet notfoundindex = productprices.indexof(15);console.log(notfoundindex); // -1登录后复制 4. 排序sort() 方法按特定顺序(升序或降序)对数组的项目进行排序。arr.sort(comparefunction)对数组元素进行排序后返回数组(这意味着它更改了原始数组并且不进行复制)。const avengers = ["captain", "tony", "thor", "natasha", "bruce", "clint"];// modifies the array in placeavengers.sort(); // [ 'bruce', 'captain', 'clint', 'natasha', 'thor', 'tony' ]console.log(avengers); const nums = [1000, 50, 2, 7, 14];// number is converted to string and sortednums.sort(); // output: [ 1000, 14, 2, 50, 7 ]console.log(nums) // sort nums in ascending order by providing compare functionnums.sort((a, b) =&gt; a - b);// output: [ 2, 7, 14, 50, 1000 ]console.log(nums);登录后复制 5. 包括includes() 方法检查数组是否包含指定元素。arr.includes(valuetofind, fromindex)includes() 方法返回:如果在数组 searchvalue 中的任何位置找到,则为 true如果在数组 searchvalue 中找不到任何位置,则返回 falseconst avengers = ["captain", "tony", "thor", "natasha", "bruce", "clint"];// includes() method returns true if an array contains // a specified element or else returns false.let check1 = avengers.includes("thor");console.log(check1); // true // second argument specifies position to start the searchlet check2 = avengers.includes("thor", 3);console.log(check2); // false// the search starts from the 4th-to-last element ("hulk") // and checks the rest of the array for "thor". let check3 = avengers.includes("thor", -4);console.log(check3); // true登录后复制 6. foreachforeach() 方法为每个数组元素执行提供的函数。arr.foreach(callback(currentvalue), thisarg)? foreach() 不会对没有值的数组元素执行回调。? 返回未定义。const nums = [120, 150, 80, , 200];// foreach() method executes a provided // function for each array element which // have values. it returns undefined./*num 0: 120num 1: 150num 2: 80num 4: 200*/nums.foreach((value, index) =&gt; { console.log('num ' + index + ': ' + value);});登录后复制 7. 切片slice() 方法将数组的一部分的浅拷贝返回到新的数组对象中。arr.slice(开始, 结束)? 返回包含提取元素的新数组。const fruits = ["apple", "banana", "orange", "grape", "mango"];// slicing the array (from start to end)let slicedfruits1 = fruits.slice();console.log(slicedfruits1); // [ 'apple', 'banana', 'orange', 'grape', 'mango' ]// slicing from the third elementlet slicedfruits2 = fruits.slice(2);console.log(slicedfruits2); // [ 'orange', 'grape', 'mango' ]// slicing from the second element to fourth elementlet slicedfruits3 = fruits.slice(1, 4);console.log(slicedfruits3); // [ 'banana', 'orange', 'grape' ]// slicing the array from start to second-to-lastlet slicedfruits4 = fruits.slice(0, -1);console.log(slicedfruits4); // [ 'apple', 'banana', 'orange', 'grape' ]// slicing the array from third-to-lastlet slicedfruits5 = fruits.slice(-3);console.log(slicedfruits5); // [ 'orange', 'grape', 'mango' ]登录后复制 8. 拼接splice() 方法修改数组(添加、删除或替换元素)。arr.splice(start, deletecount, item1, ..., itemn)? 返回包含已删除元素的数组。let animals = ["dog", "cat", "elephant", "lion"];// replacing "elephant" &amp; "lion" with "tiger" &amp; "giraffe"let removedanimals1 = animals.splice(2, 2, "tiger", "giraffe");console.log(removedanimals1); // [ 'elephant', 'lion' ]console.log(animals); // [ 'dog', 'cat', 'tiger', 'giraffe' ]// adding elements without deleting existing elementslet removedanimals2 = animals.splice(1, 0, "elephant", "lion");console.log(removedanimals2); // []console.log(animals); // [ 'dog', 'elephant', 'lion', 'cat', 'tiger', 'giraffe' ]// removing 3 elementslet removedanimals3 = animals.splice(2, 3);console.log(removedanimals3); // [ 'lion', 'cat', 'tiger' ]console.log(animals); // [ 'dog', 'elephant', 'giraffe' ]登录后复制 9. 每个every() 方法检查所有数组元素是否通过给定的测试函数。arr.every(callback(currentvalue), thisarg)every() 方法返回:true - 如果所有数组元素都通过给定的测试函数(回调返回真值)。false?- 如果任何数组元素未通过给定的测试函数。const nums1 = [ 1 , 2 , 3 , 4 , 5];// every()?method returns true if all the array // elements pass the given test function or else// returns falselet result1 = nums1.every(element =&gt; element element <h3> 10.<strong>一些</strong></h3><p>some() 方法测试是否有任何数组元素通过给定的测试函数。</p><p>arr.some(callback(currentvalue), thisarg)</p>登录后复制如果数组元素通过给定的测试函数,则返回 true(回调返回真值)。否则返回 falseconst nums1 = [ 8 , 2 , 7 , 9 , 6];// some()?method returns true if any of the array // elements pass the given test function or else // returns falselet result1 = nums1.some(element =&gt; element element <p>请继续关注我们系列的第 2 部分,我们将深入探讨更重要的 javascript 数组方法!快乐学习!</p> 登录后复制以上就是每个开发人员都应该掌握的 JavaScript 数组方法(第 1 部分)的详细内容,更多请关注我的其它相关文章!

标签:console,log,开发人员,age,JavaScript,element,returns,数组
From: https://www.cnblogs.com/aow054/p/18434407

相关文章

  • 深入 JavaScript 世界:掌握 OOP、虚拟 DOM 等
    踏上激动人心的旅程,探索广阔而动态的javascript世界!getvm提供的免费编程学习资源集合涵盖了广泛的主题,从复杂的面向对象编程(oop)到创建自定义虚拟dom实现。无论您是经验丰富的开发人员还是好奇的初学者,这些教程都将为您提供提升javascript能力的知识和技能。?理......
  • 构建 JavaScript 代码:可读性和可维护性的最佳实践
    欢迎回到我们的javascript世界之旅!在这篇博文中,我们将深入探讨构建javascript代码的基本方面。正确的代码结构对于可读性、可维护性和协作至关重要。我们将介绍代码结构、语句、分号和注释。让我们开始吧!代码结构结构良好的javascript代码库易于阅读、理解和维护。以......
  • 掌握 JavaScript 的数学对象:内置数学函数和属性的综合指南
    javascript数学对象:概述javascriptmath对象是一个内置对象,提供数学函数和常量的集合。它不是构造函数,因此您无法创建它的实例;相反,它是通过其静态方法和属性直接使用的。1.常数math对象包含几个对数学计算有用的常量:math.e:自然对数的底数,约等于2.718。math.ln2:2的自然对......
  • 掌握 JavaScript 运算符:从基础知识到按位
    在本博客中,我们将深入探讨javascript运算符的世界,涵盖从基本算术到按位运算的所有内容。我们将探讨“一元”、“二元”和“操作数”等术语,并提供实际示例来帮助您理解每个概念。让我们开始吧!基本运算符一元、二元和操作数一元运算符?作用于单个操作数(例如,x)。二元运算符?作......
  • 掌握 JavaScript:初学者的基本技巧
    JavaScript是一种多功能且功能强大的编程语言,构成了现代Web开发的支柱。如果您是JavaScript新手,这里有一些基本技巧可帮助您掌握其概念并开始构建交互式Web应用程序:1.了解基础知识:变量和数据类型:了解变量、它们的类型(数字、字符串、布尔值、对象、数组等)以及如何操......
  • 掌握 Lerna:管理 JavaScript Monorepos 的指南
    目录简介第一章:lerna是什么?为什么选择monorepos?第2章:安装和设置lerna先决条件分步安装指南设置您的第一个lerna项目第3章:lerna中的依赖关系管理独立依赖提升共享依赖项引导包第4章:跨包运行脚本全局执行脚本针对特定包第5章:使用lerna进行版本控制和发布固定模式与......
  • 手册和规范:掌握 JavaScript 指南
    欢迎回到我们的JavaScript世界之旅!在这篇博文中,我们将深入探讨有助于您理解和掌握JavaScript的基本手册和规范。无论您是初学者还是经验丰富的开发人员,这些资源都将作为您学习和故障排除的首选参考。让我们探索官方ECMAScript规范、MDNWeb文档和其他有用的资源。官......
  • 开发人员人工智能入门:揭秘基础知识部分
    开发者们大家好!人工智能不再只是一个梦想。它就在这里并改变我们构建软件的方式。它可以使应用程序更好、更有用。但如何开始在项目中使用人工智能呢?本系列旨在为您提供踏上人工智能开发之旅的基础知识。在第一部分中,我们将深入研究核心概念并提供使用langchain和openai的实践......
  • JavaScript 值比较 严格相等和严格不相等
    严格相等和严格不相等相等在进行比较时候,会发生类型转换,因此像比较0和false、空字符串和false时,会判定两者相等。但是严格相等和严格不相等,在比较时候不会发生类型转换。例子:lets1=0==false;lets2=''==false;lets3=0===false;lets4=''===false;lets5=1==true;let......
  • 信息学奥赛复赛复习04-CSP-J2019-04-加工零件-位运算、整数映射0或1、结构体、初始化
    PDF文档回复:20240926<12019CSP-J题目4加工零件[题目描述]凯凯的工厂正在有条不紊地生产一种神奇的零件,神奇的零件的生产过程自然也很神奇。工厂里有n位工人,工人们从1∼n编号。某些工人之间存在双向的零件传送带。保证每两名工人之间最多只存在一条传送带如果......