ES6语法新增的变量的定义

ES6语法
ES6版本的JavaScript语法,是一个非常重要的版本
对于JavaScript的功能上有一个极大的丰富
让JavaScript从弱类型语言,提升到了 半强类型语言

ES6语法新增的变量的定义

let const 关键词定义变量

let 定义变量

特点:
let 定义的变量,不会进行预解析
let 定义的变量,与 forEach() 中的变量类似
每次执行都会定义出一个新的,相互之间不影响的变量
尤其是在循环中,for,forEach,for…in,都最好使用let定义变量
let 不能重复定义变量名称,一个变量名称只能定义一次
let 定义的变量,如果是定义在 { } 中,只能在 { } 中被执行被调用
在 { } 之外,是不能被调用执行的
{ } 包括 if switch for forEach for…in while function
let 在不同 { } 中,是不同作用域中定义let 变量
此时,变量的名称与 其他 { } 中的变量名称,或者{ }之外的变量名称,是可以重复

const 定义变量

在JavaScript中往往,管const定义的变量,称为常量
const定义的变量,不能被重复赋值,数据已经定义,不能更改
const定义的变量名称,也不能重复
const定义在{}中,不能在{}外调用
一般使用 const 定义 对象,数组,函数,引用数据类型
const中存储的是引用数据类型的地址,只要地址不改变,可以改变数组,对象中的单元存储的数据

<ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
    </ul> 
    <script>			
		console.log(int1);   //  var 关键词定义的变量,可以预解析,结果 undefined
		console.log(int2);   //  let 关键词定义的变量,不能徐解析,结果 报错
		var int1 = 100;
		let int2 = 100;

        // 点击不同的li,输出不同的内容 
        var oLis = document.querySelectorAll('li');

        // var 定义的是一个变量,后赋值会覆盖之前的数据
        // 最终i的数值是一个数值,是最终循环结束时,i的数值
       for(var i = 0 ; i <= oLis.length-1 ; i++){
         	 oLis[i].onclick = function(){
            	 console.log(i+1);	//12
     		 }
         }
        
        // 与forEach 是 相同的赋值方式
        // 每次循环都建立一个独立的,相互不影响的 i 变量, 存储对应的数值
        // 每一次点击,不同的标签,调用的是不同的 i变量,输出的是不同的 存储数值
        for(let i = 0 ; i <= oLis.length-1 ; i++){
            oLis[i].onclick = function(){
                console.log(i+1);	//1 2 3 4 5
            }
        }

        // 使用 var 关键词 来定义变量
        // 变量名称可以重复
        var int = 100;
        var int = 200;
        console.log(int);  //200
        
        // 使用 let 关键词 来定义变量
        // 变量名称不能重复
        // 只要是已经定义的,不管是var 还是 let 定义的,都不能重复

        // let int = 300;

        let int1 = 100;
        let int1 = 200;
		console.log(int1);//SyntaxError: redeclaration of let int1

        // 在{} 中,let定义变量
        // 在for循环中,使用var 定义的循环变量
        for(var i = 0 ; i<= 10 ; i++){}
        // 在循环外可以调用循环变量
        console.log(i);	//11

        // 在for循环中,使用let 定义的循环变量
        for(let j = 0 ; j<= 10 ; j++){}
        // 在循环外不能调用循环变量,会报错
         console.log(j);	//ReferenceError: j is not defined

        // if判断中,使用var 定义 变量
        if(true){
            var abc = 'abc';
        }
        // 在if外,只要执行了,就可以调用
        console.log(abc);	//abc

        // if判断中,使用let 定义 变量
        if(true){
            let def = 'def';
        }
        // 在if外,即使执行了,也不能调用
        console.log(def);	//ReferenceError: def is not defined

        // 在不同函数中,定义的let

        function fun1(){
            let str = '北京';
            return str;
        }
        console.log(fun1());	//北京

        function fun2(){
            let str = '上海';
            return str;
        }
        console.log(fun2());	//上海

        if(true){
            let int = 100;
            console.log(int);	//100
        }

        if(true){
            let int = 200;
            console.log(int);	//200
        }
 
        // const定义的变量,一旦赋值,不能改变

        const strstr = 100;
        // 对const定义的变量,重复赋值,会报错
         strstr = 200;	//TypeError: invalid assignment to const `strstr'
         

        // 定义变量的名称,不能重复
        // const strstr = ''

        if(true){
            const sss = 'sss';
            console.log(sss);	//sss
        }
         console.log(sss);	//ReferenceError: sss is not defined

        const arr = [1,2,3,4,5,6];
        // 给数组中第1个单元,修改存储的数据
        // const arr 中存储的数组的地址是不改变的,可以执行的
        arr[0] = '北京';

        console.log(arr);	//Array(6) [ "北京", 2, 3, 4, 5, 6 ]
 
        // 修改对象中,单元存储的数据,不是修改 obj中存储的内存地址,是可以执行的
        const obj = {name:'张三'};
        obj.name = '李四';
        console.log(obj);	//Object { name: "李四" }

总结:

let : 多用于定义 基本数据类型 以及 循环中
const : 多用于定义 引用数据类型
特点:定义的变量名称不能重复
在 { } 和 循环中定义,只能在 { } 和 循环中使用
let会建立独立的,存储不同的,相互不冲突数据的变量
const定义的变量,不能重复赋值,不能修改存储的数据