ES6新增语法(一)——let、const、var的区别

ES6简介 ES6是ECMAScript 6.0的简称,是javascript语言的下一代标准,已经在2015年6月正式发布上线。目的就是为了统一javascript的语法标准,可以用来开发大型应用程序,称为企业级开发语言。
ES6与JavaScript的关系:
ES6是JavaScript的规范标准,JavaScript是ES6的一种实现。
变量/赋值 块级作用域{}
ES5中作用域有:全局作用域、函数作用域,没有块作用域的概念。ES6新增了块级作用域,块作用域由{}包括,if语句里面的{}也属于块级作用域。

//通过定义的变量可以跨块作用域访问到 { var a = 12; console.log("a",a) } console.log("a",a)

//通过var定义的变量不能通过跨函数作用域访问到 (function(){ var b = 5; })() console.log("b",b) // not defined

var 与 let 和 const 区别:
类型 定义 变量类型 作用域
var 可以重复定义 是变量,不能限制修改 没有块级作用域
let 不能重复定义 是变量 块级作用域,不能跨块访问
const 不能重复定义 是常量,初始化时必须赋值 块级作用域,不能跨块访问
const定义的对象属性是否可以改变?
实例1:修改对象的属性值。
const per = { name:'倩倩' } per.name = "我是嘻哈" console.log("per.name",per.name) //打印出我是嘻哈

通过上个实例,我们发现对象的属性是可以修改的,这是什么原因呢?
对象是引用类型的,per中保存的仅是对象的指针,意味着指针不会发生改变,修改对象的属性不会改变对象的指针,所以是允许修改的。
赋值:新增解构赋值,就是对数据拆解并赋值。解构赋值的两个规则:
  • 左右两边模式必须一致
  • 必须让定义和赋值同步完成。
实例2:正确的结构赋值
let [a,b,c] = [1,2,3] console.log("a",a)//1 console.log("b",b)//2 console.log("c",c)//3

实例3:左右两边模式一致,数据长短不同时
let [bar, foo] = [1]; console.log("bar",bar)//1 console.log("foo",foo) // undefined

上述解构不成功,变量值等于undefined。
注意:对象也是可以解构的,但是需要注意的是对象和数组的解构有很大的区别,对象的属性没有次序,变量必须与属性同名,才能取到正确的值。
【ES6新增语法(一)——let、const、var的区别】实例4:对象的解构赋值
let { bar,foo } = { foo:'aaa', bar:'bbb' } console.log('bar',bar) console.log('foo',foo) console.log('baz',baz) // not defined

    推荐阅读