web前端 - 写出漂亮JavaScript代码的实用技巧

1、按强类型风格写代码
js是弱类型的，但是写代码的时候不能太随意，写得太随意也体现了编码风格不好。下面分点说明：

（1）定义变量的时候要指明类型，告诉JS解释器这个变量是什么数据类型的，而不要让解释器去猜，例如不好的写法：

var num,
str,
obj;
声明了三个变量，但其实没什么用，因为解释器不知道它们是什么类型的，好的写法应该是这样的：

var num =0,
str =’’,
obj =null;
定义变量的时候就给他一个默认值，这样不仅方便了解释器，也方便了阅读代码的人，他会在心里有数——知道这些变量可能会当作什么用。

（2）不要随意地改变变量的类型，例如下面代码：

var num =5;
num ="-"+ num;
第1行它是一个整型，第2行它变成了一个字符串。因为JS最终都会被解释成汇编的语言，汇编语言变量的类型肯定是要确定的，你把一个整型的改成了字符串，那解释器就得做一些额外的处理。

并且这种编码风格是不提倡的，有一个变量第1行是一个整型，第10行变成了一个字符串，第20行又变成了一个object，这样就让阅读代码的人比较困惑，上面明明是一个整数，怎么突然又变成一个字符串了。好的写法应该是再定义一个字符串的变量：

var num =5;
var sign ="-"+ num;
（3）函数的返回类型应该是要确定的，例如下面不确定的写法：

function getPrice(count){
if(count <0)return"";
elsereturn count *100;
}
getPrice这个函数有可能返回一个整数，也有可能返回一个空的字符串。这样写也不太好，虽然它是符合JS语法的，但这种编码风格是不好的。

使用你这个函数的人会有点无所适从，不敢直接进行加减乘除，因为如果返回字符串进行运算的话值就是NaN了。函数的返回类型应该是要确定的，如下面是返回整型：

function getPrice(count){
if(count <0)return-1;
elsereturn count *100;
}
然后告诉使用者，如果返回-1就表示不合法。如果类型确定，解释器也不用去做一些额外的工作，可以加快运行速度。

2、减少作用域查找
（1）不要让代码暴露在全局作用域下

例如以下运行在全局作用域的代码：

有时候你需要在页面直接写一个script，要注意在一个script标签里面，代码的上下文都是全局作用域的，由于全局作用域比较复杂，查找比较慢。

例如上面的map变量，第二行在使用的时候，需要在全局作用域查找一下这个变量，假设map是在一个循环里面使用，那可能就会有效率问题了。

所以应该要把它搞成一个局部的作用域：

上面用了一个function制造一个局部作用域，也可以用ES6的块级作用域。

由于map这个变量直接在当前的局部作用域命中了，所以就不用再往上一级的作用域（这里是全局作用域）查找了，而局部作用域的查找是很快的。同时直接在全局作用域定义变量，会污染window对象。

（2）不要滥用闭包

闭包的作用在于可以让子级作用域使用它父级作用域的变量，同时这些变量在不同的闭包是不可见的。

这样就导致了在查找某个变量的时候，如果当前作用域找不到，就得往它的父级作用域查找，一级一级地往上直到找到了，或者到了全局作用域还没找到。

因此如果闭包嵌套得越深，那么变量查找的时间就