JavaScript 之 执行上下文

2019-11-05  本文已影响0人  _一九九一_

先介绍变量的存放

栈数据结构 :
堆 :
队列

栈堆练习题

a、b都是基本类型,它们的值是存储在栈中的,a、b分别有各自独立的栈空间,修改不影响

var a = 20;
var b = a;
b = 30;

// 这时a的值是多少? 20

a、b都是引用类型,栈内存中存放地址指向堆内存中的对象,引用类型的复制会为新的变量自动分配一个新的值保存在变量对象中,但只是引用类型的一个地址指针而已,实际指向的是同一个对象,所以修改b.name的值后,相应的a.name也就发生了改变。

var a = { name: '前端' }
var b = a;
b.name = '开发';

// 这时a.name的值是多少   '开发'

null是基本类型,a = null之后只是把a存储在栈内存中地址改变成了基本类型null,并不会影响堆内存中的对象,所以b的值不受影响

var a = { name: '前端开发' }
var b = a;
a = null;

// 这时b的值是多少  '前端开发'

执行上下文

模拟执行上下文栈

ECStack = [];

ECStack = [
    globalContext
];
function fun3() {
    console.log('fun3')
}

function fun2() {
    fun3();
}

function fun1() {
    fun2();
}

fun1();
// 伪代码

// fun1()
ECStack.push(<fun1> functionContext);

// fun1中竟然调用了fun2,还要创建fun2的执行上下文
ECStack.push(<fun2> functionContext);

// fun2还调用了fun3
ECStack.push(<fun3> functionContext);

// fun3执行完毕
ECStack.pop();

// fun2执行完毕
ECStack.pop();

// fun1执行完毕
ECStack.pop();

// javascript接着执行下面的代码,但是ECStack底层永远有个globalContext

变量提升

foo;  // undefined
var foo = function () {
    console.log('foo1');
}

foo();  // foo1,foo赋值

var foo = function () {
    console.log('foo2');
}

foo(); // foo2,foo重新赋值

函数提升

foo();  // foo2
function foo() {
    console.log('foo1');
}

foo();  // foo2

function foo() {
    console.log('foo2');
}

foo(); // foo2

声明优先级,函数 > 变量

foo();  // foo2
var foo = function() {
    console.log('foo1');
}

foo();  // foo1,foo重新赋值

function foo() {
    console.log('foo2');
}

foo(); // foo1
上一篇下一篇

猜你喜欢

热点阅读