深入理解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之编码规范 推荐
May 23 Javascript
jQuery使用height()获取高度需要注意的地方
Dec 13 Javascript
JS使用正则表达式除去字符串中重复字符的方法
Nov 05 Javascript
Javascript生成全局唯一标识符(GUID,UUID)的方法
Feb 27 Javascript
浅谈mint-ui 填坑之路
Nov 06 Javascript
原生JS实现的双色球功能示例
Feb 02 Javascript
解决Vue2.x父组件与子组件之间的双向绑定问题
Mar 06 Javascript
js实现敏感词过滤算法及实现逻辑
Jul 24 Javascript
JS基于开关思想实现的数组去重功能【案例】
Feb 18 Javascript
vue 自动化路由实现代码
Sep 03 Javascript
JavaScript基于面向对象实现的无缝滚动轮播示例
Jan 17 Javascript
vue+echarts实现中国地图流动效果(步骤详解)
Jan 27 Vue.js
关于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
咖啡知识 除了喝咖啡还有那些知识点
2021/03/06 新手入门
ezSQL PHP数据库操作类库
2010/05/16 PHP
谨慎使用PHP的引用原因分析
2012/09/06 PHP
怎么在Windows系统中搭建php环境
2013/08/31 PHP
跟我学Laravel之请求与输入
2014/10/15 PHP
浅谈使用PHP开发微信支付的流程
2015/10/04 PHP
PHP解析url并得到url参数方法总结
2018/10/11 PHP
JQuery制作的放大效果的popup对话框(未添加任何jquery plugin)分享
2013/04/28 Javascript
Firefox中通过JavaScript复制数据到剪贴板(Copy to Clipboard 跨浏览器版)
2013/11/22 Javascript
JqueryMobile动态生成listView并实现刷新的两种方法
2014/03/05 Javascript
JavaScript中使用Object.create()创建对象介绍
2014/12/30 Javascript
jQuery实现DIV层淡入淡出拖动特效的方法
2015/02/13 Javascript
JavaScript获取数组最小值和最大值的方法
2015/06/09 Javascript
老司机带你解读jQuery插件开发流程
2016/05/16 Javascript
jquery插件autocomplete用法示例
2016/07/01 Javascript
JavaScript实现HTML5游戏断线自动重连的方法
2017/09/18 Javascript
浅谈Webpack 持久化缓存实践
2018/03/22 Javascript
基于Vue实现关键词实时搜索高亮显示关键词
2018/07/21 Javascript
详解webpack打包后如何调试的方法步骤
2018/11/07 Javascript
js实现图片区域可点击大小随意改变(适用移动端)代码实例
2019/09/11 Javascript
vue数据响应式原理知识点总结
2020/02/16 Javascript
javascript设计模式 ? 代理模式原理与用法实例分析
2020/04/16 Javascript
详解Python中的Descriptor描述符类
2016/06/14 Python
分享6个隐藏的python功能
2017/12/07 Python
利用python和百度地图API实现数据地图标注的方法
2019/05/13 Python
使用python判断jpeg图片的完整性实例
2019/06/10 Python
在Python中使用filter去除列表中值为假及空字符串的例子
2019/11/18 Python
解决Tensorflow占用GPU显存问题
2020/02/03 Python
Python常见反爬虫机制解决方案
2020/06/01 Python
python实现测试工具(一)——命令行发送get请求
2020/10/19 Python
《乌塔》教学反思
2014/02/17 职场文书
党性观念心得体会
2014/09/03 职场文书
卖房协议书样本
2014/10/30 职场文书
返乡农民工证明
2015/06/24 职场文书
银行文明优质服务培训心得体会
2016/01/09 职场文书
使用python创建股票的时间序列可视化分析
2022/03/03 Python