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

转载自: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


包含该元素的数组对象。

原文地址:https://www.cnblogs.com/wuguanglin/p/mapAndParseInt.html

时间: 2024-10-10 04:23:55

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

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

javascript中的parseInt与map函数都是常用的函数,可是 ["1", "2", "3"].map(parseInt) 为何返回不是[1,2,3]却是[1,NaN,NaN]? 这涉及到是否深入理解两个函数的格式与参数含义. 首先根据我对两个函数用法的了解,猜测是由于parseInt(string, radix) 的参数radix必须介于2~36之间,而且字符串string中的数字不能大于radix才能正确返回数字结果值. 我们通过以

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

返回的是:[1,NaN,NaN] 首先我们先分析一下  parseInt  函数: parseInt()函数解析一个字符串参数,并返回指定基数的整数(数学系统中的基数). 它可以有两个参数,用法:parseInt(string, radix) string:要解析的值.如果其不是字符串,则将其转换为字符串(使用toString抽象操作).字符串开头的空白符将会被忽略. radix:可选.表示要解析的数字的基数.该值介于 2 ~ 36 之间,默认为10 返回值:返回解析后的整数值. 如果被解析参数

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

["1", "2", "3"].map(parseInt)得到什么? 答案是:[1, NaN, NaN]. 原因:parseInt接收的是两个参数,map传递的是3个参数. map函数定义: arr.map(callback[,thisArg]); callback函数需要以下3个值: currentValue:当前处理数值 index:处理的数值的索引值 array:map函数处理的函数值 thisArg可选.  callback函数里的thi

["1", "2", "3"].map(parseInt) 答案是多少?

让我们先看看最直接最粗暴的方式 没错,答案就是:[1, NaN, NaN],那为什么答案是[1, NaN, NaN]呢? 1.让我们先了解一下map函数的定义 JavaScript Array map() 方法 定义和用法 map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值. map() 方法按照原始数组元素顺序依次处理元素. 注意: map() 不会对空数组进行检测. 注意: map() 不会改变原始数组. 因为 parseInt 需要两个参数 (val, radix

["1", "2", "3"].map(parseInt) 结果

// 下面的语句返回什么呢: ["1", "2", "3"].map(parseInt); // 你可能觉的会是[1, 2, 3] // 但实际的结果是 [1, NaN, NaN] // 通常使用parseInt时,只需要传递一个参数. // 但实际上,parseInt可以有两个参数.第二个参数是进制数. // 可以通过语句"alert(parseInt.length)===2"来验证. // map方法在调用callback

由["1", "2", "3"].map(parseInt) 引发的问题

基础知识 map语法 map(callback, [thisArg]) map 参数 callback 生成新数组元素的函数,callback参数,使用三个参数 currentValue callback 数组中正在处理的当前元素 index [可选] callback 数组中正在处理的当前元素的索引 array [可选] callback  map 方法被调用的数组 thisArg [可选] 执行 callback 函数时使用的this 值 返回值 一个新数组,每个元素都是回调函数的结果 pa

['1', '2', '3'].map(parseInt) 输出答案和解析

根据题目可以了解到这道题主要考我们的是对map函数和parseInt函数的熟悉程序,所以我们先来了解这两个函数 map 根据MDN上对于map的解释:map() 方法创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果. 上面的话读起来可能比较晦涩,我个人理解其实就是遍历数组,对数组的每一项进行遍历并做数据处理.这道题的关注重点就是在于map对于数组处理的方法,所以我们着重看下在MDN对于map参数的解释: callback 生成新数组的元素的函数,使用三个参数: curr

关于面试题:[1, 2, 3].map(parseInt)问题的剖析

一.前言 最近有小伙伴在公号中咨询了胡哥这道面试题,窃以为是比较有意思的一道面试题,于此分享给各位小伙伴.先把答案给了各位,和你理解的一样吗?! [1, 2, 3].map(parseInt) // [1, NaN, NaN] 如果你答案你都明白,请出门左转:React源码/原理了解一下. 二.剖析 这道面试题,本身并不复杂.不能正确回答问题的小伙伴,大多数集中于对parseInt这个函数的不了解或者了解的不全面,下面就由胡哥为大家抽丝剥茧一一讲述. 1. map函数 map()方法创建一个新数

parseInt在IE8转换返回不相等(parseInt("08")返回0等以0开头大于7的数字串)

描述 在IE8内核下parseInt("08")返回0,等以0开头大于7的数字串返回的值不相等 解决方法 parseInt当不指定radix时,当以0x开头时,s按照十六进制计算的:如果以0开头且第二位不为x,则s是按照八进制计算的,因为八进制不能有8,9所以报错返回0. 测试有效效果 parseInt("08",10)==8