正文

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. RC4算法:流密码算法的经典之作

    一.RC4算法的起源与演变 RC4算法是由著名密码学家Ron Rivest在1987年设计的一种流密码算法,其名字来源于Rivest Cipher 4.RC4算法简单高效,被广泛应用于数据加密和网络安 ...

  2. nrm 安装报错 解决方案

    想用 npm login 发现用的淘宝镜像,一看安装个nrm,结果运行还报错了.你看看. 改下,登录完再改回来. https://blog.csdn.net/mynewdays/article/det ...

  3. 写了一个 dict.cn 的油猴脚本,目的是通过url进行搜索。这样就能配合wox进行单词的搜索了。

    写了一个 dict.cn 的油猴脚本,目的是通过url进行搜索.这样就能配合wox进行单词的搜索了. // ==UserScript== // @name dict.cn // @namespace ...

  4. k8s创建Pod的流程

    Kubernetes(k8s)中Pod的创建过程是一个涉及多个组件协作的复杂流程,下面将详细描述这个过程,确保内容的详尽性和深度. 一.用户提交创建请求 Pod的创建始于用户通过kubectl命令行工 ...

  5. vue入门教程之-属性、事件和双向绑定

    vue入门教程之-属性.事件和双向绑定 欢迎关注博主公众号「java大师」, 专注于分享Java领域干货文章, 关注回复「资源」, 免费领取全网最热的Java架构师学习PDF, 转载请注明出处 htt ...

  6. MacOS安装 JDK 及动态切换版本

    MacOS安装 JDK 及动态切换版本 JDK下载  我自己使用的是Mac m2系列.无所谓用的哪一种开源的OPEN JD,按需下载,我下载了8,11,17三个版本. 安装完成后,终端输入 java ...

  7. 任何样式,javascript都可以操作,让你所向披靡

    前言 习惯了在 css 文件里面编写样式,其实JavaScript 的 CSS对象模型也提供了强大的样式操作能力, 那就随文章一起看看,有多少能力是你不知道的吧. 样式来源 客从八方来, 样式呢, 样 ...

  8. C# URL参数编码

    string s = "lw123abc测试信息!@#¥%--&*()--+"; Console.WriteLine("原数据:\t\t" + s); ...

  9. TCL之基本语法1

    TCL之基本语法1 1:set  and puts set就是变量声明,这个声明在需要使用的指令下会自动执行,不会出现没有声明的错误.但是对于puts这类定向访问的是不能没有声明的.这里简单理解TCL ...

  10. RelationNet:学习目标间关系来增强特征以及去除NMS | CVPR 2018

    论文基于NLP的注意力机制提出了目标关系模块,通过与其它目标的比对增强当前目标的特征,而且还可以代替NMS进行端到端的重复结果去除,思想十分新颖,效果也不错   来源:晓飞的算法工程笔记 公众号 论文 ...