成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

提高代碼可讀性,掌握這些就夠了

khs1994 / 2870人閱讀

摘要：提高代碼可讀性掌握這些就夠了今天看到一篇關(guān)于代碼優(yōu)化的文章寫得十分實(shí)用在學(xué)習(xí)總結(jié)后梳理出思維結(jié)構(gòu)圖將收貨的分享一下原作者方應(yīng)杭原文地址注意這篇文章所指的代碼優(yōu)化特指的是代碼可讀性方面的一些寫法優(yōu)化而不是指的性能優(yōu)化。

提高代碼可讀性,掌握這些就夠了

今天看到一篇關(guān)于代碼優(yōu)化的文章,寫得十分實(shí)用,在學(xué)習(xí)總結(jié)后,梳理出思維結(jié)構(gòu)圖,將收貨的分享一下

原作者:方應(yīng)杭

原文地址:https://zhuanlan.zhihu.com/p/...

注意:這篇文章所指的代碼優(yōu)化,特指的是代碼可讀性方面的一些寫法優(yōu)化,而不是指的性能優(yōu)化。

下面是我總結(jié)的一份思維導(dǎo)圖,方便形成對(duì)文章內(nèi)容結(jié)構(gòu)的一個(gè)大致的印象。

首先是關(guān)于代碼優(yōu)化的幾條原則:

易讀性優(yōu)先

如果不是性能瓶頸問(wèn)題,不要只是為了性能優(yōu)化而改寫代碼

沒(méi)有銀彈。無(wú)論怎么寫,代碼的復(fù)雜性不會(huì)消失。

關(guān)于第三條,作者也解釋了,如果你這個(gè)功能邏輯一句話能說(shuō)清,那你肯定不應(yīng)該寫上百行那么復(fù)雜,如果10分鐘也講不清楚的功能,代碼也一定會(huì)體現(xiàn)出功能的復(fù)雜。

一、如何命名代碼

這里講的是程序員的三大難題之一,變量命名。

包括兩大點(diǎn):

要注意詞性,包括6小點(diǎn)。

注意一致性(風(fēng)格統(tǒng)一),包括4小點(diǎn)。

1.注意詞性

(1) 普通變量的命名,一般就用「名詞」

 name: "lvziwei",
 age : "18"

(2) 布爾類型變量的命名,用「isX」或者「hasX」或者「canX」

    isVip:  true              表示是VIP
    hasValue: true            表示有值
    canSpeak: true            表示可以說(shuō)話

(3) 函數(shù)是一個(gè)動(dòng)作,當(dāng)然用「動(dòng)詞」

     run(){}, // 不及物動(dòng)詞
     drinkWater(){}, // 及物動(dòng)詞

(4) 函數(shù)中,如果是回調(diào)函數(shù)。用「介詞」開頭，或用「動(dòng)詞的現(xiàn)在完成時(shí)態(tài)」

「介詞」開頭

    beforeUpdate()
    afterUpdate()

「動(dòng)詞的現(xiàn)在完成時(shí)態(tài)」, 典型的是Vue的生命周期鉤子函數(shù)。

     var component = {
          beforeCreate(){},
          created(){},
          beforeMount(){},
          mounted(){},
          beforeUpdate(){},
          updated(){},
          activated(){},
          deactivated(){},
          beforeDestroy(){},
          destroyed(){},
          errorCaptured(){}
      }

這兩種寫法都很容易讀,但是注意你最好只選擇一種風(fēng)格寫法并保持,這也是下面將要提到的一致性。

(5) 特別的 : 一些容易混淆的變量,可以添加前綴來(lái)讓他們更容易讀

    var dom1 = document.querySelector("#dom1")
    var dom2 = $("#dom2")
    
    // 這樣的代碼不容易讀,因?yàn)閐om1 dom2直覺(jué)上感覺(jué)是一類的,但是一個(gè)是dom對(duì)象,一個(gè)是JQ對(duì)象
    
    // 前綴優(yōu)化: 可通過(guò)變量名稱,一眼看出他們一個(gè)是DOM,一個(gè)是JQ對(duì)象
    
    var dom = document.querySelector("#dom1")
    var $dom = $("#dom2")

(6) 特別的 : 屬性訪問(wèn)器函數(shù),可以用名詞

這是一種約定成俗的命名方式吧,按說(shuō)函數(shù)都用動(dòng)詞,但是你看到一個(gè)框架里的函數(shù)API是用的名詞,那么這很可能按時(shí)這個(gè)函數(shù)是一個(gè)屬性訪問(wèn)器。

JQ中的text()

$dom.text()
$dom.text("內(nèi)容1")
2.注意一致性(風(fēng)格統(tǒng)一)

(1) 風(fēng)格一致

上面提到過(guò),下面2種風(fēng)格,最好只選擇其一。

     beforeUpdate()
     afterUpdate()
     beforeUpdate(){},
     updated(){},

(2) 函數(shù)名和函數(shù)體一致

函數(shù)名稱正確的描述函數(shù)體內(nèi)容,函數(shù)內(nèi)容要體現(xiàn)函數(shù)名稱

(3) 時(shí)間一致

隨著時(shí)間推移,業(yè)務(wù)的改變可能導(dǎo)致當(dāng)初的變量名稱已經(jīng)不再合適,這時(shí)候要及時(shí)修改,這也是最難做到的,因?yàn)闋恳话l(fā)而動(dòng)全身。

二、如何組織代碼

好了,現(xiàn)在我們的變量名稱已經(jīng)易讀,容易理解了,之后干嘛?

是不是就剩下將你的變量組織起來(lái)了? 下面主要從兩方面講了如何組織代碼

1.用函數(shù)組織你的代碼

步驟：

將一坨代碼放到一個(gè)函數(shù)里

將代碼依賴的外部變量作為參數(shù)

將代碼的輸出作為函數(shù)的返回值

給函數(shù)取一個(gè)合適的名字

調(diào)用這個(gè)函數(shù)并傳入?yún)?shù)

這個(gè)函數(shù)里的代碼如果超過(guò) 5 行，則依然有優(yōu)化的空間，請(qǐng)回到第 1 步

2.用對(duì)象組織你的代碼

我們會(huì)用 this 來(lái)串聯(lián)這個(gè)對(duì)象和所有函數(shù)。
最終代碼：http://js.jirengu.com/mimazab...

3.一些固定套路

表驅(qū)動(dòng)編程（《代碼大全》里說(shuō)的）
所有一一對(duì)應(yīng)的關(guān)系都可以用表來(lái)做

自說(shuō)明代碼（以 API 參數(shù)為例）
把別人關(guān)心的東西放在顯眼的位置

三、如何寫一手爛代碼

角度清奇,原作者推薦了一篇教人如何寫出不可維護(hù)的代碼的文章 : https://coolshell.cn/articles...

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/92690.html

相關(guān)文章

  • 前端基礎(chǔ)進(jìn)階（十三）：透徹掌握Promise的使用，讀這篇就夠了

    摘要：在對(duì)象的構(gòu)造函數(shù)中，將一個(gè)函數(shù)作為第一個(gè)參數(shù)。二對(duì)象中的方法，可以接收構(gòu)造函數(shù)中處理的狀態(tài)變化，并分別對(duì)應(yīng)執(zhí)行。 showImg(https://segmentfault.com/img/remote/1460000008932857); Promise的重要性我認(rèn)為我沒(méi)有必要多講，概括起來(lái)說(shuō)就是必須得掌握，而且還要掌握透徹。這篇文章的開頭，主要跟大家分析一下，為什么會(huì)有Promise...

    yy736044583 評(píng)論0 收藏0

  • 【轉(zhuǎn)】成為Java頂尖程序員 ，看這10本書就夠了

    摘要：實(shí)戰(zhàn)高并發(fā)程序設(shè)計(jì)這本書是目前點(diǎn)評(píng)推薦比較多的書，其特色是案例小，好實(shí)踐代碼有場(chǎng)景，實(shí)用。想要學(xué)習(xí)多線程的朋友，這本書是我大力推薦的，我的個(gè)人博客里面二十多篇的多線程博文都是基于此書，并且在這本書的基礎(chǔ)上進(jìn)行提煉和總結(jié)而寫出來(lái)的。 學(xué)習(xí)的最好途徑就是看書，這是我自己學(xué)習(xí)并且小有了一定的積累之后的第一體會(huì)。個(gè)人認(rèn)為看書有兩點(diǎn)好處：showImg(/img/bVr5S5);　　1.能出版出...

    DTeam 評(píng)論0 收藏0

  • JavaScript入門的5條建議

    摘要：你是否已經(jīng)初步掌握了和，但完全不知道從何入手如果是，那么這篇文章一定會(huì)對(duì)你有所幫助，這里總結(jié)了條建議，幫助初學(xué)者總結(jié)學(xué)習(xí)方法，提高學(xué)習(xí)效率。這樣的結(jié)果就是，個(gè)小時(shí)最多只利用了個(gè)小時(shí)。 你是否已經(jīng)初步掌握了html和css，但完全不知道從何入手JavaScript？如果是，那么這篇文章一定會(huì)對(duì)你有所幫助，這里總結(jié)了5條建議，幫助JavaScript初學(xué)者總結(jié)學(xué)習(xí)方法，提高學(xué)習(xí)效率。 一、...

    李昌杰 評(píng)論0 收藏0

  • 面試中關(guān)于Redis的問(wèn)題看這篇就夠了

    摘要：所以查閱官方文檔以及他人造好的輪子，總結(jié)了一些面試和學(xué)習(xí)中你必須掌握的問(wèn)題。在微博應(yīng)用中，可以將一個(gè)用戶所有的關(guān)注人存在一個(gè)集合中，將其所有粉絲存在一個(gè)集合。 昨天寫了一篇自己搭建redis集群并在自己項(xiàng)目中使用的文章，今天早上看別人寫的面經(jīng)發(fā)現(xiàn)redis在面試中還是比較常問(wèn)的（筆主主Java方向）。所以查閱官方文檔以及他人造好的輪子，總結(jié)了一些redis面試和學(xué)習(xí)中你必須掌握的問(wèn)題。...

    yanbingyun1990 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<