前端开发小总结

减少多重if…else判断

为了后期测试调试方便，可以先分析业务，把多个if…else判断分成下面几个部分去分别判断：
1. 空值判断
2. 业务判断
3. 状态判断

立即执行函数

var a = 2;
(function IIFE(global) {
    var a = 3;
    console.log(a);  // 3
    console.log(global.a);  // 2
})(window);
console.log(a);  // 2

传入一个函数作为参数

var a = 2;
(function IIFE(def) {
    def(window);
})(function def(global) {
    var a = 3;
    console.log(a);  // 3
    console.log(global.a);  // 2
});

由于函数被包含在一对 ( ) 括号内部，因此成为了一个表达式，通过在末尾加上另外一个 ( ) 可以立即执行这个函数，比如 (function foo(){ .. })()。第一个 ( ) 将函数变成表达式，第二个 ( ) 执行了这个函数。
相较于传统的 IIFE 形式，很多人都更喜欢另一个改进的形式:(function(){ .. }())。仔 细观察其中的区别。第一种形式中函数表达式被包含在 ( ) 中，然后在后面用另一个 () 括 号来调用。第二种形式中用来调用的 () 括号被移进了用来包装的 ( ) 括号中。

try…catch会创建一个块级作用域

try {
    undefined();
} catch(err) {
    console.log(err);  // TypeError: undefined is not a function
    at test02.js:10
}
console.log(err);  
// 报错：Uncaught ReferenceError: err is not defined

变量提升

变量和函数声明会被提升到作用域的顶部，但是函数表达式不会被提升。同时，值得注意的细节是函数声明会首先被提升，然后才是变量。

foo();  // undefined
function foo() {
    console.log(a);
    var a = 2;
}

bar();  // 报错Uncaught TypeError: bar is not a function
var bar = function baz() {
    console.log(2);
}