概述
Array.map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值,同时不会改变原来的数组。

用法

Array.map(callback);

示例

//简单数组
const arr = [1, 3, 4, 5, 6, 7, 8, 10]; const cube = (num) => {
return num * num;
} const res = arr.map(cube);//[ 1, 9, 16, 25, 36, 49, 64, 100 ] // or const res = arr.map((num)=>{
return num * num;
})
//[ 1, 9, 16, 25, 36, 49, 64, 100 ] //对象数组和构造器
const OjbArray = [{
name: 'a',
age: 18,
isLikeEat: true,
isLikeSleep: true
}, {
name: 'b',
age: 19,
isLikeEat: true,
isLikeSleep: true
}, {
name: 'c',
age: 22,
isLikeEat: true,
isLikeSleep: true
}]; const Person = (target) => {
return {
name: target.name || 'default',
age: target.age || 18,
_eat: function() {
console.log(target.isLikeEat ? 'i like eat' : 'i dont like eat');
},
_sleep: function() {
console.log(target.isLikeSleep ? 'i like sleep' : 'i dont like sleep')
}
}
} let newPersons = OjbArray.map(Person);
console.log((newPerso// [ { name: 'a// age: 18, // _eat: [Function: _eat],
// _sleep: [Function: _sleep] },
// { name: 'b',
// age: 19,
// _eat: [Function: _eat],
// _sleep: [Function: _sleep] },
// { name: 'c',
// age: 22,
// _eat: [Function: _eat],
// _sleep: [Function: _sleep] } ]

注意 ⚠️

当和parseInt()函数配合使用 将字符转成数字的时候,可直接

['1', '2'].map(str => parseInt(str));
//or
['1', '2'].map(Number)

本质上是用元素作为函数参数去调用函数,所以无需加上参数

//这种写法是错误的
const arr = [1, 3, 4, 5, 6, 7, 8, 10]; const cube = (num) => {
return num * num;
} const res = arr.map(cube(num))

原文链接:https://blog.csdn.net/ruffaim/article/details/82260280

JavaScript中的map()函数的更多相关文章

  1. 由实现JavaScript中的Map想到的

    项目中要用到JavaScript中的Map数据类型,它不像JDK那样有自带的,怎么办?搜了找到一个不错的(http://darkmasky.iteye.com/blog/454749).用这个可以满足 ...

  2. 借助JavaScript中的时间函数改变Html中Table边框的颜色

    借助JavaScript中的时间函数改变Html中Table边框的颜色 <html> <head> <meta http-equiv="Content-Type ...

  3. 前端学习 第二弹: JavaScript中的一些函数与对象(1)

    前端学习 第二弹: JavaScript中的一些函数与对象(1) 1.apply与call函数 每个函数都包含两个非继承而来的方法:apply()和call(). 他们的用途相同,都是在特定的作用域中 ...

  4. 理解和使用 JavaScript 中的回调函数

    理解和使用 JavaScript 中的回调函数 标签: 回调函数指针js 2014-11-25 01:20 11506人阅读 评论(4) 收藏 举报  分类: JavaScript(4)    目录( ...

  5. JavaScript中变量和函数声明的提升

    现象: 1.在JavaScript中变量和函数的声明会提升到最顶部执行. 2.函数的提升高于变量的提升. 3.函数内部如果用var声明了相同名称的外部变量,函数将不再向上寻找. 4.匿名函数不会提升. ...

  6. perl编程中的map函数示例

    转自:http://www.jbxue.com/article/14854.html 发布:脚本学堂/Perl  编辑:JB01   2013-12-20 10:20:01  [大 中 小] 本文介绍 ...

  7. javascript中使用md5函数

    javascript中使用md5函数 这对于js来讲本来是没有的,现在可以自己定义一个md5的函数,达到加密效果. var hexcase = 0; function hex_md5(a) { if ...

  8. Python中的map()函数和reduce()函数的用法

    Python中的map()函数和reduce()函数的用法 这篇文章主要介绍了Python中的map()函数和reduce()函数的用法,代码基于Python2.x版本,需要的朋友可以参考下   Py ...

  9. 在 JavaScript 中使用构造器函数模拟类

    今天,我们要讲的是在 JavaScript 中使用构造器函数(construcor function)模拟类. 构造器函数简介 你可以使用 ES6 的 class 关键字来实现类,不过我建议你使用传统 ...

随机推荐

  1. 为什么需要bootloader

    本文链接:https://blog.csdn.net/u012351051/article/details/50557899 受单片机和ARM7等小型CPU设备编程思维的影响,开始对嵌入式linux和 ...

  2. AIX系统软件安装问题

    一.安装软件时一定要cd到介质目录中 二.选择accept new licence 三.更新系统时避免使用updata_all,要手动选择出要更新的软件 四.oracle11G的rac还要用到open ...

  3. VS TODO注释快捷键

    快速按出任务列表 todo 注释 Ctrl 键+ \| 键+ T键

  4. Apache HttpClient之fluent API的使用

    该方法为Apache HttpClient 4.5以上的版本支持,在官网有明确的说明. 对比以前的方式,其优点是代码更简洁,同时为线程安全的.仅举一个最简单的post栗子 JAR包信息: <de ...

  5. elememt-ui 的 el-icon-iconName 图标 显示问题!

    今天想在按钮处添加一个图标,但是显示不出.自己找了半天,终于找到了,希望帮到大家! 1,首先是没有报错的,但是有警告⚠ 意思是说什么拦截了之类的问题,但是到底是哪里问题导致拦截了呢?找了好久,原来是我 ...

  6. 关于DNS

    一.什么是DNS DNS 是域名系统 (Domain Name System) 的缩写,它是由解析器和域名服务器组成的.域名服务器是指保存有该网络中所有主机的域名和对应IP地址,并具有将域名转换为IP ...

  7. TreeView拖动并存入数据库(可判断拖动)

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...

  8. 奖项-MVP:MVP(微软最有价值专家)百科

    ylbtech-奖项-MVP:MVP(微软最有价值专家)百科 微软最有价值专家(MVP) 是指具备一种或多种微软技术专业知识,并且积极参与在线或离线的社群活动,经常与其他专业人士分享知识和专业技能,受 ...

  9. php中数组的指针

    利用PHP内置的函数 key() 获得键. current()获得值, next(); prev();移动到上一个 reset();//重置,移动到第一个元素 end();//移动到最后一个元素上 注 ...

  10. 测开之路七十七:shell之if、case、for、while

    选择语句(if语句) 大于:-gt判断目录是否存在:-d if [ 判断条件 ]; then statement1 Statement2elif [ 判断条件 ]; then statement1 S ...