javascript - js中 this的問題
問題描述
js小白 遇到的問題先上代碼
var name = 'John';var myObject = function() { return {getName: function() { return this.name;} }}();alert(myObject.getName());
輸出的結果是undefined 我的問題是1. return里面的getName的function是不是匿名函數 我現在理解的是匿名函數 那么這個this應該就是指向全局吧?就是window 那為啥不輸出john 2.讓我更困惑的是,我在調試時候一步步走,走到this.name的時候,this指向的是Object 而當輸出完undefined的時候,我在監視那里的this變成了window,this.name也變成了john,不太明白,求大蝦解救!
問題解答
回答1:這個問題需要一步一步看,首先是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。
回答2:var name = 'John';var myObject = function() { return {getName: function() { return this.name;}, name: ’eczn’ }}();myObject.getName(); // => // 'eczn'
getName 的 this 指的是 myObject,因為 getName 直接是 myObject 所調用的,所以這里的 this 指的是 ———— 調用函數的那個對象
回答3:myObject.getName()通常情況下誰調用了某個函數,這個函數中的this就指向誰啦
相關文章:
1. docker-compose中volumes的問題2. mysql 一個sql 返回多個總數3. CSS3 畫如下圖形4. 在mac下出現了兩個docker環境5. 如何用筆記本上的apache做微信開發的服務器6. angular.js - ionic2 瀏覽器跨域問題7. javascript - 螞蟻金服里的react Modal方法,是怎么把元素插入到頁面最后的8. android - rxjava merge 返回Object對象數據如何緩存9. docker 下面創建的IMAGE 他們的 ID 一樣?這個是怎么回事????10. python - Scrapy存在內存泄漏的問題。
