【青訓營】- 如何寫好JS

這是我參與8月更文挑戰的第18天，活動詳情檢視： 8月更文挑戰

寫好JS的一些原則

各司其責

• JavaScript：負責行為表現
• CSS: 負責樣式
• HTML：負責結構

元件封裝

元件是值web頁面上抽離出來的一個個包含模闆、功能和樣式的單元，好的元件具備封裝性

、正确性、拓展性、複用性。元件設計的原則：封裝性、正确性、拓展性、複用性。

實作元件的步驟：

• 結構設計
• 展現效果
• 行為設計

三次重構

• 插件化
• 模闆化
• 抽象化

過程抽象

• 用來處理局部細節控制的一些方法。
• 函數式程式設計思想的基礎應用。

高階函數

• 以函數作為參數
• 以函數作為傳回值
• 常用于作為函數裝飾器

下面介紹一些常用的高階函數

• Once
• Throttle
• Debounce
• Consumer
• Iterative

寫代碼最應當關注的是什麼？

• 風格
• 效率
• 約定
• 使用場景
• 設計

下面介紹下我個人的心得體會，關于如何寫好JS

1. 代碼應該有清晰的結構

有了清晰的結構，友善我們後續的閱讀和維護，假以時日再次閱讀該代碼也可以快速上手，如果沒有清晰的結構，一旦代碼量增大，則可能導緻難以排查錯誤的情況。

2. 指定良好的編碼規範

一個良好的代碼不應該有下面的問題：

• 重複代碼
• 命名不規範
• 函數過長

3. 避免使用JS内置不合理文法

JS這門語言由于曆史原因，存在一些不合理的文法（可能會造成預料之外的bug）,例如全局變量、等于判斷、eval的使用等。

4. 盡量簡潔的JS代碼

在實作一個功能的時候，寫法往往有很多種，一萬個人就有一萬個哈姆雷特，但是越簡潔的文法，越能激起人們閱讀的興趣，同時能夠提高可讀性。