深入理解js中this的用法


Posted in Javascript onMay 28, 2016

this是js的一个关键字,随着函数使用场合不同,this的值会发生变化。但是总有一个原则,那就是this指的是调用函数的那个对象。

1、纯粹函数调用。

function test() {  
  this.x = 1;  
  alert(x);
}

test();

其实这里的this就是全局变量。看下面的例子就能很好的理解其实this就是全局对象Global。其实这里的this就是全局变量。看下面的例子就能很好的理解其实this就是全局对象Global。

var x = 1;
function test() {
  alert(this.x);
}
test();//1

var x = 1;
function test() {
  this.x = 0;
}
test();
alert(x);//0

2、作为方法调用,那么this就是指这个上级对象。

function test() {
  alert(this.x);
}

var o = {};
o.x = 1;
o.m = test;
o.m(); //1

3、作为构造函数调用。所谓构造函数,就是生成一个新的对象。这时,这个this就是指这个对象。

function test() {  
   this.x = 1;
}
var o = new test();
alert(o.x);//1

4、apply调用

var x = 0;
function test() {
  alert(this.x);
}

var o = {};
o.x = 1;
o.m = test;
o.m.apply(); //0
o.m.apply(o);//1

当apply没有参数时,表示为全局对象。所以值为0。

以上这篇深入理解js中this的用法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
超级简单的图片防盗(HTML),好用
Apr 08 Javascript
jQuery+jqmodal弹出窗口实现代码分明
Jun 14 Javascript
JavaScript编程开发中的五个实用小技巧
Jul 22 Javascript
JavaScript之HTMLCollection接口代码
Apr 27 Javascript
JavaScript实现Java中StringBuffer的方法
Feb 09 Javascript
使用JavaScript 实现的人脸检测
Mar 24 Javascript
Javascript简单改变表单元素背景的方法
Jul 15 Javascript
AngularJS压缩JS技巧分析
Nov 08 Javascript
详解Vue 开发模式下跨域问题
Jun 06 Javascript
form表单序列化详解(推荐)
Aug 15 Javascript
JavaScript如何获取到导航条中HTTP信息
Oct 10 Javascript
layer.prompt输入层的例子
Sep 24 Javascript
关于function类中定义变量this的简单说明
May 28 #Javascript
Highcharts 多个Y轴动态刷新数据的实现代码
May 28 #Javascript
动态更新highcharts数据的实现方法
May 28 #Javascript
不同js异步函数同步的实现方法
May 28 #Javascript
前端学习笔记style,currentStyle,getComputedStyle的用法与区别
May 28 #Javascript
浅谈jQuery 中的事件冒泡和阻止默认行为
May 28 #Javascript
jquery取消事件冒泡的三种方法(推荐)
May 28 #Javascript
You might like
php URL验证正则表达式
2011/07/19 PHP
php生成excel列名超过26列大于Z时的解决方法
2014/12/29 PHP
onpropertypchange
2006/07/01 Javascript
准确获得页面、窗口高度及宽度的JS
2006/11/26 Javascript
javascript firefox兼容ie的dom方法脚本
2008/05/18 Javascript
javascript 跨浏览器开发经验总结(五) js 事件
2010/05/19 Javascript
浅谈Javascript事件模拟
2012/06/27 Javascript
js控制的回到页面顶端goTop的代码实现
2013/03/20 Javascript
jQuery中的$.ajax()方法应用
2014/05/06 Javascript
浅谈javascript事件取消和阻止冒泡
2015/05/26 Javascript
浅谈javascript的Array.prototype.slice.call
2015/08/31 Javascript
通过隐藏iframe实现无刷新上传文件操作
2016/03/16 Javascript
Bootstrap框架结合jQuery仿百度换肤功能实例解析
2016/09/17 Javascript
JS命令模式例子之菜单程序
2016/10/10 Javascript
Bootstrap3 datetimepicker控件使用实例
2016/12/13 Javascript
如何快速解决JS或Jquery ajax异步跨域的问题
2018/01/08 jQuery
Java Varargs 可变参数用法详解
2020/01/28 Javascript
在 Vue 中编写 SVG 图标组件的方法
2020/02/24 Javascript
tracking.js实现前端人脸识别功能
2020/04/16 Javascript
Vue单页面应用中实现Markdown渲染
2021/02/14 Vue.js
用Python给文本创立向量空间模型的教程
2015/04/23 Python
python实现从网络下载文件并获得文件大小及类型的方法
2015/04/28 Python
Python操作串口的方法
2015/06/17 Python
Python实现将一个正整数分解质因数的方法分析
2017/12/14 Python
python使用webdriver爬取微信公众号
2018/08/31 Python
python获取栅格点和面值的实现
2020/03/10 Python
纯CSS3绘制打火机动画火焰效果
2016/07/18 HTML / CSS
html5手机键盘弹出收起的处理
2020/01/20 HTML / CSS
写一个用矩形法求定积分的通用函数
2012/11/08 面试题
秘书专业自荐信范文
2013/12/26 职场文书
企业指导教师评语
2014/04/28 职场文书
cf战队收人口号
2014/06/21 职场文书
2014年党风建设工作总结
2014/11/19 职场文书
听证会主持词
2015/07/03 职场文书
2016年教师师德师风承诺书
2016/03/25 职场文书
js基础语法与maven项目配置教程案例
2021/07/15 Javascript