可优化代码集锦

本文主要记录工作中遇到的一些可优化的代码集锦

• 代码写得是否垃圾并不以是否使用了最新的api为准，如var(是否禁用var视使用环境而定，在非构建环境下且要兼容ie时必须使用var，所以使用了var并不代表写的垃圾，但如果const与var混用则属垃圾代码）

代码规则

我认为的好代码

• 命名规范，见名知意，
• 命名规则不混淆（如驼峰和下划线混合，一下用驼峰一下又不用驼峰命名）
• 代码复用性高，多抽象封装而不是到处随意复制黏贴，
• 简洁又不失可读性，不能以牺牲可读性的代价去简化代码（为了简洁，代码强行压缩到一行；如：多层if else使用三元运算符代替，导致一堆三元表达式，哪个配哪个都难以看出来）
• 使用新特性（在兼容性容许的情况下，否则不如不用）

待补充...

有句话说的好

小白都读懂的代码才是好代码

但是也不可能真按小白的标准去写。如果有个特性好用，但小白不知道，我不可能要迁就小白就不去用。

就算是我自己也不是每时每刻都能按照这个要求去写代码，偶尔也会犯糊涂，但是我会以这个要求去规范自己的代码，让自己的代码写得更加优雅。

代码1

var self = this;
self.searchBox.shopwordText = self.searchBox.shopwordtext;
...

有4处可修改的地方：

1. 多余的self，直接使用this即可
2. shopwordText shopwordtext两处易混淆
3. 驼峰命名法太过随意
4. 可用const代替var

代码2

 if(data.length < 20) {
      self.loadmsg = false;
      self.loadshow = false;
 } else {
      self.loadmsg = true;
      self.loadshow = true;
}

优化

self.loadmsg = self.loadshow  = data.length >= 20;

待验证：self.loadmsg = self.loadshow的时候是否会把vue的钩子一同赋值？

代码3

function isActiveAccountTb() {
        return (this.activeAccountTabType == platform.tb || this.activeAccountTabType == platform.elm) ? true : false;
}

优化

function isActiveAccountTb() {
        return this.activeAccountTabType == platform.tb || this.activeAccountTabType == platform.elm;
}

或
上面的返回的只是两个值中的一个，大部分情况下够用了，但是有些情况下可能并不准确，下面则把它们转换为bool值

function isActiveAccountTb() {
        return Boolean(this.activeAccountTabType == platform.tb || this.activeAccountTabType == platform.elm);
}

代码4

var that = this;
that.orderStatus.value = item.value;
that.orderStatus.name = item.label;
this.getListData();

滥用that

代码5

if(this.navType == 7 || this.navType == 12) {
    var title = item.activity_name;
} else {
    var title = item.itemtitle;
}
;

1. 多余的;
2. 重复声明title
3. 声明在条件内部

优化后

var title = this.navType == 7 || this.navType == 12 ? item.activity_name : item.itemtitle;