转载自:http://blog.csdn.net/freshlover/article/details/19034079

这涉及到是否深入理解两个函数的格式与参数含义。

首先根据我对两个函数用法的了解,猜测是由于parseInt(stringradix) 的参数radix(进制)必须介于2~36之间,而且字符串string中的每个位上的数字不能大于radix才能正确返回数字结果值。

我们通过以下javascript代码测试一下:

var a=["1", "2", "3", "4","5",6,7,8,9,10,11,12,13,14,15];
console.log(a.map(parseInt));

返回结果为:[1,NaN,NaN,NaN,NaN,NaN,NaN,NaN,NaN,9,11,13,15,17,19]

正好印证了以上的猜测是正确的,因为:

parseInt('1',0) = 1,
parseInt('2',1) = NaN,
parseInt('3',2) = NaN,
……
parseInt('9‘,8) = NaN,
parseInt('10',9) = 9,
parseInt('11',10) = 11,
parseInt('12',11) = 13,
parseInt('13',12) = 15,
parseInt('14',13) = 17,
parseInt('15',14) = 19

正是由于map的回调函数的参数index索引值作了parseInt的基数radix,导致出现超范围的radix赋值和不合法的进制解析,才会返回NaN。

也许你还会怀疑索引值和基数radix对应关系的准确性,这时你可以重新定义parseInt函数,再来测试一下

function parseInt(str, radix) {
return str+'-'+radix;
};
var a=["1", "2", "3", "4","5",6,7,8,9,10,11,12,13,14,15];
console.log(a.map(parseInt));

输出结果为:["1-0","2-1","3-2","4-3","5-4","6-5","7-6","8-7","9-8","10-9","11-10","12-11","13-12","14-13","15-14"]

通过此例,再次证明,索引index的起始值从0开始,与radix的对应如前陈述一致,所以才会出现返回NaN的类型值。

这个实例提醒我们在使用两个函数parseInt和map时候要格外小心。同时对于IE6-7不支持map函数的情况也要谨慎或者通过prototype扩展处理。

最后再仔细回顾温习一下:

parseInt() 函数

定义和用法

parseInt() 函数可解析一个字符串,并返回一个整数。

语法

parseInt(string, radix)
参数 描述
string 必需。要被解析的字符串。
radix

可选。表示要解析的数字的基数。该值介于 2 ~ 36 之间。

如果省略该参数或其值为 0,则数字将以 10 为基础来解析。如果它以 “0x” 或 “0X” 开头,将以 16 为基数。

如果该参数小于 2 或者大于 36,则 parseInt() 将返回 NaN。

返回值

返回解析后的数字。

说明

当参数 radix 的值为 0,或没有设置该参数时,parseInt() 会根据 string 来判断数字的基数。

举例,如果 string 以 "0x" 开头,parseInt() 会把 string 的其余部分解析为十六进制的整数。如果string 以 0 开头,那么 ECMAScript v3 允许 parseInt() 的一个实现把其后的字符解析为八进制或十六进制的数字。如果string 以 1 ~ 9 的数字开头,parseInt() 将把它解析为十进制的整数。

提示和注释

注释:只有字符串中的第一个数字会被返回。

注释:开头和结尾的空格是允许的。

提示:如果字符串的第一个字符不能被转换为数字,那么 parseFloat() 会返回 NaN。

实例

在本例中,我们将使用 parseInt() 来解析不同的字符串:

parseInt("10");			//返回 10
parseInt("19",10); //返回 19 (10+9)
parseInt("11",2); //返回 3 (2+1)
parseInt("17",8); //返回 15 (8+7)
parseInt("1f",16); //返回 31 (16+15)
parseInt("010"); //未定:返回 10 或 8

map 方法 (Array) (JavaScript)

对数组的每个元素调用定义的回调函数并返回包含结果的数组。

array1.map(callbackfn[, thisArg])

参数

参数

定义

array1

必需。 一个数组对象。

callbackfn

必需。 一个接受最多三个参数的函数。 对于数组中的每个元素,map 方法都会调用 callbackfn函数一次。

thisArg

可选。 可在 callbackfn 函数中为其引用this 关键字的对象。 如果省略thisArg,则 undefined 将用作this 值。

返回值

其中的每个元素均为关联的原始数组元素的回调函数返回值的新数组。

异常

如果 callbackfn 参数不是函数对象,则将引发 TypeError 异常。

备注

对于数组中的每个元素,map 方法都会调用 callbackfn 函数一次(采用升序索引顺序)。 不为数组中缺少的元素调用该回调函数。

除了数组对象之外,map 方法可由具有 length 属性且具有已按数字编制索引的属性名的任何对象使用。

回调函数语法

回调函数的语法如下所示:

function callbackfn(value, index, array1)

可使用最多三个参数来声明回调函数。

下表列出了回调函数参数。

回调参数

定义

value

数组元素的值。

index

数组元素的数字索引。

array1

包含该元素的数组对象。

 

["1", "2", "3"].map(parseInt) 为何返回[1,NaN,NaN]的更多相关文章

  1. 解惑 ["1", "2", "3"].map(parseInt) 为何返回[1,NaN,NaN]

    javascript中的parseInt与map函数都是常用的函数,可是 ["1", "2", "3"].map(parseInt) 为何返 ...

  2. 在 JavaScript 中 ["1","2","3"].map(parseInt) 为何返回不是 [1,2,3] 却是 [1,NaN,NaN]?

    这个问题我是希望有很多人可以一起交流的: 我在 http://blog.csdn.net/justjavac/article/details/19473199#t0 上看到了比较详细的解释, 但是具体 ...

  3. 为什么 ["1", "2", "3"].map(parseInt) 返回 [1,NaN,NaN]?

    在 javascript 中 ["1","2","3"].map(parseInt) ,2,3] 却是 [1,NaN,NaN]? 我们首先回 ...

  4. map.(parseInt)方法详解

    偶然间碰到这样一个问题: ["1","2", "3"].map(parseInt) //[ 1, NaN, NaN ] 运行结果 [ 1, ...

  5. JavaScript Array.map + parseInt

    map 生成新数组的函数,3个参数 1-currentValue, callback数组中正在处理的当前元素 2-index(可选): callback数组中正在处理的当前元素的索引 3-array( ...

  6. JavaScript map+parseInt 容易产生的误区

    map /** * 语法: * var new_array = arr.map(function callback(currentValue[,index[,array]]){ * // return ...

  7. ["1", "2", "3"].map(parseInt)`返回的结果是[1,2,3]?

    今天刷到一道面试题,["1", "2", "3"].map(parseInt)返回的结果是什么呢?可能大家第一个想到的是 [1,2,3],但 ...

  8. ['1','2','3'].map(parseInt) 返回的是什么?

    返回的是:[1,NaN,NaN] 首先我们先分析一下  parseInt  函数: parseInt()函数解析一个字符串参数,并返回指定基数的整数(数学系统中的基数). 它可以有两个参数,用法:pa ...

  9. ["1", "2", "3"].map(parseInt)?

    ["1", "2", "3"].map(parseInt)得到什么? 答案是:[1, NaN, NaN]. 原因:parseInt接收的是两 ...

随机推荐

  1. Linux下搭建hadoop开发环境-超详细

    先决条件:开发机器需要联网 已安装java 已安装Desktop组 1.上传安装软件到linux上: 2.安装maven,用于管理项目依赖包:以hadoop用户安装apache-maven-3.0.5 ...

  2. 图论——最小生成树prim+邻接表+堆优化

    今天学长对比了最小生成树最快速的求法不管是稠密图还是稀疏图,prim+邻接表+堆优化都能得到一个很不错的速度,所以参考学长的代码打出了下列代码,make_pair还不是很会,大体理解的意思是可以同时绑 ...

  3. 25个站长必备的SEO优化工具

    搜索引擎抓取内容模拟器 可以模拟蜘蛛抓取指定网页,包括Text.Link.Keywords及Description信息等.http://www.webconfs.com/search-engine-s ...

  4. sql server递归日期

    在做项目任务时,需要将一个日期范围转换为日期表. 例如:日期范围(2017年01月21日~2017年02月20日).转换成一日为单位的日期表,如下. 2017-01-21 2017-01-22 201 ...

  5. 前端 HTML标签介绍

    那什么是HTML标签呢? 1. 在HTML中规定标签使用英文的的尖括号即"<"和">"包起来,如`<html>`.`<p>` ...

  6. [py][mx]django分页第三方模块django-pure-pagination

    前台的这些数据都是从后台取来的 分页模块django-pure-pagination - 一款基于django pagination封装的更好用的分页模块 https://github.com/jam ...

  7. openstack 部署笔记--keystone

    控制节点 安装keystone包 # yum install openstack-keystone httpd mod_wsgi keystone配置文件 # vim /etc/keystone/ke ...

  8. 蒙特卡洛模拟(Monte Carlo simulation)

    1.蒙特卡罗模拟简介 蒙特卡罗模拟,也叫统计模拟,这个术语是二战时期美国物理学家Metropolis执行曼哈顿计划的过程中提出来的,其基本思想很早以前就被人们所发现和利用.早在17世纪,人们就知道用事 ...

  9. iOS下拉刷新和上拉刷新

    在iOS开发中,我们经常要用到下拉刷新和上拉刷新来加载新的数据,当前这也适合分页.iOS原生就带有该方法,下面就iOS自带的下拉刷新方法来简单操作. 上拉刷新 1.在TableView里,一打开软件, ...

  10. js五星好评

    一般我们在一些购物以及美食的网站都会看到五星好评之类的,一下是使用js制作的五星好评! <!DOCTYPE html> <html lang="en"> & ...