JavaScript 数组 map() 方法

下面是Array map()方法的示例。

例子：

JavaScript

Javascript

// Check if the map function is supported by the browser or not
if(!Array.prototype.map){
    Array.prototype.map = function(callback){
     
        // create an empty array
        let newArr = [];
 
        // Iterate the value of this
        // Here the value of this is the array by
        // which you called the map function
         
        for(let item of this){
         
            // Apply the callback function at every iteration
            // and push it into the newArr array
             
            newArr.push(callback(item));
        }
         
        // return the newArr
        return newArr;
    }
}
 
let a = [ 1, 2, 3, 4, 5, 6]
 
a.map((item)=>{
    console.log(item)
})
 
// This code is contributed by _saurabh_jaiswal

输出：

3.7416573867739413,3.1622776601683795,
3.3166247903554,0

arr.map()方法创建一个新数组，其中包含每个数组元素的调用函数的结果。此函数按顺序为给定数组的每个元素调用一次参数函数。
句法：

array.map(callback(element, index, arr), thisArg)

参数：此方法接受上面提到的五个参数，如下所述：

callback：此参数保存要为数组的每个元素调用的函数。
element：参数保存当前正在处理的元素的值。
index：该参数是可选的，它保存从0开始的数组中currentValue元素的索引。
arr：此参数是可选的，它保存了调用 Array.every 的完整数组。
thisArg：此参数是可选的，它保存要作为 this 传递的上下文，以便在执行回调函数时使用。如果传递了上下文，它将在每次调用回调函数时都这样使用，否则使用 undefined 作为默认值。

返回值：此方法返回一个新数组，该数组是使用arg_function使用原始数组中的值修改的值创建的。此函数不会修改实现此函数的原始数组。
下面的示例说明了 JavaScript 中的arr.map()方法：

示例 1：在此示例中，方法map()生成一个数组，其中包含通过将原始数组中的数字除以 2 获得的数字。

var arr = [2, 56, 78, 34, 65];
var new_arr = arr.map(function(num) {
  return num / 2;
});
print(new_arr);

输出：

[1, 28, 39, 17, 32.5]

示例 2：在此示例中，方法map()生成一个数组，其中包含原始数组中数字的平方根。

var arr = [10, 64, 121, 23];
var new_arr = arr.map(Math.sqrt);
print(new_arr);

输出：

[3.1622776601683795, 8, 11, 4.795831523312719]

上述函数的代码如下：
方案一：

JavaScript

输出：

1, 28, 39, 17, 32.5

方案二：

JavaScript

输出：

3.1622776601683795, 8, 11, 4.795831523312719

支持的浏览器： JavaScript Array map()方法支持的浏览器如下：

谷歌浏览器 1 及更高版本
Microsoft Edge 12 及更高版本
Mozilla Firefox 1.5 及更高版本
Safari 3 及以上
Opera 9.5 及以上

填充物

Polyfills 是用来代替任何不支持旧浏览器的函数的代码。

假设一个旧浏览器没有与新的 ES 功能保持同步，那么您的代码将在该浏览器中中断。

在这里，我们正在创建一个 Array.prototype.map()函数的 polyfill。步骤如下。

脚步：

检查浏览器是否支持 map()函数。
现在创建一个函数表达式并将其分配给 Array.prototype.map 并且该函数接受一个参数。
创建一个空数组。
迭代this的值并使用for-of循环。（这里 this 的值是你调用 map函数的数组）
现在对每个迭代值使用回调函数并将其推送到该数组（您创建为空的）
返回数组。

执行：

Javascript

// Check if the map function is supported by the browser or not
if(!Array.prototype.map){
    Array.prototype.map = function(callback){
     
        // create an empty array
        let newArr = [];
 
        // Iterate the value of this
        // Here the value of this is the array by
        // which you called the map function
         
        for(let item of this){
         
            // Apply the callback function at every iteration
            // and push it into the newArr array
             
            newArr.push(callback(item));
        }
         
        // return the newArr
        return newArr;
    }
}
 
let a = [ 1, 2, 3, 4, 5, 6]
 
a.map((item)=>{
    console.log(item)
})
 
// This code is contributed by _saurabh_jaiswal

输出：