JavaScript 特有奇葩問題“字符串類型與數字類型混亂”的分析與解決，與類型轉換

原創

2020-02-21 05:26

字符串類型與數字類型的混亂，應該是JS最著名的奇葩問題了。
恰好最近遇到這個問題，在這裏對這個問題的解決方法及產生原因進行總結與分析。

Java 語言與 JavaScript 語言是什麼關係。這是初學者常常疑惑的問題。通常情況下大家會回答“有個屁的關係”。但Java 與JavaScript真的一點關係都沒有嗎？答案當然是否定的。這兩種語言雖然有着各種各樣的不同，但他們的語法卻非常的相似，或者說JavaScript刻意的模仿了Java語言的語法。
我們知道Java是一種強類型語言，變量在聲明時必須變量的數據類型。而JavaScript卻是一種弱類型語言。
在Java中數字類型相加的時候用的是字符 “+” ,字符串拼接使用的也是字符 “+”。因爲JavaScript是強類型的，這個時候雖然都是 “+”，但他的語義卻是十分清楚的，不會出現什麼問題。
但是在JavaScript中，情況卻發生了變化。在聲明變量的時候，參數的類型是明確的。例如

	var parameter1 = "231";//這是一個字符串變量
	var parameter2 = 231;  //這是一個數值（int）型變量

然而問題就出在傳遞參數的時候，例如如下情況

	var parameter = 231;
	fun(parameter);
	function fun(parameter){
		//在這裏，傳遞進來的參數是字符串
	}

更奇葩的是，同一個變量。使用 “-” 運算符的時候，做的是數值相減的運算，而使用“+”運算符的時候，卻是字符串的拼接。例如：

	var parameter = 7;
	fun(parameter);
	function fun(parameter){
		for(var i= parameter-2;i<=parameter+2;i++){
			console.log(i);
			//這裏parameter-2 算出的值是5(數值運算)
			//而parameter+2算出的值卻是72(字符串拼接)
			//這個循環會將從5到72的數字都打印一遍。是的，媽蛋，循環的時候他又變回數字了 ( ╯-_-)╯┴—┴
		}
	}

那麼其他弱類型語言爲啥不會出現這個奇葩的問題呢？
拿PHP舉例，PHP的字符拼接運算符是“.”。數值運算加的運算符爲"+"。故不可能出現這個問題。

以下是問題的解決辦法：

	parameter = parseInt(parameter);

附：JS類型轉換總結

	parseInt("1234blue");   //returns   1234 
	parseInt("0xA");        //returns   10 
	parseInt("22.5");       //returns   22 
	parseInt("blue");       //returns   NaN

	parseFloat("1234blue"); //returns   1234.0 
	parseFloat("0xA");      //returns   NaN 
	parseFloat("22.5");     //returns   22.5 
	parseFloat("22.34.5");  //returns   22.34 
	parseFloat("0908");     //returns   908 
	parseFloat("blue");     //returns   NaN

	Boolean("");            //false   –   empty   string 
	Boolean("hi");          //true   –   non-empty   string 
	Boolean(100);           //true   –   non-zero   number 
	Boolean(null);          //false   -   null 
	Boolean(0);             //false   -   zero 
	Boolean(new Object());  //true   –   object

	Number(false)           // 0 
	Number(true)            //1 
	Number(undefined)       // NaN 
	Number(null)            //0 
	Number( "5.5 ")         //5.5 
	Number( "56 ")          //56 
	Number( "5.6.7 ")       //NaN 
	Number(new Object())    //NaN 
	Number(100)             //100  

	var s1   = String(null);   //"null" 
	var oNull= null; 
	var s2   = oNull.toString();   //won’t work, causes an error

	var s1 = 123;
	var s2 = 123+"";       //轉換爲字符串

如果有幫到您，打個賞唄