this是Javascript的关键字,代表在函数运行时,自动生成一个内部对象,只能在函数内部使用。例如:

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

随着函数的使用场合不同,this的值会发生变化。总的原则是:this指的是,调用函数的那个对象。

有以下使用四种情况:

情况一:纯粹的函数调用

这是函数的最通常用法,属于全局性调用,因此this就代表全局对象Global。

以下代码的运行结果为1:

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

为了证明this就是全局对象,对代码做一些改变:

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

或者:

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

注意:javascript的设计缺陷,内部函数的this不会绑定到外层函数上,使用变量替代方式可以解决该问题。约定俗成,该变量命名为that。

var point = {
x : 0,
y : 0,
moveTo : function(x, y) {
var that = this;
// 内部函数
var moveX = function(x) {
that.x = x;
};
// 内部函数
var moveY = function(y) {
that.y = y;
}
moveX(x);
moveY(y);
}
};
point.moveTo(1, 1);
point.x; //==>1
point.y; //==>1

情况二:作为对象方法的调用

函数还可以作为某个对象的方法调用,这是this就是指这个上级对象。

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

情况三:作为构造函数调用

所谓构造函数,就是通过这个函数生成一个新对象(Object)。这时,this就指这个新对象。

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

JavaScript 支持面向对象式编程,与主流的面向对象式编程语言不同,JavaScript 并没有类(class)的概念,而是使用基于原型(prototype)的继承方式。相应的,JavaScript 中的构造函数也很特殊,如果不使用 new 调用,则和普通函数一样。作为又一项约定俗成的准则,构造函数以大写字母开头,提醒调用者使用正确的方式调用。如果调用正确,this 绑定到新创建的对象上。

情况四:apply调用

apply()是函数对象的一个方法,作用是改变函数的调用对象,它的第一个参数就表示改变后的调用这个函数的对象。因此,this指的就是这个第一个参数。

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

apply()的参数为空时,默认调用全局对象。因此,这时的运行结果为0,this指的是全局对象。

如果最后一行代码修改为

o.m.apply(o); //1

运行结果为1,证明了this代表的是对象o。

参考资料:http://www.ruanyifeng.com/blog/2010/04/using_this_keyword_in_javascript.html

http://www.ibm.com/developerworks/cn/web/1207_wangqf_jsthis/

JavaScript学习笔记(三)this关键字的更多相关文章

  1. JavaScript:学习笔记(4)——This关键字

    JavaScript:学习笔记(4)——This关键字 以前这篇帖子是关于闭包的,但是我想弄明白的其实是This关键字.JavaScript的this和Java等面向对象语言中的this大不一样,bi ...

  2. Javascript学习笔记三——操作DOM(二)

    Javascript学习笔记 在我的上一个博客讲了对于DOM的基本操作内容,这篇继续巩固一下对于DOM的更新,插入和删除的操作. 对于HTML解析的DOM树来说,我们肯定会时不时对其进行一些更改,在原 ...

  3. JavaScript学习笔记(三)——this、原型、javascript面向对象

    一.this 在JavaScript中this表示:谁调用它,this就是谁. JavaScript是由对象组成的,一切皆为对象,万物皆为对象.this是一个动态的对象,根据调用的对象不同而发生变化, ...

  4. JavaScript学习笔记–(new关键字)

    作用 是创建一个对象实例.这个对象可以是用户自定义的,也可以是一些系统自带的带构造函数的对象. 描述 创建一个对象类型需要创建一个指定了名称和属性的函数:其中这些属性可以指向它本身,也可以指向其他对象 ...

  5. JavaScript学习笔记(三十八) 复制属性继承

    复制属性继承(Inheritance by Copying Properties) 让我们看一下另一个继承模式—复制属性继承(inheritance by copying properties).在这 ...

  6. javascript学习笔记(四) Number 数字类型

    数字格式化方法toFixed().toExponential().toPrecision(),三个方法都四舍五入 toFixed() 方法指定小数位个数  toExponential() 方法 用科学 ...

  7. JavaScript:学习笔记(7)——VAR、LET、CONST三种变量声明的区别

    JavaScript:学习笔记(7)——VAR.LET.CONST三种变量声明的区别 ES2015(ES6)带来了许多闪亮的新功能,自2017年以来,许多JavaScript开发人员已经熟悉并开始使用 ...

  8. Java程序猿JavaScript学习笔记(14——扩大jQuery UI)

    计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...

  9. JavaScript学习笔记之数组(二)

    JavaScript学习笔记之数组(二) 1.['1','2','3'].map(parseInt) 输出什么,为什么? ['1','2','3'].map(parseInt)//[1,NaN,NaN ...

  10. ES6学习笔记<三> 生成器函数与yield

    为什么要把这个内容拿出来单独做一篇学习笔记? 生成器函数比较重要,相对不是很容易理解,单独做一篇笔记详细聊一聊生成器函数. 标题为什么是生成器函数与yield? 生成器函数类似其他服务器端语音中的接口 ...

随机推荐

  1. oracle使用口令文件验证和os验证

    一.Oracle安装之后默认情况下是启用了OS认证的,这里提到的os认证是指服务器端os认证.OS认证的意思把登录数据库的用户和口令校验放在了操作系统一级.如果以安装Oracle时的用户登录OS,那么 ...

  2. phonegap退出android程序

    最近用android做了一个程序,在点“后退”的时候,会不停地后退,感觉不好. 查了些资料有这么些: 一.toast_plugin插件 <script type="text/javas ...

  3. 第一局 ThreeJS-开始

    本文介绍ThreeJS使用的大体流程.(由于水平有限,请大家多多指教.) 1.ThreeJS下载和引入: (1)下载地址:https://github.com/mrdoob/three.js/arch ...

  4. HTML5 Mobile 适应移动端的屏幕<meta name='viewport' content='xxxx'>

    网页手机wap2.0网页的head里加入下面这条元标签,在移动端的浏览器中页面将以原始大小显示,并不允许缩放. 加入 如下代码 即可自适应移动端的屏幕: <meta name="vie ...

  5. 【ecos学习4】[转]ubuntu 11.04 tftp 设置

    安装 TFTP 服务 sudo apt-get install xinetdsudo apt-get install tftp-hpasudo apt-get install tftpd-hpa 修改 ...

  6. Doubles water!!!!!!只会水题怎么破

    Doubles Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Sub ...

  7. 获取所有树叶子节点 注册添加事件 if ($(node).tree('isLeaf', node.target)) 是否叶子节点

    //获取所有树叶子节点 注册添加事件 if ($(node).tree('isLeaf', node.target)) 是否叶子节点 $(function () { $('.easyui-tree') ...

  8. Git学习01 --git add, git commit , git log ,git status, git reset --hard, head

    Git官方提供的快速入门教程:https://try.github.io/levels/1/challenges/1 特点:Git极其强大的分支管理:分布式版本 集中式版本控制系统,版本库是集中存放在 ...

  9. Oracle EBS-SQL (INV-9):检查搬运单分配异常.sql

    select h.request_number,         l.line_number,         msib.segment1 item_code,         t.transacti ...

  10. codevs1040 统计单词个数

    题目描述 Description 给出一个长度不超过200的由小写英文字母组成的字母串(约定;该字串以每行20个字母的方式输入,且保证每行一定为20个).要求将此字母串分成k份(1<k<= ...