JavaScript 代碼優化和部署——“可維護性”的注意要點

scwang90 發布于2019-08-19 17:53 / 391人閱讀

摘要：代碼約定可讀性以下地方需要進行注釋函數和方法注釋參數代表什么，是否有返回值大段代碼描述任務的注釋復雜的算法變量和函數命名變量用名詞函數名用動詞開頭等返回布爾值類型的函數用等合乎邏輯不用擔心太長變量類型透明化方法一初始化，如下推薦方法二匈牙利

代碼約定 可讀性

以下地方需要進行注釋：

函數和方法：注釋參數代表什么，是否有返回值；

大段代碼：描述任務的注釋；

復雜的算法；

Hack

變量和函數命名

變量用名詞；

函數名用動詞開頭：getName()等；

返回布爾值類型的函數用isEnable()等；

合乎邏輯不用擔心太長；

變量類型透明化

方法一：初始化，如下：()推薦)

var isFound = false; //boolean
var name = ""; //String
var num = 0; //Number
var person = null; //Object

方法二：匈牙利標記法

var bIsFound; //boolean
var sName; //String
var nNum; //Number
var oPerson; //Object

方法三：使用類型注釋

var bIsFound /*boolean*/ = false;
var sName /*string*/ = "";
var nNum /*number*/ = 0;
var oPerson /*object*/ = null;

松散耦合 HTML/JavaScript

應該通過引用外部文件和使用DOM附加行為來包含js代碼

CSS/JavaScript

應該通過動態更改樣式的類（className）而非特定樣式來實現

編程習慣 尊重對象所有權

不要修改和編輯不屬于你的對象，以及js原生類型對象

避免全局量

盡量避免全局變量和函數：

var name = "";
function setName(value) {
    name = value;
}
function sayName() {
    console.log(name);
}

上面的代碼應該包含在一個對象中：

var setPersonName = {
    name: "",
    setName: function (value) {
        this.name = value;
    },
    sayName: function () {
        console.log(this.name);
    }
};
setPersonName.setName("Oli");
setPersonName.sayName(); //Oli

使用命名空間

使用多個命名空間，其中的內容互不干擾：

//全局對象
var Wrox = {};
//一個命名空間
Wrox.ProAjax = {};
Wrox.ProAjax.EventUtil = {};
Wrox.ProAjax.CookieUtil = {};
//另一個命名空間
Wrox.ProJS = {};
Wrox.ProJS.EventUtil = {};
Wrox.ProJS.CookieUtil = {};

避免與null比較

當看到了與null比較的代碼，應該用以下技術替換：

引用類型，用instanceof等；

基本類型，用typeof等；

使用常量

（略）

GPU云服務器云服務器 JavaScript代碼優化選云服務器的幾個注意和需求服務器云端部署技術要點云主機的要點

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/78940.html

JavaScript 代碼優化和部署——“性能和部署”的注意要點

摘要：注意作用域避免全局查找以上代碼應該修改如下避免語句必須使用語句的情況很少，因為它主要用于消除額外的字符。將代碼分離稱多個文件只是為了提高可維護性，并非為了部署。要進行部署的時候，需要將這些源代碼合并為一個或幾個歸并文件。注意作用域避免全局查找 function updateUI () { var images = document.getElementsByTagName(...

Baaaan 2019-08-19 17:54 評論0 收藏0
記一次前端項目重構要點總結

摘要：重構總共耗時個工作日。第一個重構原因就是沒有引入靜態類型，導致查看一個對象結構需要翻來覆去在多個文件中查找。第三是各個狀態模塊耦合度高，加大了代碼維護難度。但如果耦合度過高，往往是因為模塊沒有細分到位。這個項目也不列外。 showImg(https://segmentfault.com/img/remote/1460000019660483); 不知不覺已是2019年的7月，恍惚之間已...

frolc 2019-08-23 18:29 評論0 收藏0
[譯] 唯快不破：Web 應用的 13 個優化步驟

摘要：譯文地址譯唯快不破應用的個優化步驟前端的逆襲知乎專欄原文地址時過境遷，應用比以往任何時候都更具交互性。使用負載均衡方案我們在之前討論緩存的時候簡要提到了內容分發網絡。換句話說，元素的串形訪問會削弱負載均衡器以最佳形式歡迎關注知乎專欄 —— 前端的逆襲歡迎關注我的博客，知乎，GitHub。譯文地址：【譯】唯快不破：Web 應用的 13 個優化步驟 - 前端的逆襲 - 知乎專欄原文地...

haobowd 2019-08-19 18:37 評論0 收藏0