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() 方法的更多相关文章

  1. JS自带的map()方法

    1. map()方法返回一个由原数组的每个元素调用一个指定方法后返回值组成的新数组. 2. 例子: 2.1 在字符串中使用map 在一个String上使用map方法获取字符串中每个字符所对应的ASCI ...

  2. js中数组的map()方法

    map()方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值 map()方法按照原是数组顺序以此处理元素 注意:map()不会对空数组进行检测 :不会改变原始的数组 实例: var nu ...

  3. js中的forEach/map方法

    // forEach方法 var data = [{ name: "程咬金", sex: "1", age: 26 }, { name: "程才&qu ...

  4. js 自带的 sort() 方法

    1. 方法概述 Array的sort()方法默认把所有元素先转换为String再根据Unicode排序, sort()会改变原数组,并返回改变(排序)后的数组 . 2. 例子 2.1 如果没有提供自定 ...

  5. js 自带的 reduce() 方法

    1.方法说明 , Array的reduce()把一个函数作用在这个Array的[x1, x2, x3...]上,这个函数必须接收两个参数,reduce()把结果继续和序列的下一个元素做累积计算,其效果 ...

  6. JS的forEach和map方法的区别,还有一个$.each

    forEach()和map()两个方法都是ECMA5中Array引进的新方法,主要作用是对数组的每个元素执行一次提供的函数,但是它们之间还是有区别的.jQuery也有一个方法$.each(),长得和f ...

  7. JS的forEach和map方法的区别

    一.前言 forEach()和map()两个方法都是ECMA5中Array引进的新方法,主要作用是对数组的每个元素执行一次提供的函数,但是它们之间还是有区别的.jQuery也有一个方法$.each() ...

  8. js 自带的 filter()方法

    1. 方法概述 它用于把Array的某些元素过滤掉,然后返回剩下的元素组成的数组. 2. 例子 2.1 尝试用filter()筛选出素数: 'use strict'; function get_pri ...

  9. jQuery与JS中的map()方法使用

    1.jquery中的map()方法 首先看一个简单的实例: $("p").append( $("input").map(function(){ return $ ...

随机推荐

  1. php如何查看变量是真实被引用

    $var1 = 'Hello World'; $var2 = ''; $var2 =&$var1; debug_zval_dump(&$var1); $a = "aaa&qu ...

  2. Apache Spark技术实战之8:Standalone部署模式下的临时文件清理

    未经本人同意严禁转载,徽沪一郎. 概要 在Standalone部署模式下,Spark运行过程中会创建哪些临时性目录及文件,这些临时目录和文件又是在什么时候被清理,本文将就这些问题做深入细致的解答. 从 ...

  3. Full exploitation of a cluster hardware configuration requires some enhancements to a single-system operating system.

    COMPUTER ORGANIZATION AND ARCHITECTURE DESIGNING FOR PERFORMANCE NINTH EDITION Operating System Desi ...

  4. try{}、catch(){}、throw语句

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...

  5. Linux小技巧1:如何关闭Root用户SSH登陆

    新建用户 >useradd nonroot //新建用户 >passwd nonroot //创建/修改nonroot用户密码 >vim /etc/ssh/sshd_config 将 ...

  6. 正则表达式中的exec和match方法的区别

    正则表达式中的exec和match方法的区别 字符串的正则方法有:match().replace().search().split() 正则对象的方法有:exec().test() 1.match m ...

  7. Java线程:线程的同步-同步方法

    Java线程:线程的同步-同步方法   线程的同步是保证多线程安全访问竞争资源的一种手段. 线程的同步是Java多线程编程的难点,往往开发者搞不清楚什么是竞争资源.什么时候需要考虑同步,怎么同步等等问 ...

  8. Sql Server中暂停命令

    Sql Server中暂停几秒再执行后面的命令! -- 语法WAITFOR {    DELAY 'time_to_pass'   | TIME 'time_to_execute'   | [ ( r ...

  9. tomcat底层原理实现

    1.首先完成一个server类,用来接收客户端的请求:代码都在一个while(true)循环中,模拟tomcat一直在启动,其中绑定一个端口,用来监听一个端口,然后创建一个输入流,获取请求的输入流,然 ...

  10. LeetCode Logger Rate Limiter

    原题链接在这里:https://leetcode.com/problems/logger-rate-limiter/ 题目: Design a logger system that receive s ...