幾個例子深刻理解this

  /*this:
  * 1. 解析器在每次調用函數的時候都會傳遞一個隱含參數this,指向一個對象(稱爲函數執行的上下文對象)
  * 2. 任何函數本質上都是通過某個對象來調用的,如果沒有指定,則這個對象爲window
  * 3. 以方法的形式調用,this就指向調用方法的那個對象*/
  
  /*總結:
  * 1. test() window
  * 2. p.test() p
  * 3. new test() 新創建的對象
  * 4. p.call/apply(obj) obj
  * */
  var name = '全局name' //var有變量提升,window中有name,換成let const window中無name
  function fun(){
    console.log(this.name)
  }

  let obj = {
    name: "obj裏name",
    getName: fun
  }
  fun()
  obj.getName()

  function Fun(name) {
    console.log(this)
    this.name = name

    this.getName = function(){
      console.log(this)
      return this.name
    }

    this.setName = function(name){
      console.log(this)
      this.name = name
    }
  }

  Fun('li') //this爲window
  let p = new Fun() //此語句會執行,this爲新創建的對象Fun,而p指向這個對象,所以也能說指向p
  p.getName() //Fun對象(p) p.getName獲得getName這個函數
  let obj = {}
  p.setName.call(obj,'wang')  //obj
  let x = p.setName() //Fun對象(p)
  let y = p.setName
  y() //window

  function f1(){
    function f2(){
      console.log(this)
    }
    f2()
  }
  f1()  //f1()其實就是執行f2(),而f2()沒有調用,所以爲window
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章