正文

map,必要解释就是map不是地图的意思,而是映射的意思。

这里就简单的介绍了这个map了。

array.map(callback,[ thisObject]);

看下这个案例后,我们发现了就发现了一个问题。

以前呢,我写道:map是一个过滤器,其实是将filter弄混了,当然我也介绍过filter。

那么什么是映射呢?

这个时候数学似乎显得非常重要了,来看下定义:

两个非空集合A与B间存在着对应关系f,而且对于A中的每一个元素x,B中总有有唯一的一个元素y与它对应,就这种对应为从A到B的映射,记作f:A→B。其中,b称为元素a在映射f下的象,记作:b=f(a)。a称为b关于映射f的原象。

集合A中所有元素的象的集合称为映射f的值域,记作f(A)。

映射,或者射影,在数学及相关的领域还用于定义函数。函数是从非空数集到非空数集的映射,而且只能是一对一映射或多对一映射。

ok,这下明白了吧。

在实际使用的时候,我们可以利用map方法方便获得对象数组中的特定属性值们。例如下面这个例子(之后的兼容demo也是该例子):

var users = [

{name: "张含韵", "email": "zhang@email.com"},

{name: "江一燕", "email": "jiang@email.com"},

{name: "李小璐", "email": "li@email.com"}

];

var emails = users.map(function (user) { return user.email; });

console.log(emails.join(", ")); // zhang@email.com, jiang@email.com, li@email.com

Array.prototype扩展可以让IE6-IE8浏览器也支持map方法:

if (typeof Array.prototype.map != "function") {
Array.prototype.map = function (fn, context) {
var arr = [];
if (typeof fn === "function") {
for (var k = 0, length = this.length; k < length; k++) {
arr.push(fn.call(context, this[k], k, this));
}
}
return arr;
};
}

js es6系列——map函数的更多相关文章

  1. js parseInt和map函数

    今天看了一个js的题目["1","2","3"].map(parseInt),看到后脑海中浮现的答案是[1,2,3],但是看到正确答案后蒙了 ...

  2. [js高手之路] es6系列教程 - 函数的默认参数详解

    在ES6之前,我们一般用短路表达式处理默认参数 function show( a, b ){ var a = a || 10; var b = b || 20; console.log( a, b ) ...

  3. js foreach、map函数

    语法:forEach和map都支持2个参数:一个是回调函数(item,index,input)和上下文: •forEach:用来遍历数组中的每一项:这个方法执行是没有返回值的,对原来数组也没有影响: ...

  4. underscore.js 分析6 map函数

    作用:通过转换函数(iteratee迭代器)映射列表中的每个值产生价值的新数组.iteratee传递三个参数:value,然后是迭代 index. _.map([1, 2, 3], function( ...

  5. jQuery——map()函数以及它的java实现

    map()函数小简单介绍 map()函数一直都是我觉得比較有用的函数之中的一个,为什么这么说呢? 先来考虑一下.你是否碰到过下面场景:须要遍历一组对象取出每一个对象的某个属性(比方id)而且用分隔符隔 ...

  6. [js高手之路] es6系列教程 - 迭代器,生成器,for...of,entries,values,keys等详解

    接着上文[js高手之路] es6系列教程 - 迭代器与生成器详解继续. 在es6中引入了一个新的循环结构for ....of, 主要是用来循环可迭代的对象,那么什么是可迭代的对象呢? 可迭代的对象一般 ...

  7. js ES6 Set和Map数据结构详解

    这篇文章主要介绍了ES6学习笔记之Set和Map数据结构,结合实例形式详细分析了ECMAScript中基本数据结构Set和Map的常用属性与方法的功能.用法及相关注意事项,需要的朋友可以参考下   本 ...

  8. [ES6系列-02]Arrow Function:Whats this?(箭头函数及它的this及其它)

    [原创] 码路工人 大家好,这里是码路工人有力量,我是码路工人,你们是力量. 如果没用过CSharp的lambda 表达式,也没有了解过ES6,那第一眼看到这样代码什么感觉? /* eg.0 * fu ...

  9. [js高手之路] es6系列教程 - 对象功能扩展详解

    第一:字面量对象的方法,支持缩写形式 //es6之前,这么写 var User = { name : 'ghostwu', showName : function(){ return this.nam ...

  10. JS组件系列——表格组件神器:bootstrap table 包含了js对象的定义和对象成员函数的定义

    前言:之前一直在忙着各种什么效果,殊不知最基础的Bootstrap Table用法都没有涉及,罪过,罪过.今天补起来吧.上午博主由零开始自己从头到尾使用了一遍Bootstrap Table ,遇到不少 ...

随机推荐

  1. 安装Typora+PicGo七牛云图床问题解决

    遇到两个问题 第一个安装PicGo软件打不开只在后台运行,卸载.重启都试过没用,按照默认安装路径到c盘才能打开软件. 第二个问题"设定存储区域"输入z0不行,需要输入cn-east ...

  2. Navicat 通过 Http通道 连接远程 Mysql

    https://jingyan.baidu.com/article/3d69c551aa54dff0cf02d7a0.html 注意本机ip填写 localhost

  3. MyEclipse之各个版本的区别

    跟Eclipse一样,MyEclipse的各个版本也是有区别的,他们所集成的插件是不同的. 从插件数量和功能的强大程度上讲:Blue>Professional>Standard MyEcl ...

  4. Tomcat异常之 Exception loading sessions from persistent storage解决方案

    启动项目时报以下异常 严重: Exception loading sessions from persistent storage java.io.EOFException 遇到上述异常,删除Tomc ...

  5. spring mvc 给action添加事务不成功的原因

    spring springMVC ation事务管理 自己单独做了个小网站 但是发现action事务不起作用了 但是如果用service层就没问题 找了很多办法没解决 最后自己解决了 其实就是一个加载 ...

  6. 模板函数中的const

    所有讨论都是底层const指针或引用,顶层const不会传递进模板. 模板中有const,不管传进来是否是const,T都是非const类型. template<typename T> v ...

  7. 三维模型OBJ格式轻量化顶点压缩主要技术方法分析

    三维模型OBJ格式轻量化顶点压缩主要技术方法分析 三维模型的OBJ格式轻量化中,顶点压缩是一项重要的技术方法,用于减小模型文件的大小.以下是关于三维模型OBJ格式轻量化顶点压缩的主要技术方法的分析: ...

  8. C++ Qt开发:QProcess进程管理模块

    Qt 是一个跨平台C++图形界面开发库,利用Qt可以快速开发跨平台窗体应用程序,在Qt中我们可以通过拖拽的方式将不同组件放到指定的位置,实现图形化开发极大的方便了开发效率,本章将重点介绍如何运用QPr ...

  9. 一秒变身艺术家!U2Net 跨界肖像画,让你的头像瞬间细节完美复刻,打造个性化头像新风潮!

    效果 测试图片来自网络,如有侵权,联系删除. 项目 关注微信公众号,回复关键字:"一秒变身艺术家",获取程序! 模型信息 Inputs ---------------------- ...

  10. 并发CPU伪共享及优化

    伪共享 缓存系统中是以缓存行(cache line)为单位存储的.缓存行是2的整数幂个连续字节,一般为32-256个字节.最常见的缓存行大小是64个字节.当多线程修改互相独立的变量时,如果这些变量共享 ...