深入解析Javascript中this关键字的使用

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

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

function TestFunction(){
    this.demoVal=‘This is  a demo variable‘;
};

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

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

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

function TestFunction(){
    this.demoVal=‘This is a demo variable‘;
    alert(this.demoVal);
};

TestFunction();        //This is a demo variable

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

var globalVal=‘This is a demo global variable‘;

function TestFunction(){
    alert(this.globalVal);
};

TestFunction();        //This is a demo global variable

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

function TestFunction(){
    alert(this.demoVal);
};

var obj={};
obj.CallFunction=TestFunction;
obj.demoVal=‘This is a object variable‘;

obj.CallFunction();        //This is a object variable

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

function TestFunction(){
    this.deomVal=‘This is a demo variable‘;
};

var obj=new TestFunction();

alert(obj.deomVal);        //This is a demo variable

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

var demoVal=‘This is a global variable‘;

function TestFunction(){
    this.demoVal=‘This is a local variable‘;
};

var obj=new TestFunction();

alert(demoVal);        //This is a global variable

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

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

var demoVal=‘This is a demo variable‘;

function TestFunction(){
    alert(this.demoVal);
};

var obj={};
obj.demoVal=‘This is an object demo variable‘;
obj.TestFunction=TestFunction;

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。

时间: 2024-10-14 17:50:25

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

Javascript中的关键字和保留字

ECMA-262中描述了一组具有特定用途的关键字,可用于表示控制语句的开始或结束,或者用于执行特定操作等.规定:关键字属于语言保留,不可以用于标示符. ECMAScript的全部关键字(*为第五版新增): break do instanceof typeof case else new var catch finally return void continue for switch while debugger*   function this with default if throw de

JavaScript之Ajax-4 XML解析(JavaScript中的XML、Ajax返回并解析XML)

一.JavaScript中的XML XML DOM对象 - IE 浏览器通过 ActiveXObject 对象得到 XML DOM 对象 - 其他浏览器通过 DOMParser 对象得到 XML DOM 对象 XML DOM对象的支持 - XML DOM(XML Document Object Model)定义了访问和操作XML文档的标准方法 - DOM 把 XML 文档作为树结构来查看.能够通过DOM树来访问所有元素 加载并解析XML字符串 二.Ajax返回并解析XML 使用XHR发送XML字

JavaScript中this关键字的使用比较

JavaScript中this关键字的使用比较 this关键字在JavaScript中,用的不能说比较多,而是非常多.那么熟悉this关键字的各种用法则显得非常关键. this有时候就是我们经常说的上下文,这个东西的指代对象.它灵活多变,有时候你看它是对象,有时候是window宿主对象. 1.this指向宿主对象 function myWindow() { this.id = 1; // 等价于window.id = 1 console.log(this); // 这里的this就是window

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

原文:深度解析javascript中的浅复制和深复制 在谈javascript的浅复制和深复制之前,我们有必要在来讨论下js的数据类型.我们都知道有Number,Boolean,String,Null,Undefined,Object五种类型.而Object又包含Function,Array和Object自身.前面的五种类型叫做基本类型,而Object是引用类型.可能有人就要问,为什么要分基本类型和引用类型呢?后面你就会明白的. 我们首先来看看浅复制和深复制的简洁定义: 深复制:直接将数据复制给

Javascript中this关键字详解

原文出处:http://www.cnblogs.com/justany/archive/2012/11/01/the_keyword_this_in_javascript.html Quiz 请看下面的代码,最后alert出来的是什么呢? 1 var name = "Bob"; 2 var nameObj ={ 3 name : "Tom", 4 showName : function(){ 5 alert(this.name); 6 }, 7 waitShowNa

JavaScript中var关键字的使用详解

作用 声明作用:如声明个变量. 语法 ? 1 var c = 1; 省略var 在javascript中,若省略var关键字而直接赋值,那么这个变量为全局变量,哪怕是在function里定义的. ? 1 2 3 4 5 6 7 8 <script type="text/javascript">   function Define() {     a = 2;   }   function Hello() {     alert(a);   } </script>

JavaScript中this关键字的理解

this是个什么鬼? this是JavaScript中的一个关键字,代表当前对象. this在那些情况下会指向谁?如下文. 一.调用全局变量(Global Variable) var x="我是全局变量呦"; function obj() { alert(this.x); } obj(); //我是全局变量呦 此时,this指向了全局变量x. 二.将this作为对象的方法来调用. function test() { alert(this.x); } var obj={}; obj.x=

解析JavaScript中apply和call以及bind

函数调用方法 在谈论JavaScript中apply.call和bind这三兄弟之前,我想先说下,函数的调用方式有哪些: 作为函数 作为方法 作为构造函数 通过它们的call()和apply()方法间接调用 前面的三种调用方法,我们都知道且不在这篇文章的讨论范围内,就不说了. 下面我们来说说这第四种调用方法 通过call()和apply()间接调用 其实,我们可以将这两个函数看做是某个对象的方法,通过调用方法的方式来间接调用函数: function f(){} f.call(o); f.appl

javascript中this关键字之我见

javascript中的this关键字是个很令人头疼的问题,学习的时候也是个难点,觉得这个东西很玄乎,很乱: 下面是我个人的一点观点: 首先我们来看看直接定义的全局函数: function introduce() {      alert("Hello, I am limeng"); } 这个函数的this指向谁呢? 定义在全局的函数,其实也就是window对象的一个方法,函数的所有者就是当前页面,也就是window对象,我们alert一下看看: var name = "He