深入理解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 相关文章推荐
父窗口获取弹出子窗口文本框的值
Jun 27 Javascript
JavaScript单元测试ABC
Apr 12 Javascript
js利用数组length属性清空和截短数组的小例子
Jan 15 Javascript
jquery使用jxl插件导出excel示例
Apr 14 Javascript
jQuery给元素添加样式的方法详解
Dec 30 Javascript
JavaScript基础知识点归纳(推荐)
Jul 09 Javascript
在ABP框架中使用BootstrapTable组件的方法
Jul 31 Javascript
JS倒计时实例_天时分秒
Aug 22 Javascript
vue2利用Bus.js如何实现非父子组件通信详解
Aug 25 Javascript
基于Bootstrap表单验证功能
Nov 17 Javascript
vue-router3.0版本中 router.push 不能刷新页面的问题
May 10 Javascript
layui多iframe页面控制定时器运行的方法
Sep 05 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/10/09 PHP
php download.php实现代码 跳转到下载文件(response.redirect)
2009/08/26 PHP
支持数组的ADDSLASHES的php函数
2010/02/16 PHP
你不知道的文件上传漏洞php代码分析
2016/09/29 PHP
Yii2框架控制器、路由、Url生成操作示例
2019/05/27 PHP
js防止表单重复提交的两种方法
2013/09/30 Javascript
js中自定义方法实现停留几秒sleep
2014/07/11 Javascript
JQuery中clone方法复制节点
2015/05/18 Javascript
JavaScript使用RegExp进行正则匹配的方法
2015/07/11 Javascript
js淡入淡出的图片轮播效果代码分享
2015/08/24 Javascript
JS 日期与时间戮相互转化的简单实例
2016/06/22 Javascript
javascript稀疏数组(sparse array)和密集数组用法分析
2016/12/28 Javascript
JavaScript中的子窗口与父窗口的互相调用问题
2017/02/08 Javascript
jquery仿苹果的时间/日期选择效果
2017/03/08 Javascript
Vue 2.0在IE11中打开项目页面空白的问题解决
2017/07/16 Javascript
关于Ajax的原理以及代码封装详解
2017/09/08 Javascript
详谈commonjs模块与es6模块的区别
2017/10/18 Javascript
vue数据传递--我有特殊的实现技巧
2018/03/20 Javascript
vue 组件中slot插口的具体用法
2018/04/03 Javascript
vue完成项目后,打包成静态文件的方法
2018/09/03 Javascript
vue登录页面cookie的使用及页面跳转代码
2019/07/10 Javascript
layer插件实现在弹出层中弹出一警告提示并关闭弹出层的方法
2019/09/24 Javascript
JavaScript中交换值的10种方法总结
2020/08/18 Javascript
[02:44]完美大师赛主赛事淘汰赛第二日观众采访
2017/11/24 DOTA
python的几种开发工具介绍
2007/03/07 Python
详解MySQL数据类型int(M)中M的含义
2016/11/20 Python
Python Selenium 之关闭窗口close与quit的方法
2019/02/13 Python
Python判断有效的数独算法示例
2019/02/23 Python
Pytorch 中retain_graph的用法详解
2020/01/07 Python
使用pytorch搭建AlexNet操作(微调预训练模型及手动搭建)
2020/01/18 Python
Jupyter Notebook 文件默认目录的查看以及更改步骤
2020/04/14 Python
Python3爬虫里关于代理的设置总结
2020/07/30 Python
小学生防溺水广播稿
2014/01/12 职场文书
秋季运动会表扬稿
2014/01/16 职场文书
学年末自我鉴定
2014/01/21 职场文书
安全标语口号
2014/06/09 职场文书