var、let、const的区别

1、重复声明  var定义的全局变量可被后面定义的相同名称的变量覆盖,可以重复声明,而let、const不能重复声明,也不能跟var混合声明。

var a = 1
var a = 2
console.log(a) // 2

let b = 1
let b = 2
console.log(b)  // 报错 Uncaught SyntaxError: Identifier 'b' has already been declared   b 已经被声明

const c = 1
const c = 2
console.log(c) // 报错 Uncaught SyntaxError: Identifier 'c' has already been declared   c 已经被声明

var d = 3
let d = 4 // 会报错

2、var 有变量提升,let、const 有暂时性死区,必须先声明再使用 【严格来说每一种语言的变量都会有提升,但是let、const有个暂时性死区,所以直观感觉就是let、const好像没提升一样,在定义之前使用会报错。】

暂时性死区,指变量提升到代码的第一行到声明变量的那一行代码之间形成一个死区,访问变量会报错。

console.log(a)
var a = 1 // undefined
    // 等同于
var a
console.log(a)
var a = 1

console.log(b)
let b = 1  // 报错  Uncaught ReferenceError: Cannot access 'b' before initialization

console.log(c)
const c = 1 // 报错  Uncaught ReferenceError: Cannot access 'c' before initialization

3、块级作用域  var 在函数作用域中有效,let、const只在所处的块级作用域中有效

for(var y = 0;y<10;y++){}
console.log(y)// 10
for(let i = 0;i<10;i++){}
console.log(i)//i is not defined
        

4、let 声明的是变量可以更改变值,const声明的是常量,值不能更改值

5、污染全局   var 声明的变量是挂载到window上的,let虽然不会污染全局但是跨script标签也是能访问到的

<script>
        var a = 1
        let b = 2
    </script>
    <script>
      console.log(a) //能访问到
      console.log(b) //能访问到
    </script>

 

6、题外:在函数内外使用的var

var name = 'world';
    function changeName(){
      console.log('函数的  '+name) //如果函数内部没有变量name 那么打印的name是 world,因为会从外部找。如果内部声明了name,那么打印的是undefined,因为内部声明了变量,变量提升
      var name = 'lili'
      console.log(name)//lili
      // 总结:函数内部声明的变量名与外部全局变量名相同时,内部声明的变量只能在函数内部生效,与外部全局变量无关,互不影响。
    }
    changeName()
    console.log(name);//world 没改变 
    (function(){
      console.log('匿名函数的 '+name) // undefined 是因为函数内部声明了name 如果没有var name = 'Jun' 将打印 world
      if(typeof name === 'undefined'){
        var name = 'Jun'
        console.log('hello ' + name)
      }else{
        console.log('去死吧' + name)
      }
    })()// 打印出来是  lello Jun
    console.log(name) // word 因为外部的变量不会因为函数内部重新声明的变量而改变
    //js 中代码的运行会先检查、装载,即声明变量、函数等操作,然后再进入执行阶段,变量赋值属于执行阶段,
    //匿名函数自执行会在声明后直接执行

 

posted on 2022-08-18 11:25  会喷火的大魔王  阅读(130)  评论(0编辑  收藏  举报