函数表达式

函数表达式和函数声明的区别

• 函数声明提升（function declaration hoisting），意思是在执行代码之前会先读取函数声明。这就意味着可以把函数声明放在调用它的语句后面。
• 函数表达式有的是变量声明提升。

sayHi(); // 正常弹出Hi
function sayHi(){
  alert("Hi!");
} 

sayHi1();// 报错 sayHi1 is not a function
var sayHi1 = function(){
  alert("Hi!");
}

递归

递归函数是在一个函数通过名字调用自身的情况下构成的。如下所示的阶乘函数和斐波那契数列求第n项值。

function fn(num){
  return num <=1 ? 1 : num * fn(num-1)
}
//  fn(5) = 120  --  5*4*3*2*1
function fn2(n){
  return n > 2 ? fn2(n-1) + fn2(n-2) : 1 
}
// fn(8) = 21 -- 1 1 2 3 5 8 13 21

需要注意的是，在函数内部调用函数本身，是使用函数名，这个函数名此时是一个全局变量，一旦被置空，则递归时则会报错。

var anotherFactorial = fn;
fn = null;
alert(anotherFactorial(4)); //出错！

可以使用arguments.callee来解决这个问题

function fn(num){
  return num <=1 ? 1 : num * arguments.callee(num-1)
}

而在严格模式下，不能访问arguments.callee，可以使用命名函数表达式来解决这个问题。外部通过变量factorial来访问，内部通过fn来访问

var factorial = function fn (num)  {
    return num <=1 ? 1 : num * fn(num-1)
}

• caller属性

这个属性中保存着调用当前函数的函数的引用，如果是在全局作用域中调用当前函数，它的值为null。

function outer(){
    inner();
}
function inner(){
    alert(inner.caller);// 会弹出outer函数的函数体
    // alert(arguments.callee.caller)  与上一样  耦合性更低
}
outer(); 

尾递归

尾递归会比普通的线性递归多一个参数，这个参数同时还是最终结果，相当于最后不需要在每次递归结果后再去计算，之前的阶乘函数和斐波那契数列可以用尾递归来实现。

function fn(n,res=1){
   return n<=1 ? res : fn(n-1,n*res)
}

function fn2(n,a=0,b=1){
  return n > 2 ? fn2(n-1,b,a+b) : b
}

如下两张图对比，尾递归一定程度是比普通递归更优的。

递归.jpg

尾递归.png

闭包

• 闭包是指有权访问另一个函数作用域中的变量的函数。创建闭包的常见方式，就是在一个函数内部创建另一个函数。（创建一个不被销毁的私有作用域）

• 函数中的局部变量，只在函数执行的过程中存在，而全局变量则始终存在（除非关闭浏览器窗口），而有一种场景，我们希望即不污染全局作用域，也让局部变量拥有记忆功能（不被销毁），这时候就需要使用闭包，在外层函数内部返回一个函数（内层函数），用一个全局变量去挂钩这个内层函数，如果内层函数如果使用了外层函数中的变量，在全局变量永不销毁的情况下，跟它挂钩的内层函数也永远不会被销毁，内层函数中使用的外层函数的局部变量自然也不会被销毁，作用域一直存在。

• 作用域链本质上是一个指向变量对象的指针列表，它只引用但不实际包含变量对象。无论什么时候在函数中访问一个变量时，就会从作用域链中搜索具有相应名字的变量。一般来讲，当函数执行完毕后，局部活动对象就会被销毁，内存中仅保存全局作用域（全局执行环境的变量对象）。但是，闭包的情况又有所不同。在另一个函数内部定义的函数会将包含函数（即外部函数）的活动对象添加到它的作用域链中。（所以简单的内层函数会包含本地活动对象，外部函数活动对象，全局变量对象）

function outer() {
    var i = 0;
    var inner = function(){
        i++;
        console.log(i)
    }
    return inner
}
var a = outer()
a(); // 1
a(); // 2 inner相当于被全局变量a一直挂钩，所以inner的作用域一直存在。

由于闭包会携带包含它的函数的作用域，因此会比其他函数占用更多的内存。过度使用闭包可能会导致内存占用过多，我们建议读者只在绝对必要时再考虑使用闭包。

• 作用域链的这种配置机制引出了一个值得注意的副作用，即闭包只能取得包含函数中任何变量的最后一个值，可以使用IIFE（立即执行函数）来解决这一弊端。
• 使用立即执行函数的好处：通过定义一个匿名函数，创建了一个新的函数作用域，相当于创建了一个“私有”的命名空间，该命名空间的变量和方法，不会破坏污染全局的命名空间。此时若是想访问全局对象，将全局对象以参数形式传进去即可。

function createFunctions(){
    var result = new Array();
    for (var i=0; i < 10; i++){
        result[i] = function(){
            return i;
        };
    }
    return result;
}
var newArr = createFunctions();
console.log(newArr[0]())  // 10 ，此时的i只记住了i最终的值。
//  result这个数组是一个由10个函数组成的数组
//  每个函数都返回了10，期望是每个函数按照下标索引返回0-9；


function createFunctions(){
    var result = new Array();
    for (var i=0; i < 10; i++){
      result[i] = (function(num){
           return num 
      })(i);
    }
    return result; // [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
}

闭包与this对象

var name = "The Window";
var object = {
    name : "My Object",
    getNameFunc : function(){
        console.log(this.name) //  "My Object", 此时this指向object
        return function(){
        // 这里的this已经指向已经改变了
        // 使用object.getNameFunc()可以返回这个匿名函数
        // 此时的this就会指向调用这个匿名函数的对象
            return this.name;
        };
    }
};
alert(object.getNameFunc()()); //"The Window"（在非严格模式下）
// 等同于 alert弹出 function(){return this.name;}();

针对这种情况，可以将外部函数的this用内部函数能访问到的局部变量存储起来。

var name = "The Window";
var object = {
    name : "My Object",
    getNameFunc : function(){
        var that = this
        return function(){
            return that.name;
        };
    }
};
alert(object.getNameFunc()()); //"My Object"

内存泄漏

如果闭包的作用域链中保存着一个HTML 元素，那么就意味着该元素将无法被销毁。

function assignHandler(){
    var element = document.getElementById("someElement");
    element.onclick = function(){
        alert(element.id);
    };
}

由于匿名函数保存了一个对assignHandler()的活动对象element.id的引用，因此就会导致无法减少element的引用数。只要匿名函数存在，element 的引用数至少也是1，因此它所占用的内存就永远不会被回收。就造成了内存泄漏

function assignHandler(){
    var element = document.getElementById("someElement");
    var id = element.id;
    element.onclick = function(){
        alert(id);
    };
    element = null;
}

在上面的代码中，通过把element.id的一个副本保存在一个变量中，并且在闭包中引用该变量消除了循环引用。但仅仅做到这一步，还是不能解决内存泄漏的问题。必须要记住：闭包会引用包含函数的整个活动对象，而其中包含着element。即使闭包不直接引用element，包含函数的活动对象中也仍然会保存一个引用。因此，有必要把element 变量设置为null。这样就能够解除对DOM对象的引用，顺利地减少其引用数，确保正常回收其占用的内存。

IIFE(立即执行函数)

定义并立即调用了一个匿名函数。将函数声明包含在一对圆括号中，表示它实际上是一个函数声明。而紧随其后的另一对圆括号会立即调用这个函数。这样就构建了一个私有作用域。

(function(){
  //这里是块级作用域
})();

下面的例子，就可以看出IIFE的优势了。

(function() {
    var i = 0;
    i++;
    console.log(i)
})()

这种做法可以减少闭包占用的内存问题，因为没有指向匿名函数的引用。只要函数执行完毕，就可以立即销毁其作用域链了，即用即毁。

模块模式

单例创建私有变量和特权方法。所谓单例（singleton），指的就是只有一个实例的对象。JavaScript 是以对象字面量的方式来创建单例对象的。

var singleton = {
    name : value,
    method : function () {
        //这里是方法的代码
    }
};

模块模式通过为单例添加私有变量和特权方法能够使其得到增强

var singleton = function(){
    //私有变量和私有函数
    var a = 10;
    function fn(){
        return false;
    }
    return {
        b: true,
        fn2 : function(){
            a++;
            return fn();
        }
    };
 }()   // 立即执行函数

返回的对象字面量中只包含可以公开的属性和方法，由于这个对象是在匿名函数内部定义的，因此它的公有方法有权访问私有变量和函数。从本质上来讲，这个对象字面量定义的是单例的公共接口。
又比如

var application = function(){
    //私有变量和函数
    var components = new Array();
    //初始化
    components.push(new BaseComponent());
    //公共
    return {
        getComponentCount : function(){
            return components.length;
        },
        registerComponent : function(component){
            if (typeof component == "object"){
                components.push(component);
            }
        }
    };
}();

在创建这个用于管理组件的对象的过程中，首先声明了一个私有的components数组，并。而返回对象的getComponentCount()和registerComponent()方法，都是有权访问数组components的特权方法。前者只是返回已注册的组件数目，后者用于注册新组件。
简言之，如果必须创建一个对象并以某些数据对其进行初始化，同时还要公开一些能够访问这些私有数据的方法，那么就可以使用模块模式。模块化开发

如果前面演示模块模式的例子中的application 对象必须BaseComponent 的实例，那么就可以使用以下代码。

var application = function(){
    //私有变量和函数
    var components = new Array();
    //初始化
    components.push(new BaseComponent());
    //创建application 的一个局部副本
    var app = new BaseComponent();
    //公共接口
    app.getComponentCount = function(){
        return components.length;
    },
    app.registerComponent = function(component){
        if (typeof component == "object"){
            components.push(component);
        }
    }
    return app
}();

在这个重写后的应用程序（application）单例中，首先也是像前面例子中一样定义了私有变量。主要的不同之处在于命名变量app的创建过程，因为它必须是BaseComponent 的实例。这个实例实际上是application 对象的局部变量版。此后，我们又为app对象添加了能够访问私有变量的公有方法。最后一步是返回app对象，结果仍然是将它赋值给全局变量application。

小结

1、当在函数内部定义了其他函数时，就创建了闭包。闭包有权访问包含函数内部的所有变量，原理如下。

• 在后台执行环境中，闭包的作用域链包含着它自己的作用域、包含函数的作用域和全局作用域。
• 通常，函数的作用域及其所有变量都会在函数执行结束后被销毁。但是，当函数返回了一个闭包时，这个函数的作用域将会一直在内存中保存到闭包不存在为止。

2、使用闭包可以在JavaScript 中模仿块级作用域(IIFE)，要点如下。

• 创建并立即调用一个函数，这样既可以执行其中的代码，又不会在内存中留下对该函数的引用。结果就是函数内部的所有变量都会被立即销毁——除非将某些变量赋值给了包含作用域（即外部作用域）中的变量。

3、闭包还可以用于在对象中创建私有变量，相关概念和要点如下。

• 即使JavaScript 中没有正式的私有对象属性的概念，但可以使用闭包来实现公有方法，而通过公有方法可以访问在包含作用域中定义的变量。
• 有权访问私有变量的公有方法叫做特权方法。可以使用构造函数模式(利用this)、原型模式(使用prototype)来实现自定义类型的特权方法，也可以使用模块模式、增强的模块模式来实现单例的特权方法。

JavaScript 中的函数表达式和闭包都是极其有用的特性，利用它们可以实现很多功能。不过，因为创建闭包必须维护额外的作用域，所以过度使用它们可能会占用大量内存。