亂想
javascript為什么需要隱式轉換?如果沒有會出現什么情況?
找了一圈沒有看到關于這個的討論,只好自己研究了,可能不一定正確,自行辨知。
郁悶就是郁悶在好好的,為什么要搞個隱式轉換,一般來講這樣去想不太可能想出個結果,畢竟這門語言不是自己寫的,如果換一個問題,可能會好點,如果沒有隱式轉換javscript會成什么樣子?
比如下面這一段代碼:
console.log("10" - 1)
如果沒有隱式轉換,也許會報錯吧?或者返回NaN?,不太確定,但假如說javascript根本不存在隱式轉換,或許你不會這樣去寫代碼吧,那么就更奇怪了,設計隱式轉換究竟何目的?目前能想到的一點就是因為它是一門動態語言,值是運行時才知道的,因此有很多不確定的因素,這可能是作者設計隱式轉換的目的吧。
什么是隱式轉換
console.log(1 + "2");//12
可以看到一個是Number類型的值和一個String類型的值進行了相加,結果是12。那為什么是12呢?如果是按照數字相加應該是3,但這里卻是將1和2進行了字符串拼接,也就是說這里的1被轉換成了字符串1。
結論
如果兩個值(也可以是多個)的類型不同,但你卻拿它們來運算,它們就會進行隱式轉換,當然也不只是運算才會產生隱式轉換。
誰被轉換
console.log(10 + "2");//102console.log(10 - "2");//8 console.log(10 * "2");//20 console.log("2" - 10);//-8 console.log(10 / "2");//5
它們有一個小小的規律,如果是+號,數字會被轉換成字符串,而如果是減乘除則會將字符串轉換成數字。
那么為什么唯獨+號比較特別呢,因為在javascript中,+號是有兩個作用的,一個是數字相加,另一個是字符串拼接,而javscript默認把這種情況當成了字符串拼接。另減乘除就不存在這種問題,因此也只好將字符串轉換成數字。
哪些情況下會進行隱式轉換
上面的幾個例子中,都是在講運算符導致的隱式轉換,那么除了這種情況還有哪些情況下會進行隱式轉換?
某些函數
isNaN():
console.log(isNaN(2)) //false
console.log(isNaN("a")) //true console.log(isNaN("2")) //false
isNaN會將傳進來的那個值進行轉換如果能夠轉換成數字那么就是false(如果本身就是數字那么也是false),否則true。
條件判斷
if(""){console.log(true); //不會被打印 } if(" "){ console.log(true); //會被打印 }
空字符串會被轉換成false,否空字符串會被轉換成true。
[0,-1,[],{},NaN,undefined,null,""," "].forEach(function(item,index){ if(item){ console.log(item); } }) // 打印的有:-1,[],{}," "
也就是除,非0的數字,數組,對象,非空字符串都會被轉換成true,其他的false。
需要注意的是switch不會進行隱式轉換
switch("5"){case 5:console.log(5); break; case "5": console.log("5"); //打印這條 break; }
如果switch會進行隱式轉換那么問題就出大了,甚至我們都不敢去使用它。那么為什么if會進行隱式轉換,我的理解是,因為if它的值無非就是true跟false,而你傳進來的不是這種類型,它自然需要進行轉換,switch則不同,它判斷的是一個值是不是和另外一個值相等,因此它不能去轉換,換一句話說switch使用的是 === 比較。
其他類型的混合運算
相加
console.log([]+0); //0console.log(!+0); //true console.log(!+1); //false console.log(NaN+2); //NaN console.log(NaN+"2"); //NaN2 console.log(NaN+"a"); //NaNa console.log(undefined+0); //NaN console.log(undefined+"0"); //undefined0 console.log(null+0); //0 console.log(null+"0"); //null0 console.log({}+0); //[object Object]0 console.log({}+"0"); //[object Object]0 console.log(""+0); //0 console.log(""+"0"); //0 console.log(true + 0); //1 console.log(true + "0"); //true0 console.log(false + 0); //0 console.log(false + "0"); //false0
- []》 0
- !》 會將后面的那個值轉換成布爾類型,然后取反
- undefined 》 根據后面的那個值來進行轉換,如果是數字轉換成NaN,否則字符串拼接
- {} 》 [object Object]
- true 》 1
- false 》 0
其實有一個規律,除了[],{},其他的值具體轉換是根據和它進行運算的那個值的類型來轉換的。
相減
console.log([]-0); //0console.log(!-0); //true console.log(!-1); //false console.log(NaN-2); //NaN console.log(NaN-"2"); //NaN console.log(NaN-"a"); //NaN console.log(undefined-0); //NaN console.log(undefined-"0"); //NaN console.log(null-0); //0 console.log(null-"0"); //0 console.log({}-0); //NaN console.log({}-"0"); //NaN console.log(""-0); //0 console.log(" "-"0"); //0 console.log("1"-"0"); //1
除了相加以為,其他的幾個運算符,主要還是將這些值轉換成數字進行運算,比較特殊的是!(取反),它始終轉換成的是一個布爾值。
一些有趣的事
根據這些隱式轉換,有時我們可以用它來做一些不同尋常的事,比如直接利用隱式轉換來取得一個object字符串。
console.log(({}+0).substring(1,({}+0).indexOf(" "))) //object
原理因為{}+0等于 = "[object Object]0",既然它是一個字符串,那么我們可以用字符串的方法,將其中的某個值取出來,也可以用[]的方式來取值。
也就是利用這些隱式轉換你可以取得任何字符串,甚至中文,不過需要你對javascript有點基礎罷了。
console.log(String.fromCharCode(20013)) //中
取中文需要你知道對應的字符串編碼值
隱式轉換帶來的利與弊
好處就是,我們不需要直接顯示的進行轉換,比如你想將一個字符串轉成數字,只需要這樣:
console.log("15"-0) //數字15
傳統的做法
console.log(parseInt("15")) //數字15
但也有壞處,就是有些你并不希望進行轉換,但它卻轉換了,而往往你容易忘了它會進行隱式轉換這一點,導致一些不太明顯的bug。
總結
大致會進行隱式轉換的情況如下:
1、不同類型的值進行運算
2、判斷
3、個別函數
問答
這兩年越來越多討論關于全棧工程師的話題,而實際上所謂的全棧工程師就是早期的程序員,那時分工沒有現在這么明細,很多活都是一個人干,后來才開始分前端后端等,現在又開始所謂的全棧,你怎么看?如果你想成為一個全棧工程師,你會怎么做?