这篇文章主要介绍了如何在JavaScript中使用Map()方法,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。

地图()

该map()方法用于对数组中的每个元素应用一个函数,然后返回一个新数组。我们来看看语法:

letnewArray=array.map((v,i,a)=>{//returnelementtonewArray});//newArray-thenewarraythatisreturned//array-thearraytorunthemapfunctionon//v-thecurrentvaluebeingprocessed//i-thecurrentindexofthevaluebeingprocessed//a-theoriginalarray

map()方法可以被认为是 for 循环,即专门用于转换值。让我们看一下这个例子:

letnums=[11,12,13,14];letminus10=[];for(leti=0;i<nums.length;i++){minus10[i]=nums[i]-10;}

代码生成一个新数组,其中旧数组的每个值都减少 10。是的,它有效,但有一种更简单的方法可以实现相同的结果。

现在让我们使用该map()方法重写前面的函数。

letnums=[11,12,13,14];letminus10=nums.map(value=>value-10);//minus10=[1,2,3,4]

使用箭头函数,我们有一个漂亮而干净的函数来创建相同的数组。因为我们只使用值,所以我们只将它传递给map()方法。

在此示例中,我们将同时使用 value 和 index 参数:

letnums=[11,12,13,14];letnewArray=nums.map((v,i)=>{return{value:v,index:i};});//newArr=[//{value:11,index:0},//{value:12,index:1},//{value:13,index:2},//{value:14,index:3}//]

我想现在您会看到我们在map()方法中返回的任何内容都用于创建新数组。您可以使用当前值、当前索引甚至整个数组来确定要返回的内容。

你甚至可以在下面做这样的蠢事(*laugh emoji*),然后只返回一个静态字符串:

letnums=[11,12,13,14];letcats=nums.map(()=>'cats');//cats=[`cat`,`cat`,`cat`,`cat`]

到这里为止,所有的例子都转换了旧数组中的所有值。让我们看看一种转换数组中某些值的方法。

letnums=[11,12,13,14];leynewArr=nums.map(v=>v%2===0?v*2:v);//newArr=[11,24,13,28];

首先,我们检查值除以 2 的余数是否为零。如果余数为零,我们将返回 v * 2 或当前值的两倍。

感谢你能够认真阅读完这篇文章,希望小编分享的“如何在JavaScript中使用Map()方法”这篇文章对大家有帮助,同时也希望大家多多支持亿速云,关注亿速云行业资讯频道,更多相关知识等着你来学习!