Javascript this 的一些学习总结

1.1.1 摘要
相信有C++、C#或Java等编程经验的各位,对于this关键字再熟悉不过了。由于Javascript是一种面向对象的编程语言,它和C++、C#或Java一样都包含this关键字,接下来我们将向大家介绍Javascript中的this关键字。

本文目录

•全局代码中的this
•函数中的this
•引用类型
•函数调用以及非引用类型
•引用类型以及this的null值
•函数作为构造器被调用时this的值
•手动设置函数调用时this的值

1.1.2 正文


由于许多面向对象的编程语言都包含this关键字,我们会很自然地把this和面向对象的编程方式联系在一起,this通常指向利用构造器新创建出来的对象。而在ECMAScript中,this不仅仅只用来表示创建出来的对象,也是执行上下文的一个属性:

复制代码 代码如下:


activeExecutionContext = {
// Variable object.
VO: {...},
this: thisValue
};


全局代码中的this

复制代码 代码如下:


// Global scope
// The implicit property of
// the global object
foo1 = "abc";
alert(foo1); // abc

// The explicit property of
// the global object
this.foo2 = "def";
alert(foo2); // def

// The implicit property of
// the global object
var foo3 = "ijk";
alert(foo3); // ijk


前面我们通过显式和隐式定义了全局属性foo1、foo2和foo3,由于this在全局上下文中,所以它的值是全局对象本身(在浏览器中是window object);接下来我们将介绍函数中的this。

函数中的this

当this在函数代码中,情况就复杂多了,并且会引发很多的问题。

函数代码中this值的第一个特性(同时也是最主要的特性)就是:它并非静态的绑定在函数上。

正如此前提到的,this的值是在进入执行上下文(Excution context)的阶段确定的,并且在函数代码中的话,其值每次都不尽相同。

然而,一旦进入执行代码阶段,其值就不能改变了。如果要想给this赋一个新的值是不可能的,因为在那时this根本就不是变量了。

接下来,我们通过具体的例子说明函数中的this。

首先我们定义两个对象foo和person,foo包含一个属性name,而person包含属性name和方法say(),具体的定义如下:

复制代码 代码如下:


// Defines foo object.
var foo = {
name: "Foo"
};

// Defines person object.
var person = {
name: "JK_Rush",
say: function() {
alert(this === person);
alert("My name is " + this.name);
}
};

person.say(); // My name is JK_Rush

// foo and person object refer to
// the same function say
foo.say = person.say;

foo.say(); // My name is Foo.


通过上面的代码,我们发现调用person的say()方法时,this指向person对象,当通过赋值方式使得foo的say()方法指向peson中的say()方法时。我们调用foo的say()方法,发现this不是指向person对象,而不是指向foo对象,这究竟是什么原因呢?

首先,我们必须知道this的值在函数中是非静态的,它的值确定在函数调用时,具体代码执行前,this的值是由激活上下文代码的调用者决定的,比如说,调用函数的外层上下文;更重要的是,this的值是由调用表达式的形式决定的,所以说this并非静态的绑定在函数上。

由于this并非静态地绑定在函数上,那么我们是否可以在函数中动态地修改this的值呢?

复制代码 代码如下:


// Defines foo object.
var foo = {
name: "Foo"
};

// Defines person object.
var person = {
name: "JK_Rush",
say: function() {
alert(this === person);
this = foo; // ReferenceError
alert("My name is " + this.name);
}
};

person.say(); // My name is JK_Rush


现在我们在方法say()中,动态地修改this的值,当我们重新执行以上代码,发现this的值引用错误。这是由于一旦进入执行代码阶段(函数调用时,具体代码执行前),this的值就确定了,所以不能改变了。

引用类型

前面我们提到this的值是由激活上下文代码的调用者决定的,更重要的是,this的值是由调用表达式的形式决定的;那么表达式的形式是如何影响this的值呢?

首先,让我们介绍一个内部类型——引用类型,它的值可以用伪代码表示为一个拥有两个属性的对象分别是:base属性(属性所属的对象)以及该base对象中的propertyName属性:

复制代码 代码如下:


// Reference type.
var valueOfReferenceType = {
base: mybase,
propertyName : 'mybasepropertyName'
};


引用类型的值只有可能是以下两种情况:

•当处理一个标识符的时候
•或者进行属性访问的时候
标识符其实就是变量名、函数名、函数参数名以及全局对象的未受限的属性。

复制代码 代码如下:


// Declares varible.
var foo = 23;

// Declares a function
function say() {
// Your code.
}


中间过程中,对应的引用类型如下:

复制代码 代码如下:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wddpyd.html