方法链、作用域链和原型链——作用域链

每一段javascript代码(全局代码或函数)都有一个与之关联的作用域链(scope chain)。这个作用域链是一个对象列表或链表,这组对象定义了这段代码“作用域中“的变量。

在javascript的最顶层代码中(也就是不包含在任何函数定义内的代码),作用域链由一个全局对象组成。在不包含嵌套的函数体内,作用域链上有两个对象,第一个是定义函数参数和局部变量的对旬,第二个是全局对象。在一个嵌套的函数体内,作用域链上至少有三个对象。

当javascript需要查找变量x的值时,它会从链中的第一个对象开始查找,如果这个对象有一个名为x的属性,则会直接使用这个属性的值,如果第一个对象中不存在名为x的属性,javacript会继续查找链上的下一个对象。如果第二个对象依然没有名为x的属性,则会继续查找下一个对象,依次类推。如果作用链上没有任何一个对象含有属性x,那么就认为这段代码的作用域链上不存在x ,并最终抛出一个引用错误异常。

下面是一段代码:

<script type="text/javascript">
    name="haha";
    function t(){
        var name="haha_t";
        function s(){
            var name="haha_s";
            console.log(name);
        }
        function ss(){
            console.log(name);
        }
        s();
        ss();
    }
    t();
</script> 

当执行s时,将创建函数s的执行环境(调用对象),并将该对象置于链表开头,然后将函数t的调用对象链接在之后,最后是全局对象。然后从链表开头寻找变量name,很明显

name是"haha_s"。

但执行ss()时,作用域链是: ss()->t()->window,所以name是”haha_t"

对象链的创建规则:

当定义一个函数fn时,实际上保存了一个作用域链scope_chain。当调用fn时,创建了一个新的对象obj来存储fn的局部变量,并将对象obj添加到scope_chain上,同时创建一个新的更长的表示函数调用作用域的”链“。对于嵌套函数来讲,每次调用外部函数时,作用域链都会不同,内部函数都会重新定义一遍。也就是说,在每次调用外部函数时,内部函数的代码都相同,而关联这段代码的作用域链不相同。

另外,我们要注意以下几点:

1、访问局部变量比全局变量速度快。

2、因为局部变量在作用域链的顶端,在函数中将频繁使用的全局变量赋值给局部变量,可提高程序执行的效率。

3、With语句改变作用域链,是将一个对象放入作用域链的最顶端,这样访问with语句的对象很快,但是访问局部变量就慢了一个级了。不推荐使用with语句,因为可以将对象赋值给局部变量,访问速度也很快,节省了改变作用域链的消耗。

4、With、eval、catch子句,他们都可以改变作用域链,令到一些对访问变量进行优化的引擎没法正常优化 ,因为可以将对象赋值给局部变量,访问速度也很快,节省了改变作用域链的消耗。

时间: 2024-10-12 21:28:07

方法链、作用域链和原型链——作用域链的相关文章

方法链、作用域链和原型链(一)——方法链

方法链:当方法的返回值是一个对象时,这个对象还可以再调用它的方法.这种方法调用序列中,每次调用的结果都是另外一个表达式的组成部分. 比如:基于jQuery库,我们通常会写类似如下代码: $(this).next().show().siblings("li[class!=header]").hide(); 如果在设计的API中,每个方法都返回this,使用API就可以进行“链式调用”风格的编程.在这种风格的编程中,只要指定一次调用的对象,余下的方法都可以基于此方法进行调用: shape.

JS的作用域链与原型链

来一波,好记性不如烂笔头. 这两条链子可是很重要的. 作用域链 当执行一段JS代码(全局代码或函数)时,JS引擎会创建为其创建一个作用域又称为执行上下文(Execution Context),在页面加载后会首先创建一个全局的作用域,然后每执行一个函数,会建立一个对应的作用域,从而形成了一条作用域链.每个作用域都有一条对应的作用域链,链头是全局作用域,链尾是当前函数作用域.作用域链的作用是用于解析标识符,当函数被创建时(不是执行),会将this.arguments.命名参数和该函数中的所有局部变量

javascript作用域链与原型链有联系吗?

一般来说,作用域链是针对变量的,js里面大的范围上来说,只有两种作用域,全局作用域和函数内部作用域,如果函数1里面又定义了函数2(一般都是匿名函数), 那么就有了这么一个作用域链全局作用域==>函数1作用域==>函数2作用域:特点是函数1里面可以直接使用全局作用域的变量,函数2里面可以直接使用全局作用域和函数1作用域的变量原型链的话,一般是定义构造函数时用到,可以认为是针对构造函数的或者说针对构造函数对应的类的:原型链的头部就是Object类/构造函数,如果有构造函数1.prototype =

JS高级(三)--原型链、闭包、作用域、函数的四种调用方式

一.原型链(家族族谱) 概念:JS里面的对象可能会有父对象,父对象还会有父对象,.....祖先 根本:继承 属性:对象中几乎都会有一个__proto__属性,指向他的父对象 意义:可以实现让该对象访问到父对象中相关属性 根对象:Object.prototype var arr=[1,3,5] arr.__proto__:Array.prototype arr.__proto__.__proto__就是找到了根对象 function Animal(){} var cat=new Animal();

javascript高级篇——理解原型和作用域【连载中...】

说明: 该教程绕开了javascript的一些基本的语法知识,直接讲解javascript中最难理解的两个部分,也是和其他主流面向对象语言区别最大的两个部分--原型和作用域,当然,肯定少不了原型链和作用域链.帮你揭开javascript最神秘的面纱. 为什么要偏偏要讲这两个知识点? 这是我在这么多年学习javascript的经历中,认为最难理解.最常犯错的地方,学习这两个知识点,会让你对javascript有更深层次的理解,至少理解了原型和作用域,就不能再算是javascript菜鸟了.另外,这

理解javascript原型和作用域系列 - 目录【连载中...】

说明: 该教程绕开了javascript的一些基本的语法知识,直接讲解javascript中最难理解的两个部分,也是和其他主流面向对象语言区别最大的两个部分——原型和作用域,当然,肯定少不了原型链和作用域链.帮你揭开javascript最神秘的面纱. 为什么要偏偏要讲这两个知识点? 这是我在这么多年学习javascript的经历中,认为最难理解.最常犯错的地方,学习这两个知识点,会让你对javascript有更深层次的理解,至少理解了原型和作用域,就不能再算是javascript菜鸟了.另外,这

理解javascript原型和作用域系列(6)——继承

为何用“继承”为标题,而不用“原型链”? 原型链如果解释清楚了很容易理解,不会与常用的java/C#产生混淆.而“继承”确实常用面向对象语言中最基本的概念,但是java中的继承与javascript中的继承又完全是两回事儿.因此,这里把“继承”着重拿出来,就为了体现这个不同. javascript中的继承是通过原型链来体现的.先看几句代码 以上代码中,f1是Foo函数new出来的对象,f1.a是f1对象的基本属性,f1.b是怎么来的呢?——从Foo.prototype得来,因为f1.__prot

理解javascript原型和作用域系列(5)——instanceof

又介绍一个老朋友——instanceof. 对于值类型,你可以通过typeof判断,string/number/boolean都很清楚,但是typeof在判断到引用类型的时候,返回值只有object/function,你不知道它到底是一个object对象,还是数组,还是new Number等等. 这个时候就需要用到instanceof.例如: 上图中,f1这个对象是被Foo创建,但是“f1 instanceof Object”为什么是true呢? 至于为什么过会儿再说,先把instanceof判

理解javascript原型和作用域系列(3)——prototype原型

既typeof之后的另一位老朋友! prototype也是我们的老朋友,即使不了解的人,也应该都听过它的大名.如果它还是您的新朋友,我估计您也是javascript的新朋友. 在咱们的第一节(理解javascript原型和作用域系列(1)——一切都是对象)中说道,函数也是一种对象.他也是属性的集合,你也可以对函数进行自定义属性. 不用等咱们去试验,javascript自己就先做了表率,人家就默认的给函数一个属性——prototype.对,每个函数都有一个属性叫做prototype. 这个prot

理解javascript原型和作用域系列(7)——原型的灵活性

在Java和C#中,你可以简单的理解class是一个模子,对象就是被这个模子压出来的一批一批月饼(中秋节刚过完).压个啥样,就得是个啥样,不能随便动,动一动就坏了. 而在javascript中,就没有模子了,月饼被换成了面团,你可以捏成自己想要的样子. 首先,对象属性可以随时改动. 对象或者函数,刚开始new出来之后,可能啥属性都没有.但是你可以这会儿加一个,过一会儿在加两个,非常灵活. 在jQuery的源码中,对象被创建时什么属性都没有,都是代码一步一步执行时,一个一个加上的. 其次,如果继承