源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

实例讲解JavaScript中的this指向错误解决方法

  • 时间:2022-07-25 11:07 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:实例讲解JavaScript中的this指向错误解决方法
看如下对象定义:
'use strict'
var jane = {
  name : ‘Jane',
  display : function(){
    retrun 'Person named ' + this.name;
  }
};
这样能正常调用
jane.display();
下面的调用会出错:
var func = jane.display;
func()
TypeError: Cannot read property 'name' of undefined
因为,this指向已经改变,正确的方式如下:
var func2 = jane.display.bind(jane);
func2()
'Penson named Jane'
所有函数都有其特殊的this变量,如下面的forEach
var jane = {
  name : 'Jane',
  friends: ['Tarzan', 'Cheeta'],
  sayHiToFriends: function(){
    'use strict';
    this.friends.forEach(function(friend) {
      // 'this' is undefined here
      console.log(this.name + ' says hi to '+ friend);
    });
  }
}  
调用sayHiToFriends会产生一个错误:
jane.sayHiToFriends()
TypeError: Cannot read property 'name' of undefined
[b]解决方案一:[/b]将this保存在不同的变量中
var jane = {
  name : 'Jane',
  friends: ['Tarzan', 'Cheeta'],
  sayHiToFriends: function(){
    'use strict';
    var that = this;
    this.friends.forEach(function(friend) {
      console.log(that.name + ' says hi to '+ friend);
    });
  }
} 
[b]解决方案二:[/b]利用forEach的第二个参数,它可以给this指定一个值
var jane = {
  name : 'Jane',
  friends: ['Tarzan', 'Cheeta'],
  sayHiToFriends: function(){
    'use strict';
    this.friends.forEach(function(friend) {
      console.log(this.name + ' says hi to '+ friend);
    }, this);
  }
} 
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部