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. JS delete 用法(删除对象属性及变量)

    1,对象属性删除 function fun(){ this.name = 'mm'; } var obj = new fun(); console.log(obj.name);//mm delete ...

  2. Android Bitmap圆角

    代码如下: public Bitmap transform(Bitmap source) { int size = Math.min(source.getWidth(), source.getHeig ...

  3. SQL Server SQLOS

    SQLOS 抽象出了: 1.任务高度管理子系统. 2.内存管理子系统. 3.错误,异常处理机制. 4.死锁侦测各解决机制. 5.运行第三方代码. 好处: 1.减少线种的上下文切换.空闲连接不占用线程.

  4. 使用LINQ来简化编程的7个技巧

    转载地址:http://www.cnblogs.com/lovecherry/archive/2008/05/23/1205565.html 自从学习LINQ以来,我发现了很多使用LINQ来改善代码的 ...

  5. 几种MEMS陀螺仪(gyroscope)的设计和性能比较

    现在市场上的MEMS陀螺仪主要有SYSTRON.BOSCH和INVENSENSE设计和生产.前两者设计的陀螺仪属高端产品,主要用于汽车.后者的属低端产品,主要用于消费类电子,象任天堂的Wii.ADI2 ...

  6. C语言的本质(15)——C语言的函数接口入门

    C语言的本质(15)--C语言的函数接口 函数的调用者和其实现者之间存在一个协议,在调用函数之前,调用者要为实现者提供某些条件,在函数返回时,实现者完成调用者需要的功能. 函数接口通过函数名,参数和返 ...

  7. ubuntu登陆后一闪回到登陆界面

    ubuntu登陆后一闪回到登陆界面   最后发现居然是我的环境变量配置问题........   解决方法:   先CTRL+ALT+F1   root进去, 查看nickleo用户为什么登录失败 ca ...

  8. C和指针 (pointers on C)——第五章:操作符和表达式

    第五章 操作符和表达式 这一章假设没做过玩过单片机.汇编的话,读起来可能比較吃力,尤其是在移位运算符.位运算符应用上.另外多注意一下左值和右值的理解. 总结: 算术操作符.赋值操作符.关系操作符.条件 ...

  9. _itemFailedToPlayToEnd: { kind = 1; new = 2; old = 0; }

    watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvenVveW91MTMxNA==/font/5a6L5L2T/fontsize/400/fill/I0JBQk ...

  10. Android官方技术文档翻译——Ant 任务

    本文译自Android官方技术文档<Ant Tasks>,原文地址:http://tools.android.com/tech-docs/ant-tasks. 由于是抽着时间译的.所以这篇 ...