[1, 2, 3] Analysis .map (parseInt) Problem: face questions about

I. Introduction

Recently, small partners consulted Hu brother this road face questions in public in the number, I humbly believe is a more interesting one face questions, here to give you a small share partners. The first answer to you, and you understand the same? !

[1, 2, 3].map(parseInt) // [1, NaN, NaN]

If you understand the answer you are, please go left: React source / principles to find out.

Second, analysis

This pavement questions, in itself not complicated. Not answer the question correctly junior partner, the majority concentrated in parseInt do not understand this function is not fully understood or, following on from Hu brother for everyone unraveling recount.

1. map function

map () method creates a new array, the result is returned after the results of the array, where each element calls a function provided.

grammar

let newArray = arr.map(function calback(currentValue[, index[, array]]) {
    // Return element for newArray
}[, thisArg])

callback callback function

parameter name	meaning	Optional
currentValue	callback array being processed in the current element	required
index	Calback index of the current element in the array being processed	Optional
array	map method called array	Optional

thisArg

thisArg, optional parameter, is used as a support for this time when the callback function

[1, 2, 3].map((v) => {
    return v * v
})
// [1, 4, 9]

2. parseInt function

parseInt (string, radix) the string into a string of binary integer radix, radix is a number between 2-36. Return Value: returns the integer value parsed, if the value can not be converted to a return NaN

parameter name	meaning	Optional	Defaults
string	Value is to be resolved. If the argument is not a string, it is converted to a string	required
radix	Base, between 2-36	Optional	10

parseInt(10) // 10 ---- 10进制的字符串'10'转成10
parseInt(10, 2) // 2 ---- 2进制的字符串’10‘转成2
parseInt(3, 2) // NaN --- 在2进制中不存在3

Extra added:

In the base is undefined, or the cardinality values of 0 or where not specified, JavaScript handled as follows:

If the string string with "0x" at the beginning or "0X", the base is 16 (hexadecimal).

If the string string begins with "0", radix is 8 (octal) or 10 (decimal), then the base of which is determined by the specific implementation environment. ECMAScript 5 require the use of 10, but not all browsers follow this provision. Therefore, always have to explicitly give the value of radix parameter.

If the string string begins with any other value, the base is 10 (decimal).

Third, to witness the miracle of the moment

In the full understanding of the map and parseInt function, we look at these questions pavement [1, 2, 3].map(parseInt), equivalent to the array elements 1, 2, 3 in turn passed to the parseInt while at the same time do not forget the passed parameter array index index.

[1, 2, 3].map(parseInt) 可看做写法为：

[1, 2, 3].map((v, index) => {
    return parseInt(v, index)
})

结果为：[parseInt(1, 0), parseInt(2, 1), parseInt(3, 2)] ===> [1, NaN, NaN]

Note the wording here is an easy understanding of the wording, in fact parseInt acts as a callback.

IV Conclusion

These are the face questions about Hu brother: [1, 2, 3] .map (parseInt) talk, welcome everyone's attention, message, share.

postscript

And that Hu brother today to share content, like a small partner to remember 收藏, and 转发click the bottom right button to 在看recommend it to more junior partner Yo, welcome to a lot of message exchanges ...

Hu brother something to say, a skill, a feeling of Hu brother! Jingdong open platform chief front-end siege lion. Talk with you big front-end, front-end share system architecture framework implementation principle, the latest and most efficient technology practice!

Press scan code concerned, more handsome and more beautiful Yo! No public attention Hu brother something to say, can continue in-depth exchanges with Hu brother Yo!

Hu brother something to say