摘要:寫在前面新司機最近讀完編寫可維護(hù)的,學(xué)到不少東西。書分為編程風(fēng)格編程實踐自動化三個部分。編程風(fēng)格并不是絕對的,每個人或團(tuán)隊都有自己的編程風(fēng)格,但知道哪些地方需要注意的話,還是有助于新司機完成代碼風(fēng)格的轉(zhuǎn)變。
寫在前面
新司機最近讀完《編寫可維護(hù)的JavaScript》,學(xué)到不少東西。書分為編程風(fēng)格、編程實踐、自動化三個部分。其中編程風(fēng)格是你的代碼格式約定,統(tǒng)一的格式不僅僅有利于團(tuán)隊,也有助于提高新司機的代碼質(zhì)量和程序的可維護(hù)性。編程風(fēng)格并不是絕對的,每個人或團(tuán)隊都有自己的編程風(fēng)格,但知道哪些地方需要注意的話,還是有助于新司機完成代碼風(fēng)格的轉(zhuǎn)變。
第1章 基本的格式化1.1 縮進(jìn):制表符統(tǒng)一tab縮進(jìn)或空格縮進(jìn),不能混用
1.2 語句結(jié)尾不省略分號
// 錯誤的例子 var x = 5 (function(){ alert("不要省略分號"); })();
1.3 單行長度:80字符以內(nèi),長字符用“+”分割
1.4 拆分換行:兩個制表符縮進(jìn),打斷點在符合后
1.5 空行,添加空白行區(qū)分代碼塊
每個流程控制語句(if,while,for...)之前
在方法定義之間
方法中局部變量和第一條語句之前
多行或單行注釋之前
方法內(nèi)邏輯片段之間
1.6 命名:
變量和函數(shù),遵守駝峰大小寫命名法,變量前綴為名詞,函數(shù)前綴為動詞,常見約定:can/has/is返回一個布爾值
常量:使用大寫字母和下劃線來命名
構(gòu)造函數(shù):首字母大寫的駝峰命名法
var setValue = function(){}, getValue = function(){}, isEmpty = false, CONST_VALUE, // 常量 ConstructFunction; // 構(gòu)造函數(shù)
1.7 直接量:
字符串:統(tǒng)一使用雙引號,多行字符串由『+』連接
null使用場景:將它當(dāng)作占位符
初始化可能賦值對象的變量
與一個已經(jīng)初始化的變量比較
當(dāng)函數(shù)的參數(shù)期望是對象時,用作參數(shù)傳入
返回值期望是對象時,用作返回值
null不適合場景:不用null檢測是否傳入?yún)?shù)
禁用undefined
對象直接量初試化數(shù)組或?qū)ο?/p>
var arr = [1, 2, 3, 4], obj = {key1: value1, key2: value2}第2章 注釋
2.1 單行注釋:
用來解釋下一行代碼,注釋前有一個空行,縮進(jìn)與下一行一致
代碼尾部注釋,代碼與注釋間至少有一個縮進(jìn),超過字符限度則應(yīng)放在代碼上方
2.2 多行注釋:
注釋前有一個空行,縮進(jìn)與下一行一致
2.3 注釋的使用:代碼不夠清晰時添加注釋
難以理解的代碼
可能被誤認(rèn)為錯誤的代碼
瀏覽器特性hack
文檔注釋:為如下內(nèi)容添加注釋,所有方法的功能、期望參數(shù)和返回值、構(gòu)造函數(shù)自定義類型和期望參數(shù)
第3章 語句和表達(dá)式3.1 花括號對齊方式:左括號放在第一句末尾,右括號放在代碼后一行
3.2 括號語句間隔:左括號之前,右括號之后添加空格
3.3 switch不漏掉break
3.4 避免使用with
3.5 for中避免使用continue
3.6 for-in使用 hasOwnProperty()方法遍歷實例屬性,for-in用來遍歷對象,不要用來遍歷數(shù)組
4.1 變量聲明:將局部變量集中放在函數(shù)內(nèi)部第一條,var合并為一個,初始化獨占一行放前面,沒初始值的放在后面。
var node1 = null, node2 = null, msg = "", i, len;
4.2 函數(shù)聲明:先聲明再使用,函數(shù)聲明不應(yīng)該出現(xiàn)在流程控制語句塊之內(nèi)。
// 錯誤實例,函數(shù)提升使程序不會像想象中的那樣運行 if(document.getElementsByClassName("cls")){ function getClass(){ // someCode } } else { function getClass(){ // someCode } } // 函數(shù)提升后,可以看成是 function getClass(){ /* someCode */ } function getClass(){ /* someCode */ } if(document.getElementsByClassName("cls")){ } else { }
4.3 函數(shù)調(diào)用:函數(shù)名與括號間不加空格
4.4 匿名函數(shù)立即調(diào)用:使用括號包裹起來,或添加注釋
4.5 嚴(yán)格模式:在函數(shù)體內(nèi)使用,而不要在全局作用域使用
4.6 相等:應(yīng)該使用 === 和 !== ,能夠避免強制類型轉(zhuǎn)換,禁止直接使用原始類型
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://m.hztianpu.com/yun/87867.html
摘要:最近讀完編寫可維護(hù)的,讓我受益匪淺,它指明了編碼過程中,需要注意的方方面面,在團(tuán)隊協(xié)作中特別有用,可維護(hù)性是一個非常大的話題,這本書是一個不錯的起點。擴(kuò)展閱讀編寫可維護(hù)的歡迎來到石佳劼的博客,如有疑問,請在原文評論區(qū)留言,我會盡量為您解答。 最近讀完《編寫可維護(hù)的JavaScript》,讓我受益匪淺,它指明了編碼過程中,需要注意的方方面面,在團(tuán)隊協(xié)作中特別有用,可維護(hù)性是一個非常大的話...
摘要:所有的塊語句都應(yīng)當(dāng)使用花括號包括花括號的對齊方式第一種風(fēng)格第二種風(fēng)格塊語句間隔第一種在語句名圓括號和左花括號之間沒有空格間隔第二種在左圓括號之前和右圓括號之后各添加一個空格第三種在左圓括號后和右圓括號前各添加一個空格我個人喜歡在右括號之后添 所有的塊語句都應(yīng)當(dāng)使用花括號, 包括: if for while do...while... try...catch...finally 3....
摘要:本周于上海閉幕,掘金和知乎上都有對應(yīng)的實錄和問答,但會議的視頻目前都還沒放出來,有心的同學(xué)如果找到了歡迎分享。建議中英文對照閱讀。英文原文前端獨立技術(shù)博客推薦推薦一些現(xiàn)在還在堅持原創(chuàng)的博主,有業(yè)界大牛,也有小鮮肉,也有國外美女。 CSS 樣式書寫規(guī)范最佳實踐 本文的所列是實踐當(dāng)中得出的一套比較不錯的 CSS 書寫規(guī)范,可以結(jié)合自身團(tuán)隊發(fā)展出一套適合自己業(yè)務(wù)的規(guī)范。 CSS中的字體與排版...
摘要:本周于上海閉幕,掘金和知乎上都有對應(yīng)的實錄和問答,但會議的視頻目前都還沒放出來,有心的同學(xué)如果找到了歡迎分享。建議中英文對照閱讀。英文原文前端獨立技術(shù)博客推薦推薦一些現(xiàn)在還在堅持原創(chuàng)的博主,有業(yè)界大牛,也有小鮮肉,也有國外美女。 CSS 樣式書寫規(guī)范最佳實踐 本文的所列是實踐當(dāng)中得出的一套比較不錯的 CSS 書寫規(guī)范,可以結(jié)合自身團(tuán)隊發(fā)展出一套適合自己業(yè)務(wù)的規(guī)范。 CSS中的字體與排版...
摘要:本周于上海閉幕,掘金和知乎上都有對應(yīng)的實錄和問答,但會議的視頻目前都還沒放出來,有心的同學(xué)如果找到了歡迎分享。建議中英文對照閱讀。英文原文前端獨立技術(shù)博客推薦推薦一些現(xiàn)在還在堅持原創(chuàng)的博主,有業(yè)界大牛,也有小鮮肉,也有國外美女。 CSS 樣式書寫規(guī)范最佳實踐 本文的所列是實踐當(dāng)中得出的一套比較不錯的 CSS 書寫規(guī)范,可以結(jié)合自身團(tuán)隊發(fā)展出一套適合自己業(yè)務(wù)的規(guī)范。 CSS中的字體與排版...
閱讀 1345·2021-09-22 15:18
閱讀 2677·2021-09-22 15:17
閱讀 2285·2019-08-30 15:55
閱讀 1625·2019-08-30 15:54
閱讀 1116·2019-08-30 13:12
閱讀 669·2019-08-30 13:12
閱讀 1729·2019-08-29 11:33
閱讀 1488·2019-08-26 17:04