深入理解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 相关文章推荐
禁止IE用右键的JS代码
Dec 30 Javascript
javascript实现图片跟随鼠标移动效果的方法
May 13 Javascript
jQuery增加自定义函数的方法
Jul 18 Javascript
bootstrap和jQuery.Gantt的css冲突 如何解决
May 29 Javascript
利用jQuery解析获取JSON数据
Apr 08 jQuery
vue父组件通过props如何向子组件传递方法详解
Aug 16 Javascript
vue2单元测试环境搭建
May 24 Javascript
微信小程序中使用自定义图标(阿里icon)的方法
Aug 20 Javascript
Vue infinite update loop的问题解决
Apr 23 Javascript
vue excel上传预览和table内容下载到excel文件中
Dec 10 Javascript
jQuery 图片查看器插件 Viewer.js用法简单示例
Apr 04 jQuery
react antd实现动态增减表单
Jun 03 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
数字转英文
2006/12/06 PHP
解析PHP中DIRECTORY_SEPARATOR,PATH_SEPARATOR两个常量的作用
2013/06/21 PHP
ThinkPHP上使用多说评论插件的方法
2014/10/31 PHP
PHP按指定键值对二维数组进行排序的方法
2015/12/22 PHP
JavaScript 类似flash效果的立体图片浏览器
2010/02/08 Javascript
javascript forEach通用循环遍历方法
2010/10/11 Javascript
Jquery中val()表单取值赋值的实例代码
2013/08/15 Javascript
js使用removeChild方法动态删除div元素
2014/08/01 Javascript
Egret引擎开发指南之视觉编程
2014/09/03 Javascript
Javascript中arguments对象详解
2014/10/22 Javascript
JavaScript实现下拉列表框数据增加、删除、上下排序的方法
2015/08/11 Javascript
JSON简介以及用法汇总
2016/02/21 Javascript
基于JS判断iframe是否加载成功的方法(多种浏览器)
2016/05/13 Javascript
node.js 动态执行脚本
2016/06/02 Javascript
Angular ng-class详解及实例代码
2016/09/19 Javascript
Bootstrap显示与隐藏简单实现代码
2017/03/06 Javascript
详解Ant Design of React的安装和使用方法
2018/12/27 Javascript
JavaScript字符串处理常见操作方法小结
2019/11/15 Javascript
JS面向对象编程——ES6 中class的继承用法详解
2020/03/03 Javascript
js中复选框的取值及赋值示例详解
2020/10/18 Javascript
Python八大常见排序算法定义、实现及时间消耗效率分析
2018/04/27 Python
pycharm访问mysql数据库的方法步骤
2019/06/18 Python
Python中sorted()排序与字母大小写的问题
2020/01/14 Python
pycharm安装及如何导入numpy
2020/04/03 Python
中国网上药店领导者:1药网
2017/02/16 全球购物
经济实惠的豪华家具:My-Furniture
2019/03/12 全球购物
教师个人自我鉴定
2014/02/08 职场文书
餐饮业员工工作决心书
2014/03/11 职场文书
不拖欠农民工工资承诺书
2014/03/31 职场文书
个人授权委托书范本格式
2014/10/12 职场文书
2014年财务个人工作总结
2014/12/08 职场文书
幸福家庭事迹材料
2014/12/20 职场文书
医院营销工作计划
2015/01/16 职场文书
2016年优秀党务工作者先进事迹材料
2016/02/29 职场文书
python热力图实现的完整实例
2022/06/25 Python
Win11怎么解除儿童账号限制?Win11解除微软儿童账号限制方法
2022/07/07 数码科技