高阶函数、闭包、递归

1. 高阶函数 ***

高阶函数是对其他函数进行操作的函数，它接收函数作为参数或将函数作为返回值输出

如下：

• 此时fn 就是一个高阶函数

• 函数也是一种数据类型，同样可以作为参数，传递给另外一个参数使用。最典型的就是作为回调函数。

• 同理函数也可以作为返回值传递回来

2. 闭包 ***

2.1 变量的作用域复习

变量根据作用域的不同分为两种：全局变量和局部变量

1. 函数内部可以使用全局变量
2. 函数外部不可以使用局部变量
3. 当函数执行完毕，本作用域内的局部变量会销毁

2.2 什么是闭包

• 闭包（closure）指有权访问另一个函数作用域中变量的函数
• 简单理解就是 ，一个作用域可以访问另外一个函数内部的局部变量
  
  如上述代码，理解闭包：fn2内部是一个作用域，那么fn2访问了另一个函数内部的局部变量，那么这个局部变量所在函数就叫做闭包函数，所以此时fn1就是闭包函数。

闭包形成的两个关键点：

1. 函数嵌套
2. 内部函数使用外部函数的局部变量（将外部函数称之为闭包函数）

2.3 闭包的作用

作用：延伸变量的作用范围。（使得fn外部的作用域访问num）

 function fn() {
   var num = 10;
   function fun() {
       console.log(num);
 	}
    return fun;//将内部函数返回，不调用
 }
var f = fn();//fn调用完毕，正常理解num就需要消耗，但是fn如果是一个闭包函数，就不会消耗，因为fun要使用，只用fun调用完毕才消耗
f();//调用内部函数fun，打印num，此时就是在fn外部访问了num

2.4 闭包的案例

1. 闭包应用——利用闭包的方式得到当前li 的索引号

for (var i = 0; i < lis.length; i++) {
// 利用for循环创建了4个立即执行函数
// 立即执行函数也成为小闭包，因为立即执行函数里面的任何一个函数都可以使用它的i这变量
(function(i) {
    lis[i].onclick = function() {
      console.log(i);
    }
 })(i);
}
//理解：
//for循环创建了四个立即执行函数，每个立即执行函数都有一个局部变量i，并且值不一样，是0,1,2,3
//当我们点击li的时候，li的onclick执行，内部要访问i，此时就访问到它所在的立即执行函数的局部变量i

2. 闭包应用——3秒钟之后,打印所有li元素的内容

 for (var i = 0; i < lis.length; i++) {
   (function(i) {
     setTimeout(function() {
     	console.log(lis[i].innerHTML);//理解：i访问的是立即执行函数的局部变量i
     }, 3000)
   })(i);
}

3. 闭包应用——计算打车价格

   需求分析：

   • 打车起步价13(3公里内)，之后每多一公里增加 5块钱

   • 用户输入公里数就可以计算打车价格

   • 如果有拥堵情况，总价格多收取10块钱拥堵费

 var car = (function() {
     var start = 13; // 起步价  局部变量
     var total = 0; // 总价  局部变量
     return {
       // 正常的总价
       price: function(n) {
         if (n <= 3) {
           total = start;
         } else {
           total = start + (n - 3) * 5
         }
         return total;
       },
       // 拥堵之后的费用
       yd: function(flag) {
         return flag ? total + 10 : total;
       }
	}
 })();
console.log(car.price(5)); // 23
console.log(car.yd(true)); // 33

2.5 案例

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

3. 递归

3.1 什么是递归

• 递归：如果一个函数在内部可以调用其本身，那么这个函数就是递归函数
• 简单理解：函数内部自己调用自己，这个函数就是递归函数
• **注意：**递归函数的作用和循环效果一样
• 由于递归很容易发生“栈溢出”错误（stack overflow），所以必须要加退出条件return
• 代码：

var num = 1;

function fn() {
    console.log('我要打印6句话');

    if (num == 6) {
        return; // 递归里面必须加退出条件
    }
    num++;
    fn();//fn自己调用自己，fn就是递归函数
}
fn();

3.2 利用递归求1~n的阶乘

n的阶乘：1到n之间所有数相乘，就是n的阶乘。

//利用递归函数求1~n的阶乘 1 * 2 * 3 * 4 * ..n
 function fn(n) {
     if (n == 1) { //结束条件
       return 1;
     }
     return n * fn(n - 1);
 }
 console.log(fn(3));
//详细思路 以3为例
//return  3 * fn(2)
//return  3 * (2 * fn(1))
//return  3 * (2 * 1)
//return  3 * (2)
//return  6

3.3 利用递归求斐波那契数列

斐波那契数列介绍：

// 利用递归函数求斐波那契数列(兔子序列)  1、1、2、3、5、8、13、21...
// 用户输入一个数字 n 就可以求出 这个数字对应的兔子序列值
// 我们只需要知道用户输入的n 的前面两项(n-1 n-2)就可以计算出n 对应的序列值
function fb(n) {
  if (n === 1 || n === 2) {
        return 1;
  }
  return fb(n - 1) + fb(n - 2);
}
console.log(fb(3));

3.4 利用递归遍历数据

    <script>
        var data = [{
            id: 1,
            name: '家电',
            goods: [{
                id: 11,
                gname: '冰箱',
                goods: [{
                        id: 111,
                        gname: '海尔'
                    }, {
                        id: 112,
                        gname: '美的'
                    },

                ]

            }, {
                id: 12,
                gname: '洗衣机'
            }]
        }, {
            id: 2,
            name: '服饰'
        }];
        // 我们想要做输入id号,就可以返回的数据对象
        // 1. 利用 forEach 去遍历里面的每一个对象
        function getID(json, id) {
            var o = {};
            json.forEach(function(item) {
                // console.log(item); // 2个数组元素
                if (item.id == id) {
                    // console.log(item);
                    o = item;
                    return o;
                    // 2. 我们想要得里层的数据 11 12 可以利用递归函数
                    // 里面应该有goods这个数组并且数组的长度不为 0 
                } else if (item.goods && item.goods.length > 0) {
                    o = getID(item.goods, id);
                }


            });
            return o;
        }
        console.log(getID(data, 1));
        console.log(getID(data, 2));
        console.log(getID(data, 11));
        console.log(getID(data, 12));
        console.log(getID(data, 111));
    </script>