let 和const与var的不同

1. let的作用域在代码块中仅限在当前的作用于中

1 {
2     var str1 = 12;
3     console.log(str1);  //12
4     let str2 = 20;
5     console.log(str2);  //20              
6 }
console.log(str1); //12
console.log(str2); //报错

2. let的变量不会被提升

 1 {
 2       console.log(str1);  //undedfined
 3       var str1 = 12;
 4      //等同于
 5      var str;
 6      console.log(str1);
 7      str1 = 12;  
 8       
 9       console.log(str2);   //报错 未定义
10       let str2 = 20; 
11       //等同于
12       console.log(str2);
13       let str2;
14       str2 = 20;   
15 }

3. let 不能重复声明

 1 {
 2     var str1 = 12;
 3     var str1 = 15;
 4     console.log(str1);   //15
 5 
 6     let str2 = 20;
 7     let str2 = 25;
 8     console.log(str2);  //报错 不能声明两个相同的变量
 9 
10     //整个内容一起运行的时候上边的代码不会执行结果,因为实在解析str2的时候出错的
11 }

4. let的父子作用域

//  假设有5个按钮
var btns = document.getElementsByTagName("button");


for (var i = 0; i < btns.length; i++) {
    btns[i].onclick = function (){
        console.log(i);  //始终为5
    }   
}
// 如果要想实现显示点击的第几个要用到闭包
for (var i = 0; i < btns.length; i++) {
   (function(i){
        btns[i].onclick = function (){
            console.log(i);  //从0开始点击那个显示第几个
    }   
    })(i)
}

// 用let
let btns = document.getElementsByTagName("button");
for (let i = 0; i < btns.length; i++){
   btns[i].onclick = function (){
            console.log(i);  //从0开始点击那个显示第几个
    }   
}

// 再看一个例子
for(let i = 0; i < 5; i++){
    let i = 20;
    console.log(i);  //20 输出5次  (如果改为var 只会输出一次20)
}

5. const(一般声明常量)

const 与let 类似,有几个相同点,就不在粘贴代码了

1)  只在当前代码块作用域中有效

2)  不会被提升

3)  不能重复声明

不同之处

1)声明的时候必须赋值如下

const name = "张三";
console.log(name);
// 下面这样会报错
const name;
name = "张三";
console.log(name); // 报错

2)声明的值不能修改(对象除外)

const name;
name = "张三";
console.log(name);  // 报错

// 如果是对象的话可以修改,因为对象是存放的时堆内存
const obj = {
  name: "张三"
}
console.log(obj.name); //  张三
obj.name = "李四";
console.log(name);  //李四

 PS:我是一个新手,写这个除了分享外,也算是自己做的一个笔记,欢迎各位的大神指点,内容浅显,不喜勿喷,如果有错误,请指点

posted @ 2017-11-15 18:13  花开不败886  阅读(168)  评论(0)    收藏  举报