Effective JavaScript ：第二章

Posted 2020-07-06

1.熟练掌握闭包

理解闭包要学会三个基本的事实：

①JavaScript允许你引用在当前函数以外定义的变量；

例如：

function makeSandwich(){
    var magicIngredient = ‘peanut butter’;
    function make(filling){
        return magicIngredient + ‘and’ + filling;
    }
    return make(‘jelly’);
}
makeSandwich();       //‘peanut butter and jelly’

②即使外部函数已经返回，当前函数仍然可以引用在外部函数所定义的变量；

function sandwichMaker(){
    var magicIngredient = ‘peanut butter’;
    function make(filling){
        return magicIngredient + ‘and’+filling;
    }
    return make;
}
var f = sandwichMaker();
f(‘jelly’);
f(‘bananas’);
f(‘marshmallows’);

f的值为内部的make函数，调用f实际上是调用make函数。

 

③闭包可以更新外部变量的值。

function box(){
    var val = undefined;
    return {
        set : function(newVal){ val = newVal; },
        get : function() { return val; },
        type : function(){ return typeof val;}
    };
}
val b = box();
b.type();
b.set(98.6);
b.get();
b.type();              

该例子产生了一个包含三个闭包的对象，这三个闭包是set、get和type属性。它们共享访问val变量。set闭包更新val的值，随后调用get和type查看更新结果。

 

3.解决JavaScript缺少块级作用域的方法：

①创建一个嵌套函数并立即调用它来强制创建一个局部作用域：

function wrapElements(a){
    var result = [];
    for(var i = 0 , n = a.length; i < n ; i ++){
        (function(){
            var j = i;
            result[i] = function(){ return a[j] ; };
        })();
    }
result result;
}    

②将作为形参的局部变量绑定到IIFE并将其值作为实参传入。

使用IIFE来创建局部作用域要小心，因为在函数中包裹代码块可能会导致代码块发生一些微妙的变化。首先，代码块不能包含任何跳出块的break语句和continue语句。因为在函数外使用break和continue是不合法的。其次，如果代码块引用了this或特别的arguments变量，IIFE将会改变它们的含义。

4.匿名函数和命名函数表达式的官方区别在于后者会绑定到与其函数名相同的变量上，该变量将作为该函数内的一个局部变量。命名函数表达式的真正用处是进行调试。

5.在系统中，避免对象污染函数表达式作用域的最好方式是避免任何时候在Object.prototype中添加属性，以及避免任何使用与标准Object.prototype属性同名的局部变量。

6.命名函数表达式会导致很多问题所以不值得使用。

7.编写可移植函数的最好方式是始终避免将函数声明置于局部块或子语句中。如果想编写嵌套函数声明，应该将它置于其父函数的最外层，如果你需要有条件地选择函数，最好的办法就是使用var声明和函数表达式来实现。

function f(){ return ‘global’; }
    function test(x){
        var g = f , result = [];
        if(x){
            g = function(){ return‘local’; }
        result.push(g());
        }
    result.push(g());
    return result;
}

 

这消除了内部变量作用域的神秘性。它无条件地作为局部变量被绑定，而仅仅只有赋值语句是有条件地。结果很明确，该函数完全可移植。

8.错误使用eval的方式：

①允许它干扰作用域。

调用eval函数会将参数作为JavaScript程序进行解释。但是该程序运行于调用者的局部作用域中，嵌入到程序的全局变量会被创建为调用程序的局部变量。

function test(x){
    eval(‘var  y = x ;’ );
    return y;
    }
test(‘hello’);  //‘hello’

 

保证eval函数不影响外部作用域的一个简单方法是在一个明确的嵌套作用域中运行它。

var y =‘global’；
function test（src）{
    (function () {eval(src);})();
    return y;
}
test (“var y = ‘local’;”);   //‘global’
test(“var z = ‘local’;”);   //‘global’

 

9.间接调用eval函数优于直接调用

eval函数具有访问调用它那时的整个作用域的能力。

直接调用eval:

var x = ‘global’;
    function test(){
        var x = ‘local’;
        return eval(‘x’);   
    }
test();   //‘local’；

间接调用eval：

var x = ‘global’;
    function test(){
        var x = ‘local’;
        var f = eval ;
        return f(‘x’) ;
    }
test() ；

绑定eval函数到另一个变量名，通过该变量名调用函数会使代码失去对所有局部作用域的访问能力。

编写间接调用eval函数的一种简洁方式是使用表达式序列运算符（，）和一个明显毫无意义的数字字面量。

(0, eval）（src）