深入解析Javascript中面向对象编程中的this关键字

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

  1. function TestFunction(){
  2. this.demoVal='This is a demo variable';
  3. };

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

接下来分情况讨论this关键字的使用:

1. 纯粹的函数调用(这是函数的通常用法,属于全局性调用),this代表全局性对象Global.Demo程序如下:

  1. function TestFunction(){
  2. this.demoVal='This is a demo variable';
  3. alert(this.demoVal);
  4. };
  5.  
  6. TestFunction(); //This is a demo variable

接下来证明此时的this代表全局对象,Demo程序如下:

  1. var globalVal='This is a demo global variable';
  2.  
  3. function TestFunction(){
  4. alert(this.globalVal);
  5. };
  6.  
  7. TestFunction(); //This is a demo global variable

2. 作为对象的方法调用(这时this指向上一级对象),Demo程序如下:

  1. function TestFunction(){
  2. alert(this.demoVal);
  3. };
  4.  
  5. var obj={};
  6. obj.CallFunction=TestFunction;
  7. obj.demoVal='This is a object variable';
  8.  
  9. obj.CallFunction(); //This is a object variable

3. 作为构造函数调用,所谓的构造函数就是通过这个函数生成一个新的Object对象。此时,this就是指向这个新对象。Demo程序如下:

  1. function TestFunction(){
  2. this.deomVal='This is a demo variable';
  3. };
  4.  
  5. var obj=new TestFunction();
  6.  
  7. alert(obj.deomVal); //This is a demo variable

接下来的代码证明this不是指向全局对象:

  1. var demoVal='This is a global variable';
  2.  
  3. function TestFunction(){
  4. this.demoVal='This is a local variable';
  5. };
  6.  
  7. var obj=new TestFunction();
  8.  
  9. alert(demoVal); //This is a global variable

以上代码显示demoVal值根本没有改变,因此证明this不是指向全局的对象。

4. 使用apply调用,apply函数可以改变函数的执行上下文,apply是函数对象的一个方法,它的作用是改变函数的调用对象,即函数的执行上下文。它的第一个参数表示改变后调用这个函数的对象, 因此,this指向的是第一个参数,Demo实例如下:

  1. var demoVal='This is a demo variable';
  2.  
  3. function TestFunction(){
  4. alert(this.demoVal);
  5. };
  6.  
  7. var obj={};
  8. obj.demoVal='This is an object demo variable';
  9. obj.TestFunction=TestFunction;
  10.  
  11. obj.TestFunction.apply(); //This is a demo variable

apply()的参数为空时,默认调用全局对象。因此,这时的运行结果为:'This is a demo variable',证明this指的是全局对象。

如果将以上代码的最后一行改为:obj.TestFunction.apply(obj),则输出的结果为:'This is an object demo variable'。证明此时的this指向obj。

深入解析Javascript中this关键字的使用的更多相关文章

  1. 深度解析javascript中的浅复制和深复制

    原文:深度解析javascript中的浅复制和深复制 在谈javascript的浅复制和深复制之前,我们有必要在来讨论下js的数据类型.我们都知道有Number,Boolean,String,Null ...

  2. 全面解析JavaScript中“&&”和“||”操作符(总结篇)

    1.||(逻辑或), 从字面上来说,只有前后都是false的时候才返回false,否则返回true. ? 1 2 3 4 alert(true||false); // true alert(false ...

  3. JavaScript中this关键字的使用比较

    JavaScript中this关键字的使用比较 this关键字在JavaScript中,用的不能说比较多,而是非常多.那么熟悉this关键字的各种用法则显得非常关键. this有时候就是我们经常说的上 ...

  4. javascript中new关键字详解

    和其他高级语言一样 javascript 中也有 new 运算符,我们知道 new 运算符是用来实例化一个类,从而在内存中分配一个实例对象. 但在 javascript 中,万物皆对象,为什么还要通过 ...

  5. [No000069]Javascript中this关键字详解

    Quiz 请看下面的代码,最后alert出来的是什么呢?(chrome下按F12,选择Console直接复制粘贴运行) var name = "Bob"; var nameObj ...

  6. 大前端学习笔记整理【五】关于JavaScript中的关键字——this

    写在前面 工作有那么一段时间了,但是在工作中,发现自己的理论知识还是有所欠缺.特别是在javascript上,很多东西其实自己属于知道要用这个,但是不知道为什么要这么用...这种情况很是尴尬了,所以写 ...

  7. javascript中this关键字详解

    不管学习什么知识,习惯于把自己所学习的知识列成一个list,会有助于我们理清思路,是一个很好的学习方法.强烈推荐. 以下篇幅有点长,希望读者耐心阅读. 以下内容会分为如下部分: 1.涵义 1.1:th ...

  8. JavaScript中var关键字的使用详解

    作用 声明作用:如声明个变量. 语法 ? 1 var c = 1; 省略var 在javascript中,若省略var关键字而直接赋值,那么这个变量为全局变量,哪怕是在function里定义的. ? ...

  9. javascript中的关键字和保留字

    javascript中关键字的问题,将名称替换了下,确实就没有问题了.现在将它的关键字和保留字贴出来,便于日后查看和避免在次出现类似的问题. 1 关键字breakcasecatchcontinuede ...

随机推荐

  1. js正则表达式大全(1)

    正则表达式中的特殊字符 \ 做为转意,即通常在"\"后面的字符不按原来意义解释,如/b/匹配字符"b",当b前面加了反斜杆后/\b/,转意为匹配一个单词的边界. ...

  2. 【 2013 Multi-University Training Contest 4 】

    HDU 4632 Palindrome subsequence dp[x][y]表示区间[x,y]构成回文串的方案数. 若str[x]==str[y],dp[x][y]=dp[x+1][y]+dp[x ...

  3. linux 安装python-setuptools

    > wget --no-check-certificate https://bootstrap.pypa.io/ez_setup.py > python ez_setup.py --ins ...

  4. 用Runtime.getRuntime().exec()需要注意的地方

    有时候我们可能需要调用系统外部的某个程序,此时就可以用Runtime.getRuntime().exec()来调用,他会生成一个新的进程去运行调用的程序. 此方法返回一个java.lang.Proce ...

  5. linux内核学习之二 一个精简内核的分析(基于时间片轮转)

    一   实验过程及效果 1.准备好相关的代码,分别是mymain.c,mypcb.h,myinterrupt.c ,如下图,make make成功: 在qemu创建的虚拟环境下的运行效果:(使用的命令 ...

  6. 用Mockito mock普通的方法

    上面的例子是很理想化的状态,但是在实际的开发中,我们需要经常调用一些依赖特定环境的函数或者调用同事写的代码,而同事仅提供了接口.这个时候就需要利用Mockito来协助我们完成测试. 当然,你可以选择e ...

  7. Devexpress Winform Gridcontrol 中根据条件单元格的值改变单元格的颜色等属性。

    提供一下三种方法 1.使用设计器 点击gridcontrol控件,run designer,format Condtions, add,然后进行各种条件的设置. 2.用代码代替设计器. 实例代码: p ...

  8. 简单高效快捷的百度地图demo

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.or ...

  9. C++ 之 class 的思考

    工作多年,突然发现c++这么多年都是零散记录了些自己对C++的反思,没有做过任何的文字记录表示遗憾. 看到很多小伙也都在写技术博客,那我自己也就写一写自己的一些 思考吧! C++的基本类这个东西,想必 ...

  10. C#类的继承,方法的重载和覆写

    在网易云课堂上看到唐大仕老师讲解的关于类的继承.方法的重载和覆写的一段代码,注释比较详细,在此记下以加深理解. 小总结: 1.类的继承:允许的实例化方式:Student t=new Student() ...