Javascript地图和它与Foreach的区别

让我们来看看数组方法map在Javascript中是如何工作的。

map方法是Javascript中最常用的函数之一。它用于接收数组，并返回一个新的数组，该数组可以通过一个附加的函数来改变。当你开始用Javascript开发时，你会看到map ，无处不在。让我们来看看它是如何工作的。

地图如何在Javascript中工作

map`()`是一个数组的方法。这意味着你只能对被打成数组的东西使用map 。例如，[ 1, 2, 3 ].map() 可以工作，但14.map() 就不行。

map() 方法本身接受一个函数。让我们看一个例子。

JavaScript

let arr = [ 1, 2, 3, 4 ];

let mappedArr = arr.map((item) => {
    return item * 3;
});

// Returns 3, 6, 9, 12
console.log(mappedArr);

map() 遍历数组中的每一项，并在其位置上返回你在 函数中修改的内容。上面，我们把数组中的每一个项目都乘以3。map()

我们将这个新的映射数组存储在一个叫做mappedArr 的变量中。值得注意的是，map() 并没有修改原来的数组。它只是创建并返回一个新的数组，我们可以选择将其存储在一个变量中。

你可以用任何你喜欢的方式来修改这个数组--包括添加字符串。无论你在map函数中返回什么，都会在新的数组中取代那个特定的项目。

JavaScript

let arr = [ 1, 2, 3, 4 ];

let mappedArr = arr.map((item) => {
    return 'Number: ' + arr;
});

// Returns "Number: 1", "Number: 2", "Number: 3", "Number: 4"
console.log(mappedArr);

地图函数中的参数

如上所示，我们可以在map() 上访问项目本身，但我们也可以访问与数组有关的其他有用的东西。

JavaScript

let arr = [ 1, 2, 3, 4 ];

let mappedArr = arr.map((item, index, array) => {
    return 'Number: ' + arr;
});

上面是与之前相同的函数，但显示了使用map()函数时可用的3个参数。

• item - this是当前被循环的数组项的值。
• index - 这是我们当前所处的数组的索引。因此，如果我们在数组的第二个元素上，索引将是1--因为它从0开始计数。
• array - 这是被调用的整个数组地图--如果我们需要的话，我们可以访问它。这给了我们很大的灵活性，我们可以使用 来操作一个数组。map()

Map和Foreach的区别

你可能会看到map和forEach被交替使用。这两者之间的区别是forEach在一个数组中循环，但最后并不返回数组。 而map()在使用时返回一个新的数组。

因此，如果你不想在函数的最后返回一个新的数组，你可能想使用forEach。

总结

map() 在Javascript中被广泛使用，因为数组是该语言中处理数据的一个主要部分。如果你有兴趣学习更多关于数组的知识，可以看看我在这里写的小抄

经Johnny Simpson, DZone MVB许可发表于DZone。点击这里查看原文