Javascript優(yōu)化技巧之短路表達式詳細(xì)介紹
什么是短路表達式?
短路表達式:作為"&&"和"||"操作符的操作數(shù)表達式,這些表達式在進行求值時,只要最終的結(jié)果已經(jīng)可以確定是真或假,求值過程便告終止,這稱之為短路求值。這是這兩個操作符的一個重要屬性。
一個最簡單的例子:
foo = foo||bar;
這行代碼是什么意思?答案:
//如果foo存在,值不變,否則把bar的值賦給foo
if(!foo)
foo = bar;
在javascript的邏輯運算中,0、""、null、false、undefined、NaN都會判定為false,而其他都為true。所以在上式的foo = foo||bar;中,||先計算第一個運算數(shù),如果可以被轉(zhuǎn)換成true,也就是表示foo已經(jīng)存在有值,那么返回左邊這個表達式的值,否則計算第二個運算數(shù)bar。
另外,即使||運算符的運算數(shù)不是布爾值,仍然可以將它看作布爾OR運算,因為無論它返回的值是什么類型,都可以被轉(zhuǎn)換為布爾值。
當(dāng)然,使用如下做法會更加嚴(yán)謹(jǐn):
if(foo) //不夠嚴(yán)謹(jǐn)
if(!!foo) //更為嚴(yán)謹(jǐn),!!可將其他類型的值轉(zhuǎn)換為boolean類型
可以測試一下:
var foo;
var number = 1;
var string = "string";
var obj = {};
var arr = [];
console.log(typeof(foo)); // undefined
console.log(typeof(number)); //number
console.log(typeof(string)); //string
console.log(typeof(obj)); //object
console.log(typeof(arr)); //object
console.log(typeof(!!foo)); // boolean
console.log(typeof(!!number)); //boolean
console.log(typeof(!!string)); //boolean
console.log(typeof(!!obj)); //boolean
console.log(typeof(!!arr)); //boolean
利用這一點可以很好的符合,優(yōu)化javascript工程一文中提到的,使腳本少運行或者不運行,以達到優(yōu)化javascript的目的。但是需要注意的是,這樣寫幫我們精簡了代碼的同時,也帶來了代碼可讀性的降低的缺點。所以比較好的做好是添加是適當(dāng)?shù)淖⑨尅?/p>
相關(guān)文章
使用JS批量選中功能實現(xiàn)更改數(shù)據(jù)庫中的status狀態(tài)值(批量展示)
我們在開發(fā)項目的時候經(jīng)常會在后臺管理時用到批量展示功能來動態(tài)的修改數(shù)據(jù)庫的值。下面以修改數(shù)據(jù)庫的status狀態(tài)值來實現(xiàn)批量展示功能2016-11-11動態(tài)的創(chuàng)建一個元素createElement及刪除一個元素
本文用示例為大家介紹下動態(tài)創(chuàng)建一個元素createElement及刪除一個元素,感興趣的朋友可以參考下2014-01-01頁面下沉抖動效果-網(wǎng)站HTTP連接沒有效果-PC上有效果
頁面下沉抖動效果實現(xiàn)代碼,代碼少,功能還可以2008-05-05JS實現(xiàn)上傳圖片的三種方法并實現(xiàn)預(yù)覽圖片功能
在用戶注冊頁面,需要用戶在本地選擇一張圖片作為頭像,并同時預(yù)覽,實現(xiàn)思路有兩種,具體實現(xiàn)方法和實例代碼大家參考下本文2017-07-07Javascript腳本獲取form和input內(nèi)容的方法(兩種方法)
隨著js的發(fā)展,許多的網(wǎng)頁數(shù)據(jù)處理完全可以由js腳本解決,而不需要發(fā)送到服務(wù)器,這里分享兩種Javascript腳本獲取form和input內(nèi)容的方法,感興趣的朋友跟隨小編一起看看吧2023-05-05