通过原型链解析js函数一些难以理解的的作用域问题

基本原理

js函数在执行时,系统会创建一个隐式的属性scope,scope中存储的是函数的作用域链.

通过对这个scope的分析,就能解释JavaScript中许多难以理解的问题:

例1:    function demo(){}
    demo();

scope属性是在函数执行时创建,如果这个函数是一个全局函数,他的scope里会保存一个Global object和一个activation object.

global object保存的是全局的信息,而activition object保存的是函数内部的信息,比如函数中有哪些变量等

例2:　　　　　function demo(){
		function inner(){}
	}
	demo();

如果这个函数是一个内部函数,他会继承父函的原型链,并在其顶端创建一个自己的activation.

当函数执行完毕,该函数的原型链被销毁.

为什么在函数外部不能调用函数的子函数

如例2所示:

当demo函数执行完毕后,该函数的原型链被销毁,在外部根本无从得知函数内部的信息.也就不能调用inner函数

为什么子函数可以使用父级函数的变量

因为子函数继承了父函数的原型链,他能够在原型链中通过父函数的activation object找到父函数定义的变量

原文地址：https://www.cnblogs.com/iszhangk/p/10994946.html

时间： 2024-10-15 17:50:57

通过原型链解析js函数一些难以理解的的作用域问题的相关文章

JavaScript (JS) 面向对象编程浅析 (含对象、函数原型链解析)

1. 构造函数原型对象:prototype ① 构造函数独立创建对象,消耗性能 function Person(name) { this.name = name; this.sayHello = function () { console.log("Hello,my name is " + this.name) } } var P1 = new Person("Tom"); var P2 = new Person("Jim"); P1.sayHe

js原型链解析

大家可以先仔细分析下该图,然后让我们进入主题 prototype 首先来介绍下 prototype 属性.这是一个显式原型属性,只有函数才拥有该属性.基本上所有函数都有这个属性,但是也有一个例外 let fun = Function.prototype.bind() 如果你以上述方法创建一个函数,那么可以发现这个函数是不具有 prototype 属性的. prototype 如何产生的当我们声明一个函数时,这个属性就被自动创建了. function Foo() {} 并且这个属性的值是一个对象

Js函数function基础理解

正文:我们知道,在js中,函数实际上是一个对象,每个函数都是Function类型的实例,并且都与其他引用类型一样具有属性和方法.因此,函数名实际上是指向函数对象的指针,不与某个函数绑定.在常见的两种定义方式(见下文)之外,还有一种定义的方式能更直观的体现出这个概念: var sum = new Function("num1", "num2", "return num1 + num2"); //不推荐 Function的构造函数可以接收任意数量的参

JS函数传参理解

我的理解:js函数传递的参数如果是对象,那么他复制的值是地址.于是person的地址复制给了obj,obj.name='Nicholas'就修改了person.name.之后obj又指向了新地址,此时的obj.name和person毫无关系.所以最后的结果person.name='Nicholas';

JavaScript-原型&原型链&原型继承&组合函数

小小的芝麻之旅: 今天学习了js的原型,要说原型,我们先简单说一下函数创建过程. 原型每个函数在创建的时候js都自动添加了prototype属性,这就是函数的原型,原型就是函数的一个属性,类似一个指针.原型在函数的创建过程中由js编译器自动添加. <script type="text/javascript"> function Flower(name,area) { this.name=name; this.area=area; this.showName=myName;

JS原型与原型链终极讲解

function Person () { this.name = 'John'; } var person = new Person(); Person.prototype.say = function() { console.log('Hello,' + this.name); }; person.say();//Hello,John 上述代码非常简单,Person原型对象定义了公共的say方法,虽然此举在构造实例之后出现,但因为原型方法在调用之前已经声明,因此之后的每个实例将都拥有该方法.从

JS原型与原型链终极详解（转载）

这篇文章需要认认真真仔仔细细的看才能看懂一. 普通对象与函数对象 JavaScript 中,万物皆对象!但对象也是有区别的.分为普通对象和函数对象,Object ,Function 是JS自带的函数对象.下面举例说明 function f1(){}; var f2 = function(){}; var f3 = new Function('str','console.log(str)'); var o3 = new f1(); var o1 = {}; var o2 =new Object

JS面向对象之继承——原型链

原型对象每个javascript对象都有一个原型对象,这个对象在不同的解释器下的实现不同.比如在firefox下,每个对象都有一个隐藏的__proto__属性,这个属性就是“原型对象”的引用. 原型链由于原型对象本身也是对象,根据上边的定义,它也有自己的原型,而它自己的原型对象又可以有自己的原型,这样就组成了一条链,这个就是原型链,JavaScritp引擎在访问对象的属性时,如果在对象本身中没有找到,则会去原型链中查找,如果找到,直接返回值,如果整个链都遍历且没有找到属性,则返回undefi

JS原型与原型链终极详解

一. 普通对象与函数对象 JavaScript 中,万物皆对象!但对象也是有区别的.分为普通对象和函数对象,Object ,Function 是JS自带的函数对象.下面举例说明 function f1(){}; var f2 = function(){}; var f3 = new Function('str','console.log(str)'); var o3 = new f1(); var o1 = {}; var o2 =new Object(); console.log(typeo