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

时间:2021-05-18

看如下对象定义:

'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

解决方案一:将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); }); }}

解决方案二:利用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); }}

声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。

相关文章