JavaScript文法中12個需要繞開的陷阱

來源:互聯網
上載者:User

本文節選自阮一峰的部落格http://www.ruanyifeng.com/blog/,原文標題為《12種不宜使用的Javascript文法》。原文是阮一峰對《Javascript語言精粹》一書的讀後感。該書的作者是Douglas Crockford,他是目前世界上最精通Javascript的人之一,也是Json格式的創造者。他認為Javascript有很多糟粕。因為1995年Brendan Eich設計這種語言的時候,只用了三個月,很多語言特性沒有經過深思熟慮,就推向了市場。結果等到人們意識到這些問題的時候,已經有100萬程式員在使用它了,不可能再大幅修改語言本身了。所以,Douglas Crockford決定,他要告訴大家,Javascript中哪些部分是精粹,哪些部分是糟粕和雞肋。阮一峰將書中附錄的12種應該避免的JavaScript文法在文中貼出共用,內容如下:

1. == 

Javascript有兩組相等運算子,一組是==和!=,另一組是===和!==。前者只比較值的相等,後者除了值以外,還比較類型是否相同。

請盡量不要使用前一組,永遠只使用===和!==。因為==預設會進行類型轉換,規則十分難記。如果你不相信的話,請回答下面五個判斷式的值是true還是false:

 
  1. false == 'false' 
  2.  
  3. false == undefined  
  4.  
  5. false == null 
  6.  
  7. null == undefined  
  8.  
  9. 0 == '' 
  10.  

前三個是false,後兩個是true。

2. with

with的本意是減少鍵盤輸入。比如

 
  1. obj.a = obj.b;  
  2.  
  3. obj.c = obj.d;  
  4.  

可以簡寫成

 
  1. with(obj) {  
  2. a = b;  
  3. c = d;  
  4. }  
  5.  

但是,在實際運行時,解譯器會首先判斷obj.b和obj.d是否存在,如果不存在的話,再判斷全域變數b和d是否存在。這樣就導致了低效率,而且可能會導致意外,因此最好不要使用with語句。

3. eval

eval用來直接執行一個字串。這條語句也是不應該使用的,因為它有效能和安全性的問題,並且使得代碼更難閱讀。

eval能夠做到的事情,不用它也能做到。比如

 
  1. eval("myValue = myObject." + myKey + ";");  
  2.  

可以直接寫成

 
  1. myValue = myObject[myKey];  
  2.  

至於ajax操作返回的json字串,可以使用官方網站提供的解析器json_parse.js運行。

4. continue

這條命令的作用是返回到迴圈的頭部,但是迴圈本來就會返回到頭部。所以通過適當的構造,完全可以避免使用這條命令,使得效率得到改善。

5. switch 貫穿

switch結構中的case語句,預設是順序執行,除非遇到break,return和throw。有的程式員喜歡利用這個特點,比如

 
  1. switch(n) {  
  2. case 1:  
  3. case 2:  
  4. break;  
  5. }  
  6.  

這樣寫容易出錯,而且難以發現。因此建議避免switch貫穿,凡是有case的地方,一律加上break。

 
  1. switch(n) {  
  2. case 1:  
  3. break;  
  4. case 2:  
  5. break;  
  6. }  
  7.  

6. 單行的塊結構

if、while、do和for,都是塊結構語句,但是也可以接受單行命令。比如

 
  1. if (ok) t = true;  
  2.  

甚至寫成

 
  1. if (ok)  
  2. t = true;  
  3.  

這樣不利於閱讀代碼,而且將來添加語句時非常容易出錯。建議不管是否只有一行命令,都一律加上大括弧。

 
  1. if (ok){  
  2. t = true;  
  3. }  
  4.  

7. ++和--

遞增運算子++和遞減運算子--,直接來自C語言,表面上可以讓代碼變得很緊湊,但是實際上會讓代碼看上去更複雜和更晦澀。因此為了代碼的整潔性和易讀性,不用為好。

8. 位元運算符

Javascript完全套用了Java的位元運算符,包括按位與&、按位或|、按位異或^、按位非~、左移<<、帶符號的右移>>和用0補足的右移>>>。

這套運算子針對的是整數,所以對Javascript完全無用,因為Javascript內部,所有數字都儲存為雙精確度浮點數。如果使用它們的話,Javascript不得不將運算數先轉為整數,然後再進行運算,這樣就降低了速度。而且“按位與運算子”&同“邏輯與運算子”&&,很容易混淆。

9. function語句

在Javascript中定義一個函數,有兩種寫法:

 
  1. function foo() { }  
  2.  

 
  1. var foo = function () { }  
  2.  

兩種寫法完全等價。但是在解析的時候,前一種寫法會被解析器自動提升到代碼的頭部,因此違背了函數應該先定義後使用的要求,所以建議定義函數時,全部採用後一種寫法。

10. 基礎資料型別 (Elementary Data Type)的封裝對象

Javascript的基礎資料型別 (Elementary Data Type)包括字串、數字、布爾值,它們都有對應的封裝對象String、Number和Boolean。所以,有人會這樣定義相關值:

 
  1. new String("Hello World");  
  2.  
  3. new Number(2000);  
  4.  
  5. new Boolean(false);  
  6.  

 

  • 詳解Javascript中checkbox樹的功能
  • 對決JavaScript HTML5指令碼API預覽
  • Javascript和CSS菜單推薦13條
  • 探秘Google的JavaScript開發工具Closure
  • JavaScript將增加本地操作API 可直接操..

這樣寫完全沒有必要,而且非常費解,因此建議不要使用。

 

另外,new Object和new Array也不建議使用,可以用{}和[]代替。

11. new語句

Javascript是世界上第一個被大量使用的支援Lambda函數的語言,本質上屬於與Lisp同類的函數式程式設計語言。但是當前世界,90%以上的程式員都是使用物件導向編程。為了靠近主流,Javascript做出了妥協,採納了類的概念,允許根據類產生對象。

類是這樣定義的:

 
  1. var Cat = function (name) {  
  2. this.name = name;  
  3. this.saying = 'meow' ;  
  4. }  
  5.  

然後,再產生一個對象

 
  1. var myCat = new Cat('mimi');  
  2.  

這種利用函數產生類、利用new產生對象的文法,其實非常奇怪,一點都不符合直覺。而且,使用的時候,很容易忘記加上new,就會變成執行函數,然後莫名其妙多出幾個全域變數。所以,建議不要這樣建立對象,而採用一種變通方法。

Douglas Crockford給出了一個函數:

 
  1. Object.beget = function (o) {  
  2. var F = function (o) {};  
  3. F.prototype = o ;  
  4. return new F;  
  5. };  
  6.  

建立對象時就利用這個函數,對原型對象進行操作:

 
  1. var Cat = {  
  2. name:'',  
  3. saying:'meow' 
  4. };  
  5.  
  6. var myCat = Object.beget(Cat);  
  7.  

對象產生後,可以自行對相關屬性進行賦值:

 
  1. myCat.name = 'mimi';  
  2.  

12. void

在大多數語言中,void都是一種類型,表示沒有值。但是在Javascript中,void是一個運算子,接受一個運算數,並返回undefined。

 
  1. void 0; // undefined  
  2.  

這個命令沒什麼用,而且很令人困惑,建議避免使用。

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.