做用域和閉包

問題：

• 對變量提高的理解
• 說明this幾種不一樣的使用場景
• 建立10個<a>標籤，點擊的時候彈出對應的序號
• 如何理解做用域
• 實際開發中閉包的應用

知識點：

• 執行上下文

1. 範圍：一段<script>或者一個函數
2. 全局：變量定義、函數聲明 一段<script>  執行前
3. 函數：變量定義、函數聲明、this、arguments   函數   執行前

            注意「函數聲明」 function fn(){...}[會被前置] 和「函數表達式」的區別   var fn= function {...}

• this

1. this要在執行時才能確認值，定義時沒法確認

var a = {
      name:'A',
      fn:function(){
          console.log(this.name)
     }
}
//定義，何時執行，何時報錯
a.fn()  //this===a  執行結構 A
a.fn.call({name:'B'})  //this==={name:'B'} 執行結果 B
var fn1 = a.fn
fn1()  //this===window  執行結果undefined

/*this的執行場景*/
1.做爲構造函數執行
  function Foo(name){//this={};this.name = name;//return this};var f = new Foo('zhangsan')
2.做爲對象屬性執行
  var obj = {name:'A',printName:function(){console.log(this.name)}};obj.printName()
3.做爲普通函數執行  window
  function fn(){console.log(this)};fn()
4.call apply bind
  function fn1(name,age){alert(name);console.log(this)};fn1.call({x:100},'zhangsan')  
    //alert zhangsan, this==={x:100}
  apply 傳遞參數的方式不一樣
  var fn2 = function(name,age){alert(name);console.log(this)}.bind({y:200});fn2('zhangsan',20)
    //alert zhangsan,this==={y:200}　

• 做用域

1. JS沒有塊級做用域
2. 只有函數和全局做用域

• 做用域鏈

         

            函數在哪裏定義，父級做用域就在哪裏

• 閉包   

function F1(){
     var a=100
     //返回一個函數（函數做爲返回值）
     return function(){
         console.log(a)
     }
}
//f1獲得一個函數
var f1=F1()
var a=200
f1()    //100

　閉包的使用場景

1. 函數做爲返回值（demo）
2. 函數做爲參數傳遞  

         定義時的父級做用域　    

function F1(){
    var a=100
    return function(){
       console.log(a)
    }
}
var f1 = F1()
function F2(fn){
    var a=200
    fn()
}
F2(f1)      //100

　　

問題：

• 對變量提高的理解

          變量定義

          函數聲明（注意和函數表達式的區別）

• 說明this幾種不一樣的使用場景

          做爲構造函數執行

          做爲對象屬性執行

          做爲普通函數執行

          call apply  bind

• 建立10個<a>標籤，點擊的時候彈出對應的序號

          

          自執行函數，就是不用調用，只要定義完成，當即執行的函數

          i 在函數做用域內  

• 如何理解做用域

           自由變量

           做用域鏈，即自由變量的查找

           閉包的兩個場景

• 實際開發中閉包的應用