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

刚刚学习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指向谁了。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 工厂模式类似于现实生活中的工厂可以产生大量相似的商品,去做同样的事情,实现同样的效果;这时候需要使用工厂模式。简单...
    舟渔行舟阅读 12,375评论 2 17
  • 第一章: JS简介 从当初简单的语言,变成了现在能够处理复杂计算和交互,拥有闭包、匿名函数, 甚至元编程等...
    LaBaby_阅读 5,605评论 0 6
  • 单例模式 适用场景:可能会在场景中使用到对象,但只有一个实例,加载时并不主动创建,需要时才创建 最常见的单例模式,...
    Obeing阅读 6,350评论 1 10
  • ECMAScript关键字 delete do else finally function in instance...
    doudou2阅读 3,978评论 0 0
  • title: js面向对象date: 2017年8月17日 18:58:05updated: 2017年8月27日...
    lu900618阅读 3,627评论 0 2