javascript - js中 this的問題

Question

js小白遇到的問題先上程式碼{程式碼...} 輸出的結果是undefined 我的問題是1. return裡面的getName的function是不是匿名函數我現在理解的是匿名函數那麼這個this應該就是指向全局吧？就是window 那為啥不輸出john...

typecho · Answer

這個問題需要一步一步看，首先是myObject是一個對象，上面有個屬性是getName，值是一個匿名函數，alert(myObject.getName());，就是這個對像在呼叫這個方法，所有這個時候的this就是undefined。

//
var name = "John";

var myObject = function() {

    return {
        getName: function() {
            return this.name;
        }
    }
}();

var f = myObject.getName;

alert(f()); //John

// 这样就返回的是John,因为这个时候的getName是在全局执行的，this指向的就是window。

var name = "John";

var myObject = function() {

    return {
        getName: () => {
            return this.name;
        }
    }
}();

alert(myObject.getName()); //John

// 也可以通过es6修正this的指向

再次做下擴展，看下面的程式碼

    var object = {
        name: 'lucy',
        getName: function() {
            return function () {
                return this.name
            }
        }
    }
 console.log(object.getName()()) //John

object.getName(）方法回傳的是匿名函數，執行環境是全域作用域，this的指向基於函數的執行作用域所以是window，這時候window.name是John。
如果我們想回傳lucy，就需要透過建立一個箭頭函數或是閉包來實現。

var object = {
    name: 'lucy',
    getName: function() { console.log(this)
        return  () => {
            return this.name
        }
    }
}
 console.log(object.getName()()) //lucy
 
 var object = {
    name: 'lucy',
    getName: function() {
        var that = this;
        return function () {
            return that.name
        }
    }
}
 console.log(object.getName()()) //lucy

箭頭函數體內的this對象，就是定義時所在的對象，而不是使用時所在的對象。

至於你說的調試this指向改變問題，是因為匿名函數原本的作用域是window，但當執行的時候是myObject調用了它，所以this在那一刻指向了myObject。

为情所困 · Answer

var name = "John";

var myObject = function() {

    return {
        getName: function() {
            return this.name;
        }, 
        name: 'eczn'
    }
}();

myObject.getName(); 
// => 
// "eczn"

getName 的 this 指的是 myObject，因為 getName 直接是 myObject 所呼叫的，所以這裡的 this 指的是 ———— 一個指的是 ————那個

为情所困 · Answer

myObject.getName()
通常情況下誰呼叫了某個函數，這個函數中的this就指向誰啦

javascript - js中 this的問題

全部回覆(3)我來回復