如何在JavaScript中使用Map()方法

发布时间:2022-02-23 11:57:52 作者:小新
来源:亿速云 阅读:246

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

地图()

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

let newArray = array.map( (v, i, a) => {
    // return element to newArray
});
// newArray - the new array that is returned
// array - the array to run the map function on
// v - the current value being processed
// i - the current index of the value being processed
// a - the original array

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

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

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

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

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

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

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

let nums = [11, 12, 13, 14];
let newArray = 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*),然后只返回一个静态字符串: 

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

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

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

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

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

推荐阅读:
  1. 使用JavaScript读取所选文本并将其复制到剪贴板
  2. Syncfusion的新JavaScript条形码生成器控件

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

javascript map()

上一篇:bedtools如何批量提取基因组指定位置序列

下一篇:perl如何提取指定基因的fasta序列

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》