作用域和作用域链

执行上下文环境

一、全局

1.变量

console.log(a);//a is not defined

var a;//undefined

var a=10;//undefined

2.this

 var a;
console.log(this);

3.函数声明

console.log(fn);
function fn(){}//函数声明
console.log(fn2);
var fn2=function(){ };//函数表达式

说明:

1.变量:变量的声明,默认赋值为undefined
2.this:赋值
3.函数声明:赋值

二、函数中的变量

 1.函数每被调用一次,都会产生一个新的执行上下文(函数上下文),不同的调用会有不同的参数

 // 自由变量:全局变量在定义、创建时就指明了它的作用域。定义与使用的不同

var a=10;//全局变量
function f(){
    console.log(a);//a是自由变量,
}                   //函数创建时,就确定了它要取值作用域

function f1(){
    var a=34;//局部
    f();
}
 f1();//输出10,而不是34

//函数中的变量
// 函数每被调用一次,都会产生一个新的执行上下文,因为不同的调用可能会有不同的参数
function fr(x){
    console.log(arguments);//[10]
    console.log(x);//10
}
fr(10);



var b=10;//全局

function test2(){

    b=100;//全局变量
    alert(b);//100
    alert(this.b);//100

    alert(b);//100
}

test2();
alert(b);//100

说明:

全局的上下文环境数据内容
     普通变量   声明默认取值undefined
     函数声明     赋值
     this        赋值

局部上下文环境数据内容
     参数                   赋值
     arguments             赋值
     自由变量的取值作业域     赋值

执行上下文栈

执行全局代码时,会产生一个全局上下文环境,每次调用函数是会产生一个函数上下文环境。当函数调用完成时,这个函数的上下文以及全局的上下文会被销毁,再重新回到全局上下文环境,处于活动状态的执行上下文环境只有一个。(压栈 出栈)

      var a=10;//1.进入全局上下文环境
    var fn=function(y){
        var c=5;
        console.log(y+c);
    };
    var bar=function(x){
        var b=5;
       fn(x+b);//进入fn函数上下文环境
    };


    bar(10);//进入bar函数上下文环境

作用域

其中没有变量,要通过作用域对应得执行上下文环境来获取变量的值。在同一作用域下,不同的调用会产生不同的执行上下文环境,从而产生不同变量的值。

   var b=10;//全局
function test2(){

    b=100;//全局变量
    alert(b);//100
    alert(this.b);//100

    alert(b);//100
}

test2();
alert(b);//100

作用域和执行上下文

除了全局作用域之外,每个函数都会创建自己自得作用域。作用域是在函数定义时就已经确定,而不是在函数调用时确定。

var a=10,b=20;
function fn(x){
    var a=100,c=200;
    function fn1(){
        var a=1000,d=4000;
    }
    fn1(200);
    fn1(300);
}
fn(10);

自由变量

x作用域中使用的变量a,却没有在该作用域中声明(即在其他作用域中声明的)对于x作用域来说,a就是自由变量。

var a=10;//全局变量
function f(){
    console.log(a);//a是自由变量,

}                   //函数创建时,就确定了它要取值作用域

作用域链

1.先在当前作用域查找变量a,如果有就获取并结束,否则继续。
2.如果当前作用域是全局作用域,则证明变量x未定义,结束,否则继续。
3.如果是函数作用域(function)就将创建该函数的作用域作为当前作用域。
4.按第一步依次执行

原文地址:https://www.cnblogs.com/alicezq/p/4824127.html