Loading

变量声明

变量声明

在ES6(ES2015)出现之前,JavaScript中声明变量就只有通过 var 关键字,函数声明是通过 function 关键字,而在ES6之后,声明的方式有 var 、 let 、 const 、 function 、 class ,下面我们来讨论 var 、 let 和 const 之间的区别。

var

如果使用关键字 var 声明一个变量,那么这个变量就属于当前的函数作用域,如果声明是发生在任何函数外的顶层声明,那么这个变量就属于全局作用域。

//变量声明
var a = 1;
function func(){
    var a = 2;
    console.log(a);// 局部变量 输出:2
}
func();
console.log(a); // 全局变量 输出:1

如果在声明变量时,省略 var 的话,该变量就会变成全局变量,如全局作用域中存在该变量,就会更新其值。如:

var a = 1;
function func(){
    a = 2;
    console.log(a);// 输出:2
}
func();
console.log(a); // 输出:2

注意:var 声明的变量存在提升(hoisting)。

提升:是指无论 var 出现在一个作用域的哪个位置,这个声明都属于当前的整个作用域,在其中到处都可以访问到。注意只有变量声明才会提升,对变量赋值并不会提升。

let

let 声明的变量,具有如下几个特点:

  1. let 声明的变量具有块作用域的特征。
  2. 在同一个块级作用域,不能重复声明变量。
  3. let 声明的变量不存在变量提升,换一种说法,就是 let 声明存在暂时性死区(TDZ)。

let和var区别的经典案例:

// var
for(var i = 0;i<10;i++){
    setTimeout(function(){
        console.log(i); // 输出10个10
    },100);
}
//let
for(let i = 0;i<10;i++){
    setTimeout(function(){
        console.log(i); // 输出0-10
    },100);
}

原因:var允许重复声明所以输出的为同一个变量;let当函数运行结束局部变量释放,每次都是重新声明的变量。

const

const 声明方式,除了具有 let 的上述特点外,其还具备一个特点,即 const 定义的变量,一旦定义后,就不能修改(对象可以修改),即 const 声明的为常量。

const a = 1;
console.log(a);
a = 2;
console.log(a); // 报错

对象:

const obj = {"id":1,"name":"yyj"}
console.log(obj.id); // 输出:1
obj.id = 4;
console.log(obj.id); // 输出:4

let vs const

使用最小特权原则,所有变量除了你计划去修改的都应该使用const。 基本原则就是如果一个变量不需要对它写入,那么其它使用这些代码的人也不能够写入它们,并且要思考为什么会需要对这些变量重新赋值。 使用 const也可以让我们更容易的推测数据的流动。

posted @ 2022-03-19 11:45  1640808365  阅读(42)  评论(0编辑  收藏  举报