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 images顯示的鏡像過多,狗眼被亮瞎了,怎么辦?2. Java:密碼包(加密和解密)。無效的密鑰錯誤3. css - 微信小程序點擊展開,再次點擊收回4. 點擊頁面就自動輸入到mysql.求解5. macos - mac下docker如何設置代理6. css - vue.js的vue單文件組件style中的scoped屬性無效7. angular.js - 在ng-option 里使用過濾器無效8. node.js - 求問nw.js開發桌面版,其js計算性能如何?9. 我在centos容器里安裝docker,也就是在容器里安裝容器,報錯了?10. thinkphp5.1學習時遇到session問題
