概述
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. 2018-11-01-weekly

    Algorithm 107. 二叉树的层次遍历 II What 给定一个二叉树,返回其节点值自底向上的层次遍历. (即按从叶子节点所在层到根节点所在的层,逐层从左向右遍历).例如:给定二叉树 [3,9 ...

  2. dsu on tree 学习笔记

    这是一个黑科技,考虑树链剖分后,每个点只会在轻重链之间转化\(log\)次. 考虑暴力是怎么写的,每次枚举一个点,再暴力把子树全部扫一边. \(dsu\ on\ tree.\)的思想就是保留重儿子不清 ...

  3. 2020年的ARM处理器将超越英特尔

    2020年ARM真的会超越英特尔成为世界芯片霸主吗?迄今为止,基于ARM的笔记本电脑一直很流行,但在一两年内你可能会对它们产生不同的印象.该公司对其未来的处理器架构的性能预期提供了一个罕见的看法,这些 ...

  4. 两个list 合并后去除掉重复removeAll()的,然后再随机获取最后list中的 几个值

    public static void test1(){ String s1="1,2,5,3,6,9"; String n1[]=s1.split(","); ...

  5. Primary Key Increase by Trigger

    Oracle Create Table: CREATE TABLE TAB( ID NUMBER(10) NOT NULL PRIMARY KEY, NAME VARCHAR(19) NOT NULL ...

  6. POJ 2391--Ombrophobic Bovines(最大流(拆点)+二分+最短路)

    Ombrophobic Bovines Description FJ's cows really hate getting wet so much that the mere thought of g ...

  7. 基于MyBatis实现Dao理论

    基于MyBatis实现Dao理论 推荐使用xml提供sql 实现接口推荐使用Mapper自动实现DAO接口,让我们更关注sql书写本身

  8. vue组件传值之父传子

    1.父组件给子组件传值  home父组件  header子组件  关键字props home代码 <template> <div> <v-header :title=&q ...

  9. Dpr ppi 适配 等概念 弹性属性的讲解

    Dpr: Dpr的全称(Device pixel ratio)像素设备比例:就是说每个设备像素上占有的css位像素的个数 苹果手机常见的设备像素比:1.0安卓 iPhone2.0  3.0 如果是1. ...

  10. Java多线程,实现卖电影票的业务

    本篇重点:多线程共享资源时发生的互斥问题 一般的我们售卖电影票或者火车票时会有多个窗口同时买票, 我们来看测试代码:主方法new一个Ticket(一个堆),之后三个线程来启动(三个窗口买票) clas ...