ECMAScript6简介——let和 const命令

ECMAScript6简介

    • Babel转码器
    • let和 const命令
    • 块级作用域
    • const命令
    • 本质
    • ES6声明变量的六种方法
    • 顶层对象的属性

Babel转码器

babel是一个广泛使用的ES6转码器,可将ES6转化为ES5,从而在现有的环境执行:

  • 实例
    ECMAScript6简介——let和 const命令_第1张图片
  • 命令行转码babel-cli
    Babel提供babel-cli工具,用于命令行转码

安装命令如下(全局):

1 $ npm install --global babel-cli

安装命令如下(安装在项目中:):

1. #安装
2. $ npm install --save-dev  babel-cli 

let和 const命令

let命令

· 基本用法:

  1. 用来声明变量,用法与var相似,但是所声明的变量只在let代码块内有效
 {
 var a = 1;
 let  b = 2;
 }
//使用let命令定义的变量在代码块外无效

for循环的计数器,很适用于使用let命令

·不存在变量提升

  1. var命令会发生"变量提升"现象,即变量可以在声明前使用,值为undefined,而let命令改变了这种语法行为,他所声明的变量一定要在声明后使用,否则报错。

· 暂时性死区

  1. 只要块级作用域内存在let命令,它所声明的变量就"绑定"这个区域,不再受外部影响。

· 不允许重复声明

  1. let不允许在相同作用域内,重复声明同一个变量

块级作用域

  1. 应该避免在块级作用域内声明函数。如果确实需要,也应该写成函数表达式,而不是函数声明语句。
  2. ES6 的块级作用域允许声明函数的规则,只在使用大括号的情况下成立,如果没有使用大括号,就会报错。

const命令

基本用法:

  1. const声明一个只读的常量,一旦声明,常量的值就不能改变。

报错:

const PI = 3.1415;
PI 

PI = 3;
  1. const声明的变量不得改变值,这意味着,const一旦声明变量,就必须立即初始化,不能留到以后赋值。对于const来说,只声明不赋值,就会报错。
  2. const的作用域与let命令相同:只在声明所在的块级作用域内有效。
  3. const命令声明的常量也是不提升,同样存在暂时性死区,只能在声明的位置后面使用。
  4. const声明的常量,也与let一样不可重复声明。
var message = "Hello!";
let age = 25;
//以下两行都会报错
const message = "GoodBye!"
const age = 30;

本质

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

const a = [];
a.push('hi');    // 可执行
a.length = 0;    // 可执行
a = ['hello'];   // 报错

常量a是一个数组,这个数组本身是可写的,但是如果将另一个数组赋值给a,就会报错。

ES6声明变量的六种方法

  1. ES5只有两种声明变量的方法:var命令和function命令。ES6除了添加letconst命令,还有另外两种声明变量的方法:import命令和class 命令,所以ES6一共有六种声明变量的方法。

顶层对象的属性

  1. 顶层对象,在浏览器环境指的是window对象,在Node指的是global对象,ES5之中,顶层对象的属性与全局变量是等价的。
window.a = 1;
a   //1

a = 2;
window.a   //2

你可能感兴趣的:(react,reactjs)