[javascript]運算子優先順序和強制轉換所造成的問題

  • 790
  • 0

javascript  在很多時候帶來方便,但因其屬於弱型別在強制轉換的時候,

可能在不知不覺當中造成了一bug,在這邊稍微紀錄一下..

在javascript 中運算子的表達方式 (+-*/...etc.)

其實在javascript的引擎中 +-*/ 自己本身就是一個function

如a+b 在javascript的引擎中表達的就是

function +(a,b)
{
}

以下的範例中 , 其實這題不難

以往學語言的過程中 等號(=)給值方式都蠻清楚的 屬於右邊給左邊的方式

var a =1 , b=2 , c=3;

console.log(a=b=c);

所以很清楚知道console.log答案是 3

如果對javascript的運算子執行優先順序有疑問可以參考MDN

 

強制轉換 

可能一直以來都是使用C# 所以在面對變數命名的時候

已經習慣了強型別的方式 所以在處理變數的過程中

反而是比較少遇到的(因為物件內的屬性都已經分得很清楚)

但是今天再看到這個例子的時候卻有嚇到的感覺

var a=3,b=2,c=1;

console.log(a<b<c);

先公布一下 console.log出來的答案 是true

不覺得 很奇妙嗎?

首先 小於 是從左到右(優先順序),

所以優先處理的 a<b 答案毋庸置疑就是false

但之後運算式處理的是甚麼呢?

false < c???

這是甚麼??

原來javascript引擎 會"自動的" 將false轉成數字(可以從Number(false)來看)

轉換後

0 < c (提醒一下 c是1),此時當然是true囉! (對以上說明不清楚,可以從JSBin來看)

但是,這不是我們要的答案

javascript在處理強制轉換時可能會帶給我們無法預期的結果

卻也有時因為這樣的轉換帶來了寫法上的簡便

譬如 以下這個例子 要判斷digital是否有初始值時,可以用以下這個方法

寫法上真的簡便很多很多

var a;

function data(digital)
{
  var b = digital || "1";
  if(b == 1)
  {
      console.log("b is equal one");
  }
  else
  {
      console.log("b is " + b);
  }
}

data(a);

出處 : Udemy課程 JavaScript全攻略:克服JS的奇怪部分 https://www.udemy.com/javascriptjs

真的很推薦這個課程,有一些不太清楚的部分或者是很tricky的點 內部都有講到

可以趁折扣的時候購買~

-----------------------------------------

有時在會走之前你就得跑

你不解決問題 就等問題解決你