首页 / JAVASCRIPT / 实例浅析js的this
实例浅析js的this
内容导读
互联网集市收集整理的这篇技术教程文章主要介绍了实例浅析js的this，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含4177字，纯文字阅读大概需要6分钟。
内容图文
js的this是什么？关于这个东西，博客园里面有太多的解释了，不过，本人看了一下，感觉对this解释的有点复杂了，因此，本人在此给this一个简单易于理解的定义。
this其实是js的一个对象，至于是什么对象呢？很简单，this这个对象就是：谁调用它它就指向谁。
关于这一点，其实，博客园的文章已经说明了很多了，有的文章也说到了点子上，只不过，他们解释的还是有点模糊，这里，我给大家做几个简单的对照实验，根据这几个对照实验的结果，大家应该很清楚了。
希望大家根据我的代码重复实现下面的实验。
首先，我们来看下面的代码：
//创建一个局部对象a
var a = {
user:'小东',
getName:function(){
return this.user;//返回当前对象的user属性值
}
}
//调用a的getName方法
alert(a.getName());
上面的代码会输出什么呢？没错，这里alert的是····小东····，很简单，这里是在a对象的内部调用this嘛，肯定是a对象调用this，所以根据···········谁调用this它就指向谁这个定义···········，那么这里的this指向的就是a对象。
接下来，我们再给上面的代码添加一行：
//创建一个局部对象a
var a = {
user:'小东',
getName:function(){
return this.user;//返回当前对象的user属性值
}
}
//调用a的getName方法
alert(a.getName());
//把局部对象的属性函数赋值给外面的变量out
var out = a.getName;
//调用out函数
alert(out());
根据上面的实验结果，我们知道直接调用a.getName输出的是小东，对吧？那么，我们把a.getName这个属性函数赋值给out变量之后，再来调用out会输出什么呢？结果是：undefined的。为什么会是undefined的？请思考一会。要是你明白这里为什么输出的是undefined的原因，那么，我想你对this的理解已经很清楚了。但是，如果，你对本文感兴趣，你还是可以继续看下去的。
这里，我先不解释为什么在外面引用a对象的getName函数却得不到a对象里面的值，我们转过弯来讲，请看下面的代码（其实和上面的代码是差不多的，呵呵）：
//创建一个局部对象a
var a = {
user:'小东',
getName:function(){
return 1;//这里我们不返回this，而是返回1
}
}
//调用a的getName方法
alert(a.getName());
//把局部对象的属性函数赋值给外面的变量out
var out = a.getName;
//调用out函数
alert(out());
上面的代码很简单吧，这里，我们不在a对象的getName属性函数里面返回a对象的东西，而是返回···1·····，那么，此刻你再调用out函数，你觉得会输出什么呢？没错，你得到的不再是····undefined····的，而是一个实实在在的数字····1······。这就奇怪了，是吧？当a.getName函数返回的是a对象里面的user属性时，我们用out来引用a.getName函数时，我们得到的是undefined的结果，而当a.getName函数返回的是1时，我们再用out引用a.getName函数却可以得到a.getName里面的东西？这是怎么回事呢？
原因很简单，当我们调用外面的全局变量out的时候，this它指向的应该out的对象，而不是a对象，而out的对象是谁呢？我们应该知道，js在全局中声明的变量的对象是window对象吧。既然调用out时，this指向的是window，那么函数out=a.getName=function(){return this.user;}里面的this.user我们应该写出window.user对吧？但是，此刻，全局变量中有没有一个window.user的属性值呢？没有吧？既然没有window.user这个属性值，那么我们alert(window.user)肯定是undefined啦。为了证明这一点，我们来做下面的实验：
//创建一个局部对象a
var a = {
user:'小东',
getName:function(){
return this.user;//返回当前对象的user属性值
}
}
//调用a的getName方法
alert(a.getName());
//把局部对象的属性函数赋值给外面的变量out
var out = a.getName;
//我们增加一个window.user的全局属性，看看再次调用out函数会输出什么
var window.user='window"s username';
//调用out函数
alert(out());
此刻，当你再执行上面的代码时，你会发现，out函数输出的不再是undefined，而是window's username，这证明了什么？证明了当out调用this时，this确实指向了window，同时也证明了，this确实是：谁调用它它就指向谁。
如果你不理解js的全局变量，那么，我们可以把上面的代码换成下面的代码再来调用out，你就更加明白了：
//创建一个局部对象a
var a = {
user:'小东',
getName:function(){
return this.user;//返回当前对象的user属性值
}
}
//调用a的getName方法
alert(a.getName());
//把局部对象的属性函数赋值给外面的变量out
var out = a.getName;
//此刻，我们增加一个user的变量，看看再次调用out函数会输出什么
var user='window"s username';
//调用out函数
alert(out());
这里，我们不再启用window这个对象，对于外面的属性和函数，我们一律都用var 来声明，既然都用var来声明，那么他们应该都指向同一个对象吧？此刻，你再执行上面的代码，也就是执行out函数，依然可以alert出window's username。行文到此，this的定义已经再明白不过了，它就是：谁调用它它就指向谁。
this不难理解，难以理解的是，你要找到那个调用它的········对象·····，只有找到调用this的对象，你才知道this到底指向谁，因为：this的定义就是：谁调用它它就指向谁。
以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持脚本之家！
内容总结
以上是互联网集市为您收集整理的实例浅析js的this全部内容，希望文章能够帮你解决实例浅析js的this所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。
内容备注
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。
内容手机端
扫描二维码推送至手机访问。