技术栈

主页 > 前端开发 >

js变量和函数声明提升

js代码分为两个阶段:预解析阶段和执行阶段
预解析阶段会找到所有的声明,将这些声明从代码中出现的位置移动到当前执行环境的顶部并用合适的作用域将它们关联起来,这就叫做提升。

一、变量声明提升
console.log(a)// Uncaught ReferenceError: a is not defined

如果就这么输出的话,控制台肯定飘红报错,此时的a是没有被声明的,也没办法进行变量提升。但是,如果这样:

console.log(a)//undefined
var a=0;
console.log(a)//0

控制台没有报错,第一个输出为undefined,字体颜色为灰色,此时a被提升声明了,但没有赋值;而第二个输出为0,此时a 才被赋值!
由此说明只有声明操作会被提升,赋值和逻辑操作会被留在原地等待执行!
那么实际的处理过程应该是:

var a;
console.log(a)//undefined
a=0;
console.log(a)//0
二、函数声明提升
aa();
function aa(){
     console.log('11111');
}

和变量声明提升一样,预解析的时候先声明这个函数再执行,那么实际的处理过程是这样:

function aa(){
     console.log('11111');
}
aa();
三、函数表达式声明提升

大家都知道,函数表达式不像函数一样声明了就能调用,因为还有个执行赋值的过程,例如下面这个例子:

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

运行的时候就会报TypeError,因为test 被调用时只是一个变量,并不是函数,正确的写法应该是:

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

注意下,上述例子中第一个test的输出是undefined,说明test变量当时已经被声明了。由此可得出:函数表达式的提升和变量的提升是一样的。那么实际的处理过程是这样的:

var test ;
console.log(test);
test = function () {
      console.log('test');
}
test();
责任编辑:admin  二维码分享:
本文标签: testconsolelog声明function提升
点击我更换图片

评论列表