web前端：js变量的作用域、变量的提升、函数的提升

作者:tiankong1更新于： 2020-02-29 17:04:20

　　变量来源于数学，是计算机语言中能储存计算结果或能表示值抽象概念。变量可以通过变量名访问。在指令式语言中，变量通常是可变的;但在纯函数式语言(如Haskell)中，变量可能是不可变(immutable)的。

　　变量的作用域

　　在函数之外声明的变量，叫做全局变量，因为它可被当前文档中的任何其他代码所访问。在函数内部声明的变量，叫做局部变量，因为它只能在当前函数的内部访问。

　　ECMAScript6之前的Javascript没有语句块作用域；相反，语句块中声明的变量将成为语句块所在函数（或全局作用域）的局部变量。例如，如下的代码将在控制台输出5，因为x的作用域是声明了x的那个函数（或全局范围），而不是if语句块。

　　if(true){

　　varx=5;

　　}

　　console.log(x);//5

　　如果使用ECMAScript6中的let声明，上述行为将发生变化。

　　if(true){

　　lety=5;

　　}

　　console.log(y);//ReferenceError:y没有被声明

　　变量提升

　　JavaScript变量的另一个不同寻常的地方是，你可以先使用变量稍后再声明变量而不会引发异常。这一概念称为变量提升；JavaScript变量感觉上是被“提升”或移到了函数或语句的最前面。但是，提升后的变量将返回undefined值。因此在使用或引用某个变量之后进行声明和初始化操作，这个被提升的变量仍将返回undefined值。

　　/**

　　*例子1

　　*/

　　console.log(x===undefined);//true

　　varx=3;

　　/**

　　*例子2

　　*/

　　//willreturnavalueofundefined

　　varmyvar="myvalue";

　　(function(){

　　console.log(myvar);//undefined

　　varmyvar="localvalue";

　　})();

　　上面的例子，也可写作：

　　/**

　　*例子1

　　*/

　　varx;

　　console.log(x===undefined);//true

　　x=3;

　　/**

　　*例子2

　　*/

　　varmyvar="myvalue";

　　(function(){

　　varmyvar;

　　console.log(myvar);//undefined

　　myvar="localvalue";

　　})();

　　由于存在变量提升，一个函数中所有的var语句应尽可能地放在接近函数顶部的地方。这个习惯将大大提升代码的清晰度。

　　在ECMAScript6中，let（const）将不会提升变量到代码块的顶部。因此，在变量声明之前引用这个变量，将抛出引用错误（ReferenceError）。这个变量将从代码块一开始的时候就处在一个“暂时性死区”，直到这个变量被声明为止。

　　console.log(x);//ReferenceError

　　letx=3;

　　函数提升

　　对于函数来说，只有函数声明会被提升到顶部，而函数表达式不会被提升。

　　/*函数声明*/

　　foo();//"bar"

　　functionfoo(){

　　console.log("bar");

　　}

　　/*函数表达式*/

　　baz();//类型错误：baz不是一个函数

　　varbaz=function(){

　　console.log("bar2");

　　};

　　在一些语言中，变量可能被明确为是能表示可变状态、具有存储空间的抽象(如在java和VisualBasic中);但另外一些语言可能使用其它概念(如C的对象)来指称这种抽象，而不严格地定义"变量"的准确外延。