引入
作为一个程序员, 你可能早已经习惯于面向对象语言中指代当前对象的引用(或者指针), 如的c++中的this或者 python 中的self,当然具有OO属性( javascript 其实更多的是一种所谓的函数式语言)的 javascript 同样, 它也具有引用当前属性的对象的指针(或者引用), 也就是this关键字.
为了理解this关键字,如果你只想记住一句话,那应该是 this关键字总是指向当前函数的所有者对象(执行空间), 至于这句话如何理解, 可以参见下面的详细说明.
那么什么是 scope 呢?
wikipedia 中的解释是 In computer programming, scope is an enclosing context where values and expressions are associated. 中文即是所谓的 作用域, 它指明的是一个数值或者表达式所关联的上下文(能够被引用的执行空间).
scope 与this有什么关系呢? 如果从上面的定义来看, this指向的总是当前引用此函数的对象,而当你要判断当前引用的对象时, 这时你就得弄清楚当前函数所在的 scope. 具体可见下面的分析.
this关键字
请看下面的几个例子.
一个 python 的例子:
class Person(object):
"""a person class
"""
def __init__(self, name):
self.name = name #这里的self指向的是实例化后的对象,如下面中的zhutao
def get_name(self):
return self.name
zhutao = Person("zhutao")
print zhutao.name
一个 javascript 的例子:
window.name = "zhutao from window"
var get_name = function(){
return this.name; // this的具体指向只能在运行时才能确定,也就是确定运行时调用其的对象
};
alert(get_name()); // 输出zhutao from window, get_name调用的对象为window
var obj = {}
obj.name = "zhutao from obj";
alert(get_name.apply(obj)); // 输出zhutao from obj, 我们强制地使用了 apply来更改调用的对象,使其指向obj
var innerobj = {
"name" : "zhutao from innerobj"
};
innerobj.get_name = get_name; // 使得innerobj的get_name方法指向了global scope的get_name函数
alert(innerobj.get_name()); // 输出zhutao from innerobj, 此时this指向的是innerobj
那么从上面的简单例子来看, this 总是在 运行时 才能确定其具体的指向, 也才能知道它的调用对象.而 这点也正是 动态语言 一个重要特性.
那么如何确定当前this指向的引用对象呢? 通常可以这样判断:
如果在global的scope(可以参见下面的说明来明确什么是global scope)来调用,则指向的是bowser的顶级对象window 例如: get_name()
如果, 有类似于这样的引用, innerobj.get_name() 则很显然this指向的是innerobj
如果我们使用了apply, call来进行强制的引用对象指向, 则也会很显然地指向强制的对象,如 get_name.apply(obj).
关于apply和call
这2个关键字可以很简单地理解为 进行this引用对象(运行空间)强制转换, 二者的语法如下:
fun.call(object, arg1, arg2, ...)
fun.apply(object, [arg1, arg2, ...])
二者目的是相同的(动态更改函数的运行空间, 或者称作更改this指向的对象), 只是在提供给函数的参数上的调用方法不同.
示例代码如下:
var test_call_apply = function(name, gender, school){
alert(this.age + name + gender + school);
};
test_call_apply.call({age:24}, "zhutao", "male", "ISCAS");
test_call_apply.apply({age:24}, ["zhutao", "male", "ISCAS"]);
scope详述
先看下面几个例子:
var global_scope = "I'm global";
var fun = function(){
var fun_scope = "I'm in fun scope";
return innerfun(){
var inner_func_scope = "I'm in the inner fun scope";
return global_scope + fun_scope + inner_func_scope; //此处的引用是重要的,请特别注意
};
};
alert(fun()());
请注意上面的代码,其中:
global_scope 它是global scope
fun_scope 它是 位于一个函数的scope
inner_func_scope 是一个位于一个函数内的函数的scope
你也可以继续内嵌函数, 那么会生成若干个scope.
于是有个问题出现了, 为什么innerfun方法可以引用不在它自身scope的变量?
在回答这个问题之前,需要引入一个概念 scope chain. 所谓的 scope chain 是指 在 javascript 的代码中形成的一个具有优先顺序, 相关的作用域的链.
以上面的代码为例,
对于global的scope而言,它会为自己建立一个global的scope chain(当然此时,这个链只有一个scope).
对于fun函数的scope而言, 它首先建立一个与global相同的scope chain,然后再加入自己的scope(此时,这个 链有2个scope), 类似于这样的结构: global==>fun
对于innerfun而言,除了fun函数所具有的链外,它还会加入自己的scope(当然,此时这个链有3个scope), 类似于这样的结构: global==>fun==>innerfun
scope chain具有下面的特征:
有序
每当建立一个函数时,会自动生成一个scope并加入自己的scope chain中
这个chain类似于一种栈,在查找变量时总是先从顶端查起
参见下图:
本文示例源代码或素材下载