Array.prototype.map()的用法和手写

1.Array.prototype.map()的基本使用

Array.prototype.map() 是 JavaScript 中数组的原型方法之一,用于对数组中的每个元素执行指定的操作,并返回操作结果组成的新数组。它的基本语法如下:

javascript 复制代码
const newArray = array.map(callback(element,index,array) {
  // 返回新数组的元素
}, thisArg);

其中:

  • callback 是一个用于处理每个数组元素的函数,它可以接收三个参数:
    • element:当前正在处理的元素的值。
    • index(可选):当前正在处理的元素的索引。
    • array(可选):调用 map() 方法的数组本身。
  • thisArg 是可选参数,用于指定 callback 函数中的 this 值。
    map() 方法会按照数组元素顺序依次调用 callback 函数,并将每个元素的返回值组成一个新数组返回。原数组不会被修改。
    下面是一个简单的示例,说明了 map() 方法的用法:
javascript 复制代码
const numbers = [1, 2, 3, 4, 5];
// 使用 map() 方法将每个元素加倍
const doubledNumbers = numbers.map((num) => {
  return num * 2;
});
console.log(doubledNumbers); // 输出: [2, 4, 6, 8, 10]

在这个示例中,map() 方法对 numbers 数组中的每个元素都执行了一个函数,将每个元素的值加倍,并将结果存储在 doubledNumbers 数组中。
map() 方法常用于对数组中的元素进行转换、映射或处理,并生成一个新的数组,非常方便地实现了数据的转换和操作。

2.手写Array.prototype.map()代码

javascript 复制代码
Array.prototype._map=function(callback,thisArg){
            if(typeof callback!=="function"){
                throw Error('参数必须是函数')
            }
            const mapArray=[]
            const thisContext=thisArg||globalThis
            for(let i=0;i<this.length;i++){
                mapArray.push(callback.call(thisContext,this[i],i,this))
            }
            return mapArray;
        }
        const nums=[1,2,3,4,5]
        const mapNums=nums._map(num=> num*2)
        console.log(mapNums);
相关推荐
爱吃的强哥11 分钟前
vue3 使用 vite 管理多个项目,实现各子项目独立运行,独立打包
前端·javascript·vue.js
涵信19 分钟前
第十节:性能优化高频题-虚拟DOM与Diff算法优化
javascript·vue.js·性能优化
谈不譚网安20 分钟前
CSRF请求伪造
前端·网络安全·csrf
TT模板25 分钟前
苹果cmsV10主题 MXonePro二开优化修复开源版
前端·html5
拖孩26 分钟前
【Nova UI】十一、组件库中 Icon 组件的测试、使用与全局注册全攻略
前端·javascript·vue.js·ui·sass
去伪存真32 分钟前
不用动脑,手把手跟着我做,就能掌握Gitlab+Jenkins提交代码自动构部署
前端·jenkins
天天扭码1 小时前
深入解析 JavaScript 中的每一类函数:从语法到对比,全面掌握适用场景
前端·javascript·面试
小希爸爸1 小时前
4、中医基础入门和养生
前端·后端
kooboo china.2 小时前
Tailwind CSS 实战:基于 Kooboo 构建企业官网页面(一)
前端·css·编辑器
uhakadotcom2 小时前
Fluid:云原生数据加速与管理的简单入门与实战
前端