深入理解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 相关文章推荐
一个JavaScript继承的实现
Oct 24 Javascript
js判断两个日期是否相等的方法
Sep 10 Javascript
javascript实现json页面分页实例代码
Feb 20 Javascript
网站基于flash实现的Banner图切换效果代码
Oct 14 Javascript
深入分析原生JavaScript事件
Dec 29 Javascript
AngularJS 整理一些优化的小技巧
Aug 18 Javascript
jQuery图片前后对比插件beforeAfter用法示例【附demo源码下载】
Sep 20 Javascript
使用node.js搭建服务器
May 20 Javascript
Js判断H5上下滑动方向及滑动到顶部和底部判断的示例代码
Nov 15 Javascript
利用SpringMVC过滤器解决vue跨域请求的问题
Feb 10 Javascript
前端Electron新手入门教程详解
Jun 21 Javascript
Vue图片浏览组件v-viewer用法分析【支持旋转、缩放、翻转等操作】
Nov 04 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
php5 mysql分页实例代码
2008/04/10 PHP
php中sprintf与printf函数用法区别解析
2014/02/17 PHP
修改destoon会员公司的伪静态中的com目录的方法
2014/08/21 PHP
PHP调用Linux命令权限不足问题解决方法
2015/02/07 PHP
PHP中捕获超时事件的方法实例
2015/02/12 PHP
laravel中的fillable和guarded属性详解
2019/10/23 PHP
Javascript的IE和Firefox兼容性汇编(zz)
2007/02/02 Javascript
javascript类继承机制的原理分析
2009/09/12 Javascript
JQuery跨Iframe选择实现代码
2010/08/19 Javascript
用jQuery toggleClass 实现鼠标移上变色
2014/05/14 Javascript
在JavaScript中操作时间之getMonth()方法的使用
2015/06/10 Javascript
jQuery实现仿百度帖吧头部固定导航效果
2015/08/07 Javascript
每天一篇javascript学习小结(基础知识)
2015/11/10 Javascript
vue中的event bus非父子组件通信解析
2017/10/27 Javascript
jQuery创建及操作xml格式数据示例
2018/05/26 jQuery
Bootstrap 模态框自定义点击和关闭事件详解
2018/08/10 Javascript
JS基于对象的链表实现与使用方法示例
2019/01/31 Javascript
Vue 开发必须知道的36个技巧(小结)
2019/10/09 Javascript
vue 解决路由只变化参数页面组件不更新问题
2019/11/05 Javascript
js键盘事件实现人物的行走
2020/01/17 Javascript
Vue移动端项目实现使用手机预览调试操作
2020/07/18 Javascript
js操作两个json数组合并、去重,以及删除某一项元素
2020/09/22 Javascript
python文件读写并使用mysql批量插入示例分享(python操作mysql)
2014/02/17 Python
分析Python的Django框架的运行方式及处理流程
2015/04/08 Python
Python机器学习算法之k均值聚类(k-means)
2018/02/23 Python
python设计tcp数据包协议类的例子
2019/07/23 Python
在Python 的线程中运行协程的方法
2020/02/24 Python
520使用Python实现“我爱你”表白
2020/05/20 Python
Python使用matplotlib绘制圆形代码实例
2020/05/27 Python
点菜员岗位职责范本
2014/02/14 职场文书
公司担保书范文
2014/05/21 职场文书
反对邪教标语
2014/06/30 职场文书
社会学专业求职信
2014/07/17 职场文书
2014年学校财务工作总结
2014/12/06 职场文书
初中化学教学反思
2016/02/22 职场文书
Python+Pillow+Pytesseract实现验证码识别
2022/05/11 Python