let 和 const 命令知识整理

let命令整理

(1)let 和const用于定义变量。let类似于之前的var。const是定义常量的。
(2)ES6 新增了let命令,用来声明变量。它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效。
<script>
{
    var a = 12;
    let b =10;
}
console.log(a)
console.log(b)
</script>
(3)let使用在for循环中
//let使用for循环参数里只能在循环内部使用
 for(let i=0;i<=5;i++){
     console.log(i)
 }
 console.log(i) //not  defined
(4)let在for循环添加事件中最典型的使用方式
var btns = document.getElementsByTagName('button');
for(let i=0;i<btns.length;i++){
    btns[i].onclick = function(){
        console.log(i)
    }
}
(5)let 在for循环作为循环参数的时候,其实是俩个作用域,大括号里面的是子作用域,如果里面再次定义与循环参数相同的变量,则不会产生相互影响。
//for其实是俩个作用域,大括号里面是一个子作用域
for(let i=0;i<=3;i++){
    let i = 'a';
    console.log(i);
}
(6)let不存在变量提升,let命令改变了语法行为,它所声明的变量一定要在声明后使用,否则报错。
console.log(a) //not defined
let a = 12;

暂时性死区

(7)ES6 明确规定,如果区块中存在let和const命令,这个区块对这些命令声明的变量,从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量,就会报错。
在代码块内,使用let命令声明变量之前,该变量都是不可用的。这在语法上,称为“暂时性死区“,let不允许重复定义一个变量。
总之,在代码块内,使用let命令声明变量之前,该变量都是不可用的。这在语法上,称为“暂时性死区”(temporal dead zone,简称 TDZ)。
//大括号括起来的称之为块作用域,有循环  switch结构 if结构
for(let i =0;i<3;i++){
    console.log(i)
    // let i ='a';
    let i = '123';
}

块级作用于

为什么需要块级作用域?

(8)ES5 只有全局作用域和函数作用域,没有块级作用域,这带来很多不合理的场景。
(9)ES5 规定,函数只能在顶层作用域和函数作用域之中声明,不能在块级作用域声明。
浏览器没有遵守这个规定,为了兼容以前的旧代码,还是支持在块级作用域之中声明函数,因此上面两种情况实际都能运行,不会报错。
if(true){
    function say(){
        console.log(1)
    }
}
say();  //1
(10)ES6 引入了块级作用域,明确允许在块级作用域之中声明函数。ES6 规定,块级作用域之中,函数声明语句的行为类似于let,在块级作用域之外不可引用。
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
    <script type="text/babel">
    // Your ES6 code
    if(true){
        function say(){
            console.log(1)
        }
    }
    say();
    </script>
为了减轻因此产生的不兼容问题,ES6 在附录 B里面规定,浏览器的实现可以不遵守上面的规定,有自己的行为方式。
1.允许在块级作用域内声明函数。
2.函数声明类似于var,即会提升到全局作用域或函数作用域的头部。
3.同时,函数声明还会提升到所在的块级作用域的头部。

const 命令

基本用法

(1)const声明一个只读的常量。一旦声明,常量的值就不能改变。改变会显示报错
const PI = 3.1415;
PI // 3.1415

PI = 3;
// TypeError: Assignment to constant variable.
const声明的变量不得改变值,这意味着,const一旦声明变量,就必须立即初始化,不能留到以后赋值。对于const来说,只声明不赋值,就会报错
const foo;
// SyntaxError: Missing initializer in const declaration
(2)const的作用域:只在声明所在的块级作用域内有效。
if (true) {
  const MAX = 5;
}

MAX // Uncaught ReferenceError: MAX is not defined
(3)const命令声明的常量也是不提升,同样存在暂时性死区,只能在声明的位置后面使用。
if (true) {
  console.log(MAX); // ReferenceError
  const MAX = 5;
}
(4)const声明的常量不可重复声明。
var message = "Hello!";
let age = 25;

// 以下两行都会报错
const message = "Goodbye!";
const age = 30;

本质

const实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址所保存的数据不得改动。对于简单类型的数据(数值、字符串、布尔值),值就保存在变量指向的那个内存地址,因此等同于常量。但对于复合类型的数据(主要是对象和数组),变量指向的内存地址,保存的只是一个指向实际数据的指针,const只能保证这个指针是固定的(即总是指向另一个固定的地址),至于它指向的数据结构是不是可变的,就完全不能控制了。

ES6 声明变量的六种方法:

ES5 只有两种声明变量的方法:var命令和function命令。ES6 除了添加let和const命令,后面章节还会提到,另外两种声明变量的方法:import命令和class命令。所以,ES6 一共有 6 种声明变量的方法。

链接ECMAScript 6 入门

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。