当前位置:首页 > JavaScript

js实现map接收参数

2026-01-31 03:26:16JavaScript

map 方法的基本语法

在 JavaScript 中,Array.prototype.map 是一个高阶函数,用于遍历数组并对每个元素执行回调函数,最终返回一个新数组。其基本语法如下:

js实现map接收参数

const newArray = array.map(callback(currentValue[, index[, array]])[, thisArg])

参数说明

  1. callback

    • 必需参数,是一个函数,用于处理数组的每个元素。
    • 接收三个参数:
      • currentValue:当前正在处理的元素。
      • index(可选):当前元素的索引。
      • array(可选):调用 map 的原始数组。
  2. thisArg(可选)

    • 用于指定 callback 函数中 this 的值。

示例代码

基本用法

const numbers = [1, 2, 3];
const doubled = numbers.map((num) => num * 2);
console.log(doubled); // [2, 4, 6]

使用索引参数

const numbers = [1, 2, 3];
const withIndex = numbers.map((num, index) => `${index}: ${num}`);
console.log(withIndex); // ["0: 1", "1: 2", "2: 3"]

使用 thisArg

const obj = { multiplier: 10 };
const numbers = [1, 2, 3];
const multiplied = numbers.map(function(num) {
  return num * this.multiplier;
}, obj);
console.log(multiplied); // [10, 20, 30]

注意事项

  • map 不会修改原数组,而是返回一个新数组。
  • 如果未提供 thisArgcallback 中的 this 默认为 undefined(严格模式下)。
  • map 会跳过空位(稀疏数组),但不会跳过 undefinednull 值。

js实现map接收参数

标签: 参数js
分享给朋友:

相关文章

js实现vue

js实现vue

Vue.js 简介 Vue.js 是一个渐进式 JavaScript 框架,用于构建用户界面。其核心库专注于视图层,易于与其他库或现有项目整合。 实现 Vue.js 的基本步骤 安装 Vue.j…

js实现跳转

js实现跳转

使用 window.location 跳转 通过修改 window.location.href 实现页面跳转,这是最常用的方法。 window.location.href = 'https://…

js实现计算器

js实现计算器

实现基础计算器功能 使用JavaScript创建一个基础计算器需要处理数字输入、运算符逻辑和结果显示。以下是一个简单的实现示例: let currentInput = '0'; let previo…

js实现继承

js实现继承

原型链继承 通过将子类的原型指向父类的实例实现继承。子类实例可以访问父类原型上的属性和方法。 function Parent() { this.name = 'parent'; } Parent…

js实现日历

js实现日历

实现日历的基本思路 使用JavaScript实现日历的核心是动态生成日期表格,并处理月份切换逻辑。需要计算当前月的天数、起始星期几,并动态渲染到页面上。 获取当前日期信息 通过Date对象获取当前年…

js实现图片预览

js实现图片预览

使用FileReader API实现图片预览 通过FileReader对象读取用户选择的图片文件并显示预览: const input = document.getElementById('imag…