函数：作用域、闭包

问题

1、变量提升

知识点变量定义、函数声明、函数表达式

2、说明一下this的几种不同使用场景

3、创建10个<a>标签，点击的时候弹出对应序号

//错误写法
var i,a;
for(i=0; i<10; i++){
    a =document.creatElement('a');
    a.innnerHTML = i + '<br>'
    a.addEventListenter('click',function(e){
        e.preventDefault();
        alert(i);
    });
    document.body.appedChild(a);
}

//正确写法
var i;
for(i=0; i<10; i++){
    (function(i){
        a =document.creatElement('a');
        a.innnerHTML = i + '<br>'
        a.addEventListenter('click',function(e){
            e.preventDefault();
            alert(i);
        });
        document.body.appedChild(a);
    })(i);
}

4、如何理解作用域

全局作用域、函数作用域、作用域链、闭包

5、实际开发中闭包的应用

//闭包实际中应用主要用于封装变量，收敛权限
function isFirstLoad(){
    var _list = []; //封装变量，外界无妨访问
    return functon(id){
        if(_list.indexOf(id)>=0){
            return false;
        } else {
            _list.push(id)
            return true;
        }
    }
}
var firstLoad = isFIrstLoad();
firstLoad(10); //true
firstLoad(10); //false
firstLoad(20); //true

知识点

1、执行上下文

2、this

• this执行时才能确认值，定义时无法确认

var a = {
    name: "A",
    fn: function(){
        console.log(this.name);
    }
}
a.fn(); //"A" ,              this === a
a.fn.call({name:"B"}) //"B", this === {name:"B"}
var fn1 = a.fn
fn1(); //                    this === window

• 使用场景
  • 作为造函数执行
  • 作为对象属性执行
  • 作为普通执行函数
  • call apply bind

3、作用域

• JS没有块级作用域
• 有函数作用域和全局作用域

4、作用域链

5、闭包

• 闭包的使用场景

  • 函数作为返回值

    function F1(){
        var a = 100;
        //返回一个函数
        return function(){
            console.loe(a); //a是自由变量，在父作用域中找
        }
    }
    var f1 = F1();
    var a = 200;
    f1(); // 100    作用域不变，还是函数定义时的作用域
    

  • 函数作为参数传递

    function F1(){
        var a = 100;
        //返回一个函数
        return function(){
            console.loe(a); //a是自由变量，在父作用域中找
        }
    }
    function F2(fn){
        var a = 200;
        fn();
    }
    var f1 = F1();
    F2(f1); //100
    

6、函数声明和函数表达式

fn1() //可执行
function fn1(){
###     //函数声明，函数声明会提升，可以在函数声明前执行函数
}

fn2() //undefine
var fn2 = function(){
    //函数表达式，变量提升，但fn在此之前是undefine，不能在表达式前执行函数
}