javascript中this关键字详解(3)

var keith = { a: 'Hello', b: ['b1', 'b2'], c: function() { this.b.forEach(function(item) { console.log(this.a + ' ' + item); }, this) } }; keith.c(); //Hello b1 //Hello b2

3.3:避免回调函数中的this

回调函数中的this往往会改变指向。

var o = { f: function() { console.log(this === o); } }; o.f(); // true;

上面代码中,调用o对象的f方法,返回true。

但是,如果将f方法指定给某个按钮的click事件,this的指向就变了。

$('button').on('click',o.f);

上面代码中,使用了jquery方法来获取button元素,并绑定click事件。点击按钮后控制台会显示false。原因是此时this不再指向o对象了,而是指向按钮的DOM对象,因为f方法是在按钮对象的环境中被调用的。

总结一下:

a:如果想要多层嵌套this关键字,最常用的解决方法就是使用that变量,固定指向外层的this,然后在内层中使用that变量。就不会发生内层this指向全局的问题。

b:如果在回调函数中使用this关键字,注意this的指向问题。

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wwfjgw.html