js 自带的 map() 方法全面了解

1. 方法概述

map() 方法返回一个由原数组中的每个元素调用一个指定方法后的返回值组成的新数组。

2. 例子

2.1 在字符串中使用map

在一个 String  上使用 map 方法获取字符串中每个字符所对应的 ASCII 码组成的数组:

var map = Array.prototype.map
var a = map.call("Hello World", function(x) { return x.charCodeAt(0); })
// a的值为[72, 101, 108, 108, 111, 32, 87, 111, 114, 108, 100]

2.2 易犯错误

通常情况下,map 方法中的 callback 函数只需要接受一个参数(很多时候,自定义的函数形参只有一个),就是正在被遍历的数组元素本身。

但这并不意味着 map 只给 callback 传了一个参数(会传递3个参数)。这个思维惯性可能会让我们犯一个很容易犯的错误。

// 下面的语句返回什么呢:
["1", "2", "3"].map(parseInt);
// 你可能觉的会是[1, 2, 3]
// 但实际的结果是 [1, NaN, NaN]

// 通常使用parseInt时,只需要传递一个参数.但实际上,parseInt可以有两个参数.第二个参数是进制数.可以通过语句"alert(parseInt.length)===2"来验证.
// map方法在调用callback函数时,会给它传递三个参数:当前正在遍历的元素, 元素索引, 原数组本身.
// 第三个参数parseInt会忽视, 但第二个参数不会,也就是说,parseInt把传过来的索引值当成进制数来使用.从而返回了NaN.

/*
//应该使用如下的用户函数returnInt

function returnInt(element){
 return parseInt(element,10);
}

["1", "2", "3"].map(returnInt);
// 返回[1,2,3]
*/

参考 : https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/map

以上这篇js 自带的 map() 方法全面了解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。

时间: 2016-08-13

jQuery遍历json中多个map的方法

本文实例讲述了jQuery遍历json中多个map的方法.分享给大家供大家参考.具体实现方法如下: jQuery.each(data.root,function(key,value){ for(var i = 0 ; i < value.length; i++ ){ var tmpArr = []; var obj = value[i]; //tmpArr.push(obj["collectDate"]); tmpArr.push(3*i); tmpArr.push(obj[&q

在JavaScript中操作数组之map()方法的使用

JavaScript 数组map()方法创建一个新的数组使用调用此数组中的每个元素上所提供的函数的结果. 语法 array.map(callback[, thisObject]); 下面是参数的详细信息: callback : 从当前的元素函数产生新的数组的元素. thisObject : 对象作为该执行回调时使用 返回值: 返回创建数组 兼容性: 这种方法是一个JavaScript扩展到ECMA-262标准;因此它可能不存在在标准的其他实现.为了使它工作,你需要添加下面的脚本代码在顶部: if

js中遍历Map对象的方法

js中遍历Map对象的方法 console.log(jsonData);//火狐控制台打印输出: Object { fileNumber="文件编号", fileName="文件名称"} for(var key in jsonData) console.log("属性:" + key + ",值:"+ jsonData[key]); } 打印输出: 属性:fileNumber, 值:文件编号 属性:fileName, 值:文件

JavaScript中循环遍历Array与Map的方法小结

js循环数组各种方法 eg1: for (var i = 0; i < myStringArray.length; i++) { alert(myStringArray[i]); //Do something } eg2: Array.prototype.foo = "foo!"; var array = ['a', 'b', 'c']; for (var i in array) { alert(array[i]); } for(var i in this.$GLOBAL_DET

JS模拟的Map类实现方法

本文实例讲述了JS模拟的Map类.分享给大家供大家参考,具体如下: 根据java中map的属性,实现key----value保存 1.使用数组方式存储数据,(使用闭包) function Map() { var struct = function (key, value) { this.key = key; this.value = value; } var put = function (key, value) { for (var i = 0; i < this.arr.length; i+

JavaScript中利用Array和Object实现Map的方法

本文实例讲述了JavaScript中利用Array和Object实现Map的方法.分享给大家供大家参考.具体如下: 昨天突然看到以前别人用JavaScript实现的Map感觉很不错,但是发现有个别方法有问题,顺便完善了下,添加了 remove .indexOf .values.clear等方法. /** * @author blune68 * @version 0.1, 07/27/12 * */ function Map(){ this.keys = new Array(); this.dat

js中生成map对象的方法

复制代码 代码如下: var Map = function(){ this._entrys = new Array(); this.put = function(key, value){ if (key == null || key == undefined) { return; } var index = this._getIndex(key); if (index == -1) { var entry = new Object(); entry.key = key; entry.value

js实现的map方法示例代码

复制代码 代码如下: /** * * 描述:js实现的map方法 * @returns {Map} */ function Map(){ var struct = function(key, value) { this.key = key; this.value = value; }; // 添加map键值对 var put = function(key, value){ for (var i = 0; i < this.arr.length; i++) { if ( this.arr[i].k

使用D3.js创建物流地图的示例代码

本文介绍了使用D3.js创建物流地图的示例代码,分享给大家,具体如下: 示例图 制作思路 需要绘制一张中国地图,做为背景. 需要主要城市的经纬坐标,以绘制路张起点和终点. 接收到物流单的城市,绘制一个闪烁的标记. 已经有过物流单的目标城市,不再绘制路线. 每次新产生一笔物流单,都有一个标记沿路线移向目标的动画效果. 绘制结束后的数据,需要清理掉,以减少对浏览器的资源占用. 开始撸码 1.创建网页模板 加载D3JS,为了方便调试,直接下载d3.js文件在本地,实际使用的时候,可以换成加载路径.注意

JS forEach和map方法的用法与区别分析

本文实例讲述了JS forEach和map方法的用法与区别.分享给大家供大家参考,具体如下: 一.前言 forEach()和map()两个方法都是ECMA5中Array引进的新方法,主要作用是对数组的每个元素执行一次提供的函数,但是它们之间还是有区别的.jQuery也有一个方法$.each(),长得和forEach()有点像,功能也类似.但是从本质上还是有很大的区别的,那么我们探探究竟. 二.forEach和map语法 2.1.语法: //forEach array.forEach(callba

Oracle查看表结构的几种方法示例代码

1,DESCRIBE 命令 使用方法如下: SQL> describe nchar_tst(nchar_tst为表名) 显示的结果如下: 名称 是否为空? 类型 ----------------------------------------- -------- ---------------------------- NAME NCHAR(6) ADDR NVARCHAR2(16) SAL NUMBER(9,2) 2,DBMS_METADATA.GET_DDL包 使用方法如下: SQL> S

JS实现按钮添加背景音乐示例代码

1-代码 <html> <head> <meta charset="utf-8"> <title>js实现按键声</title> </head> <body> <ul> <li> <a href="menu-list" rel="external nofollow" rel="external nofollow"

Android中js和原生交互的示例代码

本文介绍了Android中js和原生交互的示例代码,分享给大家,具体如下: 加载webview的类 public class MainActivity extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); JavaScriptInterf

Java 添加Word目录的2种方法示例代码详解

目录是一种能够快速.有效地帮助读者了解文档或书籍主要内容的方式.在Word中,插入目录首先需要设置相应段落的大纲级别,根据大纲级别来生成目录表.本文中生成目录分2种情况来进行: 1.文档没有设置大纲级别,生成目录前需要手动设置 2.文档已设置大纲级别,通过域代码生成目录 使用工具: •Free Spire.Doc for Java 2.0.0 (免费版) •IntelliJ IDEA 工具获取途径1:通过官网下载jar文件包,解压并导入jar文件到IDEA程序. 工具获取途径2:通过Maven仓

pytorch 可视化feature map的示例代码

之前做的一些项目中涉及到feature map 可视化的问题,一个层中feature map的数量往往就是当前层out_channels的值,我们可以通过以下代码可视化自己网络中某层的feature map,个人感觉可视化feature map对调参还是很有用的. 不多说了,直接看代码: import torch from torch.autograd import Variable import torch.nn as nn import pickle from sys import path

node.js遍历目录的方法示例

本文介绍了node.js遍历目录的方法示例,分享给大家,也给自己留个笔记,具体如下 同步遍历 const fs = require('fs'); const path=require('path'); function travel(dir,callback){ fs.readdirSync(dir).forEach((file)=>{ var pathname=path.join(dir,file) if(fs.statSync(pathname).isDirectory()){ travel

JS实现的自定义map方法示例

本文实例讲述了JS实现的自定义map方法.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>www.jb51.net JS自定义map方法</title> </head> <body> <script> window.onload = f