JavaScript 代码优化和部署——“可维护性”的注意要点

scwang90 发布于2019-08-19 17:53 / 390人阅读

摘要：代码约定可读性以下地方需要进行注释函数和方法注释参数代表什么，是否有返回值大段代码描述任务的注释复杂的算法变量和函数命名变量用名词函数名用动词开头等返回布尔值类型的函数用等合乎逻辑不用担心太长变量类型透明化方法一初始化，如下推荐方法二匈牙利

代码约定 可读性

以下地方需要进行注释：

函数和方法：注释参数代表什么，是否有返回值；

大段代码：描述任务的注释；

复杂的算法；

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代码优化选云服务器的几个注意和需求服务器云端部署技术要点云主机的要点

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/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