你必须知道的Javascript知识点之"this指针"的应用
更新时间：2013年04月23日 09:47:32 作者：
本篇文章小编为大家介绍，你必须知道的Javascript知识点之"this指针"的应用。需要的朋友参考下
很多人都知道this指针，这篇文章的主要目的是为了培训我们公司的新人。
默认的this指针指向
规则1
this指针默认指向方法调用时为其指定的对象，如：obj.fun()，fun方法体中的this指针指向obj。
复制代码 代码如下:
var user = { name: '段光伟' };
user.getName = function(){ return this.name; };
user.getName(); //返回‘段光伟'
复制代码 代码如下:
var user = { name: '段光伟' };
user.getName = function(){ return this.name; };
user.getName(); //返回‘段光伟'
window.name = '李妞妞';
window.getName = user.getName
window.getName(); //返回‘李妞妞'
getName(); //返回‘李妞妞'
规则2
如果在方法调用时没有为方法指定对象则this指针默认指向window，如：fun()，fun方法体中的this指针指向window。
复制代码 代码如下:
var fun = function(){
return this;
}
fun(); //返回window对象
规则3没有在方法体中的代码可以看作执行在一个匿名方法，根据规则2可以推论出其this指针指向window。
this //window对象
改变this指针的默认指向
使用apply
复制代码 代码如下:
var user = { name: '段光伟' };
user.hi= function(message){ return this.name+':'+message; };
window.name = '李妞妞'
user.hi('你好'); //输出‘段光伟:你好'
user.hi.apply(window, ['你好']); //输出‘李妞妞:你好'
使用call
复制代码 代码如下:
var user = { name: '段光伟' };
user.hi= function(message){ return this.name+':'+message; };
window.name = '李妞妞'
user.hi('你好'); //输出‘段光伟:你好'
user.hi.call(window, '你好'); //输出‘李妞妞:你好'
构造函数中的this指向
构造函数中的this指针默认指向执行正在构造的对象。
复制代码 代码如下:
var User = function(name){
this.name = name;
};
User.prototype.hi = function(){
return this.name;
};
var user = new User('段光伟');
user.hi(); //输出‘段光伟'
最后的小测试
猜猜最后的输出时什么？
复制代码 代码如下:
var User = function(name){
this.name = name;
};
User.prototype.hi = function(){
return this.name;
};
var user = new User('段光伟');
user.hi(); //输出‘段光伟'
var hi = user.hi;
hi(); //猜猜这里的输出
相关文章
小测试shift、ctrl、alt按键的获取，感兴趣的朋友可以参考下哈，希望可以帮助到你2013-04-04
下面小编就为大家带来一篇js编写当天简单日历效果【实现代码】。小编觉得挺不错的，现在分享给大家，也给大家做个参考2016-05-05
本文主要分享了js实现消息滚动效果的示例代码。具有一定的参考价值，下面跟着小编一起来看下吧2017-01-01
这篇文章主要为大家介绍了如何用javascript实现条形码和二维码示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2023-07-07
这篇文章主要为大家详细介绍了javascript实现弹出层效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2019-12-12
ECharts是一个使用JavaScript实现的开源可视化库,涵盖各行业图表,满足各种需求,下面这篇文章主要给大家介绍了如何从零开始画echarts地图的相关资料,需要的朋友可以参考下2022-04-04
关于超出一定字数用省略号显示的问题，这种要求在我们日常开发的时候经常见到，我们之前基本都是用CSS来完成的，今天给大家分享个Javascript实现这个功能的示例代码，有需要的可以参考借鉴。2016-09-09
这篇文章主要为大家详细介绍了js+css实现换肤效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-07-07
picChange图片切换特效的封装函数，能够根据图片html代码自动生成右下角的数字导航按钮。2010-05-05
JavaScript必知必会(十) call apply bind的用法说明
这篇文章主要介绍了JavaScript必知必会(十) call apply bind的用法说明 的相关资料,非常不错具有参考借鉴价值，需要的朋友可以参考下2016-06-06
最新评论