javascript：关于parseint()、Number和+最清晰的区别解析

1.思考

首先对于+操作符有一个有趣的题目

console.log(++[[]][+[]]+[+[]]) //???

++[[]][+[]]+[+[]]这个式子输出的是什么？

不知道？那就先了解一下他们的用法吧。

2.三者的使用

  parseInt(), parseInt(str, radix)方法是把给定的字符串按照指定的进制转换为整型 int类型。parseInt()在遇到不能解析的内容时会自动返回前面已经解析好的内容，如果是第一位字符不能解析那么会直接返回NaN。

  Number(), Number()除了可以用’new’关键字来创建对象外，还可以用来执行类型转换，如果需要转换的内容不能转换为数字，则会自动返回NaN。

  +操作符可以将字符串转化为数字，和Number()一样，如+”123”返回是123.

3.案例

// 当字符串是由数字组成的时候
	let numStr = '123'
	console.log(parseInt(numStr))   //123
	console.log(Number(numStr))     //123
	console.log(+numStr)            //123

	// 当字符串是由字母组成的时候
	numStr = 'abc'
	console.log(parseInt(numStr))   //NaN
	console.log(Number(numStr))     //NaN
	console.log(+numStr)            //NaN

	// 当字符串是由数字和字母组成的时候，数字开头
	numStr = '12a3b'
	console.log(parseInt(numStr))   //12
	console.log(Number(numStr))     //NaN
	console.log(+numStr)            //NaN

	// 当字符串是由数字和字母组成的时候,字母开头
	numStr = 'a123'
	console.log(parseInt(numStr))   //NaN
	console.log(Number(numStr))     //NaN
	console.log(+numStr)            //NaN

	// 当字符串是由0和数字
	numStr = '0123'
	console.log(parseInt(numStr))   //123
	console.log(Number(numStr))     //123
	console.log(+numStr)            //123

	// **当字符串包含小数点
	numStr = '123.456'
	console.log(parseInt(numStr))       //123
	console.log(Number(numStr))         //123.456
	console.log(+numStr)                //123.456

	// **当字符串为null时
	numStr = null
	console.log(parseInt(numStr))       //NaN
	console.log(Number(numStr))         //0
	console.log(+numStr)                //0

	// **当字符串为''(空)时
	numStr = ''
	console.log(parseInt(numStr))       //NaN
	console.log(Number(numStr))         //0
	console.log(+numStr)                //0

4.其他的类型

  对于其他的类型调用这三个其实原理是没有变的，首先是将其他的类型转换为字符类型，也就是先调用toString()的方法，然后在通过这三种方式转换为数字；

	numStr =[]
    console.log(numStr.toString())      //''空字符串
    console.log(parseInt(numStr))       //NaN
	console.log(Number(numStr))         //0
	console.log(+numStr)    			//0
	
	numStr =[1]
    console.log(numStr.toString())      //1
    console.log(parseInt(numStr))       //1
	console.log(Number(numStr))         //1
	console.log(+numStr)                //1
    
    numStr =[1,2]
    console.log(numStr.toString())      //1,2
    console.log(parseInt(numStr))       //1
	console.log(Number(numStr))         //NaN
	console.log(+numStr)                //NaN

关于++[[]][+[]]+[+[]]解法

如果你看了上面的内容你就会知道+[]输出的是0了
所以式子可以简化为

++[[]][0]+[0]  

[[]][0]的意思是获取 [[]] 的第一个元素，这就得出了下面的结果：

++[]+[0]  

++[]可以转化为

 +([]+1) =====> +('1') =====> 1

式子又得到一步简化

1+[0] // 1+[0].toString

最终的结果就是 10 （string类型）

牛鼻不？也希望各位不单单要钻牛角尖，而是在钻研的过程中，掌握更多的基础。