作為一個后端開發的程序員,一直就對JavaScript情有獨鍾,作為一門前后端通吃的語言,必須贊一下。而且之前很長一段時間都有在做JavaScript,一路都是和ie8死磕,磕完又找低版本的谷歌磕,坑坑窪窪不計其數,但是收獲就是了解到JavaScript很多好用的特性,熟練使用這些特性,不僅能加快開發速度,還能讓自己的代碼看起來不至於那么low,這是每個前端程序員都想做到的!
邏輯運算
JavaScript中邏輯運算有3中:且(&&),或(||),非(!),不過在說這三種邏輯運算之前,先解釋一下JavaScript中的布爾類型。
JavaScript和其它高級語言一樣,布爾類型有true和false兩種,但是與其它語言不同的地方,也是JavaScript很奇妙的一個地方是,JavaScript中的任何類型都可以轉化成布爾類型,轉化規則如下:
false:false,0,null,undefined,空字符串(“”和‘’),NaN
true:上面可轉換為false以外的所有數據都轉換為true
也就是說,我們以后再if條件判斷中,很多時候沒有比較去使用等於去判斷,而是直接使用要判斷的對象就可以了,比如下面的代碼:
var a; if (a == undefined) { console.log("a is undefined"); } else { console.log("a is " + a); }
直接使用
var a; if (a) { console.log("a is undefined"); } else { console.log("a is " + a); }
或者直接使用三元運算符:
var a; a ? console.log("a is " + a) : console.log("a is undefined");
當然這么用要具體需求具體看,畢竟0和空字符串也會被轉換成false,但是0和空字符串有時卻又是合法的業務邏輯,所以這點要注意
言歸正傳,一般的,我們所說的邏輯運算,都是對布爾類型的運算,與(&&)運算時當且僅當兩邊都是true時才返回true,否則返回false,或(||)運算是當且僅當兩邊都是false時返回false,否則返回true,非(!)運算時取反,當判斷是true時返回false,當判斷是false時返回true,注意了,這是一般的思維,畢竟像java,C#等等高級語言都是這樣的,JavaScript的用法也基本是這樣,但是又不一樣!JavaScript的邏輯運算規則如下:
與(&&):如果左邊表達式判斷是false,則返回左邊表達式的值,否則返回右邊表達式的值
或(||):如果左邊表達式判斷為true,則返回左邊表達式的值,否則返回右邊表達式的值
非(!):如果表達式判斷為true,則返回false,否則返回true
注意了,與(&&)和或(||)運算最終返回的是表達式的值!回的是表達式的值!回的是表達式的值!重要的事情說三遍。這個值不一定是布爾類型的true或者false,可以是其他類型的值!!!這有什么用呢?
曾幾何時,我們是否寫過這樣的代碼:
function f(a, b) { if (a == null) { a = {} } if (b != null) { b.say(); } }
我們可以簡化成:
function f(a, b) { a = a || {}; b && b.say(); }
這樣寫,一方面代碼量少了,另一方面代碼不會顯得那么low,總之,就是記住與(&&)和或(||)的運算規則,從左想讓開始運算,並返回表達式的值,而非true或false。當然,如果表達式返回的是true或者false,那與(&&)和或(||)返回的也就是true或者false了。而我們經常會寫一些簡單的if判斷,一個判斷做一個事,另一個判斷做另一件個事,這樣判斷完全可以用與(&&)和或(||)來代替,讓代碼看起來更美觀,換句話說就是,與(&&)和或(||)的作用是可以處理邏輯運算,另一個重要的作用就是用來代替if做判斷!
如果你看一些開源項目的源碼,比如jquery等,與(&&)和或(||)在里面用的是很多的,多數都是代替if做判斷!
非(!)運算就比較簡單了,一般就是拿來取反的,對true返回false,對false返回true,但是還有一種特性,上面的運算規則可以看到,非(!)運算返回的始終是布爾類型,這樣,當我們確切需要某些值必須是布爾類型是,這個運算就很有用,比如jQuery的each函數,當且僅當函數返回false時,就會跳出遍歷,如下面的代碼:
var a = [1, null, 3]; $.each(a, function (i, t) { console.log(i, t); if (!t) { return false;//跳出循環 } })
可以寫成:
var a = [1, null, 3]; $.each(a, function (i, t) { console.log(i, t); return !!t; })
總之,熟悉邏輯運算的規則,熟練使用邏輯,可以簡化我們的代碼,使代碼看起來簡潔舒適