["1", "2", "3"].map(parseInt) 为何返回[1,NaN,NaN]
转载自:http://blog.csdn.net/freshlover/article/details/19034079
这涉及到是否深入理解两个函数的格式与参数含义。
首先根据我对两个函数用法的了解,猜测是由于parseInt(string, radix) 的参数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", "2", "3"].map(parseInt) 为何返回[1,NaN,NaN]
javascript中的parseInt与map函数都是常用的函数,可是 ["1", "2", "3"].map(parseInt) 为何返 ...
- 在 JavaScript 中 ["1","2","3"].map(parseInt) 为何返回不是 [1,2,3] 却是 [1,NaN,NaN]?
这个问题我是希望有很多人可以一起交流的: 我在 http://blog.csdn.net/justjavac/article/details/19473199#t0 上看到了比较详细的解释, 但是具体 ...
- 为什么 ["1", "2", "3"].map(parseInt) 返回 [1,NaN,NaN]?
在 javascript 中 ["1","2","3"].map(parseInt) ,2,3] 却是 [1,NaN,NaN]? 我们首先回 ...
- map.(parseInt)方法详解
偶然间碰到这样一个问题: ["1","2", "3"].map(parseInt) //[ 1, NaN, NaN ] 运行结果 [ 1, ...
- JavaScript Array.map + parseInt
map 生成新数组的函数,3个参数 1-currentValue, callback数组中正在处理的当前元素 2-index(可选): callback数组中正在处理的当前元素的索引 3-array( ...
- JavaScript map+parseInt 容易产生的误区
map /** * 语法: * var new_array = arr.map(function callback(currentValue[,index[,array]]){ * // return ...
- ["1", "2", "3"].map(parseInt)`返回的结果是[1,2,3]?
今天刷到一道面试题,["1", "2", "3"].map(parseInt)返回的结果是什么呢?可能大家第一个想到的是 [1,2,3],但 ...
- ['1','2','3'].map(parseInt) 返回的是什么?
返回的是:[1,NaN,NaN] 首先我们先分析一下 parseInt 函数: parseInt()函数解析一个字符串参数,并返回指定基数的整数(数学系统中的基数). 它可以有两个参数,用法:pa ...
- ["1", "2", "3"].map(parseInt)?
["1", "2", "3"].map(parseInt)得到什么? 答案是:[1, NaN, NaN]. 原因:parseInt接收的是两 ...
随机推荐
- 单机闭环 使用Nginx+Lua开发高性能Web应用
[西域骆驼D1532101213]西域骆驼(VANCAMEL)D1532101213 休闲套脚鞋 卡其43[行情 报价 价格 评测]-京东 http://item.jd.com/1856564.htm ...
- 为什么使用 Redis及其产品定位(转)
原文:http://www.infoq.com/cn/articles/tq-why-choose-redis 传统MySQL+ Memcached架构遇到的问题 实际MySQL是适合进行海量数据存储 ...
- js_加入收藏夹功能
<script type="text/javascript">function addToFavorite(obj) { var url = "http ...
- SqlAlchemy个人学习笔记完整汇总-转载
使用 sqlalchemy 有3种方式: 方式1, 使用raw sql; 方式2, 使用SqlAlchemy的sql expression; 方式3, 使用ORM. 前两种方式可以统称为 core ...
- eclipse向svn提交代码的时候忽略部分资源配置
eclipse向svn提交代码的时候有 .settings, .project, .classpath, target等不需要上传,所以在eclipse中配置一下就不会显示了,方法如下图:
- HTML <input> 标签的 name 属性
定义和用法 name 属性规定 input 元素的名称. name 属性用于对提交到服务器后的表单数据进行标识,或者在客户端通过 JavaScript 引用表单数据. 注释:只有设置了 name 属性 ...
- Java-二分查找算法
package com.lym.binarySearch; import java.util.Arrays; /** * 二分查找 * * @author Administrator * */ pub ...
- BCB 串口控件的使用 TComm
昨天工作用到了串口通信,MMP的,昨天懵逼了一下午,今天终于整通了,身为菜鸟,大师们是不懂这些心痛的. 进入主题:使用BCB提供的控件TComm编程方便且简单,TComm位于System分类里面. ...
- JavaScript循环练习2
折纸:折多少次和珠穆朗玛峰一样高1.一张纸的厚度是0.0001米,将纸对折,对折多少次厚度超过珠峰高度8848米 var hou = 0.0001; var cishu = 0; for(var i= ...
- Perl的子程序(二)
在Perl中可以自己创建子程序(Subroutine): 关键字sub,子程序名以及用花括号封闭起来的代码块. sub marine { ... } 子程序名与标量的命名空间是不同的两个部分. 子程 ...