JavaScript变量提升

此文章首发于segmentfault,若有转载引用,请务必私信告知,并注明出处:https://segmentfault.com/q/1010000005921127

  1. 变量的问题,莫过于声明和赋值两个步骤,而这两个步骤是分开的。
  2. 函数声明被提升时,声明和赋值两个步骤都会被提升,而普通变量却只能提升声明步骤,而不能提升赋值步骤。
  3. 变量被提升过后,先对提升上来的所有对象统一执行一遍声明步骤,然后再对变量执行一次赋值步骤。而执行赋值步骤时,会优先执行函数变量的赋值步骤,再执行普通变量的赋值步骤。
    当你明白这三点后,一切都豁然开朗了。

首先来看一个DEMO:

(function(){

        function a(){};
        var a;
        alert(typeof a); //function
    })();

先提升两个a,然后执行函数的赋值步骤,a没有被赋值,故结果为function

再看一个:

 (function(){
        alert(typeof a);//function
        function a(){};
        var a = 1;

    })();

先提升两个a,再执行函数的赋值步骤,因为在alert语句执行以前,还未执行a = 1的赋值步骤,函数不会被覆盖,故为function

来个最有说服力的:

(function(){
            var a = 1;
            function a(){};
            alert(typeof a); //number
        })();

在alert语句执行之前,a = 1步骤和函数赋值步骤均已执行,而且函数还在a = 1赋值语句之后,但是仍然输出number,就是因为函数的赋值步骤会先于a = 1的赋值步骤,函数被覆盖,故输出number。

一切关乎变量提升的代码,用这三点没有解释不清楚的。
以上。
欢迎拍砖...

时间: 2024-12-13 17:59:55

JavaScript变量提升的相关文章

回归基础: JavaScript 变量提升

from me: javascript的变量声明具有hoisting机制,它是JavaScript一个基础的知识点,也是一个比较容易犯错的点,平时在开发中,大大小小的项目都会遇到. 它是JavaScript引擎在执行的时候,把所有变量的声明都提升到当前作用域的最前面. 当然了,函数声明也是可以被提升的.然后,函数表达式却没有提升. 原文:Back to Basics: JavaScript Hoisting 译文:回归基础: JavaScript 变量提升 变量声明是所有的编程语言中最基础部分之

JavaScript变量提升及作用域

今天在知乎看前端面试题的时候,看到这样的问题,发现自己懂的真的是太少了,看了给的例子,所以写一下自己的理解. 首先放一段代码: var v= "hello JavaScript"; alert(v); 很明显,这样的是会弹出对话框: 将alert(v)写到一个函数中: var v= "hello JavaScript"; function test(){ alert(v); }; test(); 这样弹出的结果肯定也是和第一个一样:那么下面这种方式输出的结果是什么?

对javascript变量提升跟函数提升的理解

在写javascript代码的时候,经常会碰到一些奇怪的问题,例如: console.log(typeof hello); var hello = 123;//变量 function hello(){//函数声明 } console.log(typeof hello); var hello = function(){//函数表达式 } console.log(typeof hello);//function number function 对于为什么会是这样的一个结果:function numb

javascript变量提升详解

js变量提升 对于大多数js开发者来说,变量提升可以说是一个非常常见的问题,但是可能很多人对其不是特别的了解.所以在此,我想来讲一讲. 先从一个简单的例子来入门: a = 2; var a; console.log(a); 你觉得以上的代码会输出什么?是输出undefined吗?如果是按照程序的自上而下执行的话,那么这一段代码确实是输出undefined.然而,javascript并不是严格的自上而下执行的语言. 这一段代码的输出结果是2,是不是感到很意外?为什么会这样呢?这个问题的关键就在于变

JavaScript 变量提升

变量提升(Hoisting):在ES6之前,函数声明和变量声明总是被JavaScript解释器隐式地提升(hoist)到包含他们的作用域的最顶端. 注意: 1. JavaScript 仅提升声明,而不提升初始化.2. ES6 中不存在变量提升的概念. 1. 变量提升 变量未声明: function fn () { console.log(name); } fn(); // 报错: ReferenceError: name is not defined 变量在使用后声明: function fn

关于JavaScript变量提升的理解

废话不说,直接上代码(这是在JavaScript面对对象编程指南上面看到的一个例子) var a=123; function f(){ alert(a); var a=1; alert(a); } f(); 书上的解释是这样的:当JavaScript执行过程进入新函数时,这个函数内被声明的所有变量都会被移动导到函数最开始的地方.这种现象叫做提升.且被提升的只有变量的声明. 上面这个例子可以等价于: var a=123;function f(){ var a; alert(a); a=1; ale

JavaScript变量提升演示样例

直接先看两段代码 function getSum() { var sum = a + b; var a = 1; var b = 2; return sum; } getSum(); function getSum() { var sum = a + b; a = 1; b = 2; return sum; } getSum(); 大家能够先看一下这两段代码的异同,并推断一下运行后分别得到的结果. 在运行第一段代码时,得到的NaN,这是由于在函数中变量声明被提升的结果.在运行"sum = a +

JavaScript变量提升示例

直接先看两段代码 function getSum() { var sum = a + b; var a = 1; var b = 2; return sum; } getSum(); function getSum() { var sum = a + b; a = 1; b = 2; return sum; } getSum(); 大家可以先看一下这两段代码的异同,并判断一下执行后分别得到的结果. 在执行第一段代码时,得到的NaN,这是因为在函数中变量声明被提升的结果,在执行"sum = a +

JavaScript 变量和函数提升问题总结

一 什么是JavaScript 变量提升? -- JS程序运行时, (a)变量的声明会被解释器"提升"到方法体内的顶部,初始化赋值操作不提升按顺序执行 (b)函数体内未声明的变量,解释器会在函数体外声明变量,成为全局变量 (c)声明过的函数,整个函数体会被解释器提升到方法体的顶部,初始化赋值操作按顺序执行 1-1 变量提升 eg:变量的声明提升,初始化赋值不提升. <script> console.log(a); // undefined var a=3; // 若没有va