var, let ,const区别

Posted 2022-05-29 tonyhao

　　es6新增了let和const新命令,用于变量的声明,这两个和es5的var存在着差异,而且let和const也有着一些区别,既然他两是es6新增的方法那就有他们的独特之处,让我们来看看一看吧.

　　首先我们得先了解var的作用,var声明的变量可以改变,而且需要初始值否则会报undefined，这里存在着变量提升

``js
 var a = 1;
 console.log(a)//a：1
 function outPut()
 var a= 4;
 console.log(a)//a:4 
 
outPut() 
console.log(a)//a：4
``js
console.log(b)//undefined
var b = 1；　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　

　　知道了var之后我们来了解下let和const的特性吧，var和let/const比较如下

　　1.块级作用域

　　2.不存在变量提升

　　3.暂时性死区

　　当初不是很明白为什么需要块级作用域,往往代码比文字更有说服力

function f1()  
let n = 5; 
if (true) 
 let n = 10;
 console.log(n); // 10 内层的n
  
console.log(n); // 5 当前层的n 

　　这样就很好的解决了全局变量污染的问题了

　　再来个给力的栗子,你就更加明白了var和let的区别了,如下

 // var
    for(var i=0;i<5;i++)
           setTimeout(function()
               console.log("var：" + i);//5,5,5,5,5
          )
    

       // let
    for(let i=0;i<5;i++)
           setTimeout(function()
               console.log("let" + i);//1.2,3,4,5
          )
    

　　这样是不是就明白了let和var的区别呢,那在es6之前如何解决这个问题的呢,那我们得使用闭包了

for(var i=0;i<5;i++)
        (function(i)
           setTimeout(function()
               console.log("var" + i);//1,2,3,4,5
          )
        )(i);

　　现在我们来了解下暂时性死区和不存在变量提升，只要一进入当前作用域，所要使用的变量就已经存在了，但是不可获取，只有等到声明变量的那一行代码出现，才可以获取和使用该变量

var tmp = 123; // 声明
if (true) 
  tmp = ‘abc‘; // 报错 因为本区域有tmp声明变量
  let tmp; // 绑定if这个块级的作用域 不能出现tmp变量

　　暂时性死区和不能变量提升的意义在于:

　　为了减少运行时错误，防止在变量声明前就使用这个变量，从而导致意料之外的行为

　　最后我们来聊一聊const吧,

　　1.声明时候必须赋值

let p; var p1; // 不报错
const p3 = ‘马上赋值‘
const p3; // 报错 没有赋值

　　2.const一旦声明值就不能改变，const所说的一旦声明值就不能改变，实际上指的是：变量指向的那个内存地址所保存的数据不得改动

　　这些都是借鉴大佬的文章方便自我学习已经复习的