javascript变量声明提升

javascript的变量声明具有hoisting机制,JavaScript引擎在执行的时候,会把所有变量的声明都提升到当前作用域的最前面。

先看一段代码

1
2
3
4
5
var v = "hello" ;
( function (){
   console.log(v);
   var v = "world" ;
})();

这段代码运行的结果是什么呢?
答案是:undefined
这段代码说明了两个问题,
第一,function作用域里的变量v遮盖了上层作用域变量v。代码做少些变动

1
2
3
4
5
var v = "hello" ;
if ( true ){
   console.log(v);
   var v = "world" ;
}

输出结果为”hello”,说明javascript是没有块级作用域的函数是JavaScript中唯一拥有自身作用域的结构。

第二,在function作用域内,变量v的声明被提升了。所以最初的代码相当于:

1
2
3
4
5
6
var v = "hello" ;
( function (){
   var v; //declaration hoisting
   console.log(v);
   v = "world" ;
})();

声明、定义与初始化

声明宣称一个名字的存在,定义则为这个名字分配存储空间,而初始化则是为名字分配的存储空间赋初值。
用C++来表述这三个概念

1
2
3
extern int i; //这是声明,表明名字i在某处已经存在了
int i; //这是声明并定义名字i,为i分配存储空间
i = 0; //这是初始化名字i,为其赋初值为0

javascript中则是这样

1
2
var v; //声明变量v
v = "hello" ; //(定义并)初始化变量v

因为javascript为动态语言,其变量并没有固定的类型,其存储空间大小会随初始化与赋值而变化,所以其变量的“定义”就不像传统的静态语言一样了,其定义显得无关紧要。

声明提升

当前作用域内的声明都会提升到作用域的最前面,包括变量和函数的声明

1
2
3
4
5
6
( function (){
   var a = "1" ;
   var f = function (){};
   var b = "2" ;
   var c = "3" ;
})();

变量a,f,b,c的声明会被提升到函数作用域的最前面,类似如下:

1
2
3
4
5
6
7
( function (){
   var a,f,b,c;
   a = "1" ;
   f = function (){};
   b = "2" ;
   c = "3" ;
})();

请注意函数表达式并没有被提升,这也是函数表达式与函数声明的区别。进一步看二者的区别:

1
2
3
4
5
6
7
8
9
( function (){
   //var f1,function f2(){}; //hoisting,被隐式提升的声明
 
   f1(); //ReferenceError: f1 is not defined
   f2();
 
   var f1 = function (){};
   function f2(){}
})();

上面代码中函数声明f2被提升,所以在前面调用f2是没问题的。虽然变量f1也被提升,但f1提升后的值为undefined,其真正的初始值是在执行到函数表达式处被赋予的。所以只有声明是被提升的。

名字解析顺序

javascript中一个名字(name)以四种方式进入作用域(scope),其优先级顺序如下:
1、语言内置:所有的作用域中都有 this 和 arguments 关键字
2、形式参数:函数的参数在函数作用域中都是有效的
3、函数声明:形如function foo() {}
4、变量声明:形如var bar;

名字声明的优先级如上所示,也就是说如果一个变量的名字与函数的名字相同,那么函数的名字会覆盖变量的名字,无论其在代码中的顺序如何。但名字的初始化却是按其在代码中书写的顺序进行的,不受以上优先级的影响。看代码:

1
2
3
4
5
6
7
8
9
( function (){
     var foo;
     console.log( typeof foo); //function
     
     function foo(){}
 
     foo = "foo" ;
     console.log( typeof foo); //string
})();

如果形式参数中有多个同名变量,那么最后一个同名参数会覆盖其他同名参数,即使最后一个同名参数并没有定义。

以上的名字解析优先级存在例外,比如可以覆盖语言内置的名字arguments。

命名函数表达式

可以像函数声明一样为函数表达式指定一个名字,但这并不会使函数表达式成为函数声明。命名函数表达式的名字不会进入名字空间,也不会被提升。

1
2
3
4
5
f(); //TypeError: f is not a function
foo(); //ReferenceError: foo is not defined
var f = function foo(){console.log( typeof foo);};
f(); //function
foo(); //ReferenceError: foo is not defined

命名函数表达式的名字只在该函数的作用域内部有效。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: 在 JavaScript 中,变量提升指的是在代码执行前,变量声明就已经被提升(即复制)到了当前作用域的最顶端。这意味着,无论变量在代码中定义在哪里,它都会在代码执行前被提升到所在作用域的最顶端。 例如: ``` console.log(a); // undefined var a = 1; ``` 在这个例子中,虽然变量 `a` 实际上定义在了第二行,但是在代码执行前,它已经被提升到了最顶端。所以在第一行中,当我们尝试访问 `a` 时,它已经被声明过了,所以输出 `undefined`。 注意,变量提升仅仅是声明(复制)被提升,而不是赋值。所以在上面的例子中,变量 `a` 的值在第二行被赋值为 1,而不是在第一行被赋值为 `undefined`。 ### 回答2: JavaScript变量提升JavaScript中的一种特性。在JavaScript中,变量声明会在代码执行之前进行处理,也就是说它们会被“提升”到其作用域的顶部。这意味着你可以在声明之前使用变量,而不会引发错误。 例如,假设我们有以下的JavaScript代码: ``` console.log(x); // undefined var x = 5; console.log(x); // 5 ``` 在这个例子中,变量x被提升到了代码的顶部,所以在第一个console.log语句中,x被声明了但尚未被赋值,所以它的值是undefined。然后,变量x被赋值为5,并在第二个console.log语句中打印出来。 需要注意的是,只有变量声明会被提升,而不是它们的赋值。例如: ``` console.log(y); // ReferenceError: y is not defined y = 10; console.log(y); // 10 var y; ``` 在这个例子中,变量y在它的声明之前被使用会引发错误。只有在变量y的声明后,它的赋值才会生效。 变量提升在理解JavaScript的作用域和执行顺序时非常重要。它使得我们可以在变量声明之前使用变量,但也可能导致一些意外的结果,所以在编写代码时要小心使用。 ### 回答3: JavaScript变量提升是指在代码执行之前,所有变量声明都会被提升到代码的顶部。这意味着我们可以在变量声明之前使用这些变量。但是要记住的是,只有变量声明会被提升,而不是初始化。 例如,我们可以在变量声明之前输出变量的值: console.log(x); // undefined var x = 5; 这段代码中,变量x在声明之前被赋值为undefined,因此在打印x时,它的值是undefined。 变量提升还可以应用于函数声明。我们可以在函数声明之前调用函数: myFunction(); // "Hello, World!" function myFunction() { console.log("Hello, World!"); } 在这个例子中,函数myFunction在声明之前被调用,所以我们可以在调用函数之前定义它。 需要注意的是,变量提升仅适用于使用var关键字声明变量,而不适用于使用let和const关键字声明变量。使用let和const声明变量是块级作用域的,不会被提升。 综上所述,JavaScript变量提升是一种将变量声明提升到代码顶部的机制,使我们可以在变量声明之前使用这些变量。这在代码书写和阅读上提供了一定的便利,但也需要注意一些细节,以避免出现意料之外的问题。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值