美文网首页Web前端之路Web前端之路Web
what's this? 浅谈js中this的指向问题

what's this? 浅谈js中this的指向问题

作者: 爆裂边缘 | 来源:发表于2016-05-31 20:32 被阅读183次

刚刚学习js的朋友可能和我一样,看到代码中的this总是一脸懵逼,不知道this到底指向谁。经过一段时间的了解,我想跟大家分享下自己的理解。


懵逼

何时出现this

函数在调用的时候,会自动获得两个特殊变量:this和arguments,所以,函数可以调用this变量。

this指向谁?

通过一段时间的练习,我觉得可以总结为一句话:this指向他所在函数的作用域对象。如果函数是定义在全局作用域的,那么this指向window,如果函数被某个自定义对象调用,那么this就指向该对象。下面我们通过几个场景进行理解:

  1. 场景一:定义在全局作用域
function test(){
    alert(this);
   }
   test();

结果:


window全局对象
  1. 场景二:被某个对象调用
var O = {
    f : function(){
        alert(this);
    }
}
O.f();

结果:


返回调用该函数的对象
  1. 场景三:闭包
var object = {
    getThis : function(){
        return function(){
            return this;
        }
    }
}
alert(object.getThis()());

结果:


window对象
var object = {
    getThis : function(){
        var that = this;
        return function(){
            return that;
        }
    }
}
alert(object.getThis()());

结果:


object对象

对场景三的解释说明:大家都清楚闭包的一个特点是可以保留外部函数的变量对象,在场景三的第二个里,我们使用that保存了this的值,this指向object对象,所以that也指向object对象。

总结

其实this的问题并不复杂,我们只要记住,this指向函数所在作用域的作用域对象,然后平时多练习,就可以知道this指向谁了。

相关文章

  • what's this? 浅谈js中this的指向问题

    刚刚学习js的朋友可能和我一样,看到代码中的this总是一脸懵逼,不知道this到底指向谁。经过一段时间的了解,我...

  • 浅谈js中this的指向问题

    this最终指向的是调用它的那个对象 1、在普通函数里的this指向 例子1: 运行结果: 这里的this最终指向...

  • 浅谈JS中this指向

    1、全局环境下:this始终指向全局对象(window),无论是否严格模式 this永远指向的是最后调用它的对象,...

  • JS进阶篇-this指向问题

    JS中this的指向问题不同于其他语言,JS中的this不是指向定义它的位置,而是在哪里调用它就指向哪里。 JS中...

  • js中this指向问题

    this的指向在函数定义的时候是无法确定的,只有函数执行的时候才能确定this到底指向谁,实际this指向是调用他...

  • JS中this指向问题

    首先声明,添加删除线的都是不太确定的 下面我们分情况解释: 1、函数调用模式--当一个函数并非一个对象的属性时,那...

  • js中this指向问题?

    This是一个关键字,它代表函数运行时,自动生成的一个内部对象,只能在函数内部使用。 this 是在函数被调用时确...

  • js中this的指向问题

    this是Javascript语言的一个关键字它代表函数运行时,自动生成的一个内部对象,只能在函数内部使用,下面分...

  • js 中 this 的指向问题

  • JS中的this指向问题

    1. this的几种绑定方法 (1)普通函数中的this指向函数的调用点 (2) call明确绑定 (3)bind...

网友评论

    本文标题:what's this? 浅谈js中this的指向问题

    本文链接:https://www.haomeiwen.com/subject/qozcdttx.html