ES6 初识 let、const、ES6兼容、解构赋值

ES6 是ECMAScript就是JavaScript中的语法规范！定义基础的语法、变量、数据类型

let

• 不能对同一变量重复声明定义
• lit声明变量不会变量提升
• 定义的变量块级作用域。一个花括号一个块。
• 函数内不能用let重新声明函数的参数

 

const

• const定义常量不可修改
• 只在块级作用域起作用
• const 不存在变量提升
• 不可重复声明同一个量
• 声明后必要赋值
• 常量是对象的时候，可以改变里面的值，不可以改变对象

 

快速让浏览器兼容ES6的方法

• 利用nodejs进行bable导入
• 启动命令提示符窗口并且输入：npm install babel-core@5，然后回车
• 使用，然后用ie9打开测试
• 

 

解构赋值

ES6允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）。

• 数组的解构赋值
• 可全部赋值，也可赋值部分
• var [a, b, c] = [1, 2, 3];
• console.log(a, b, c);  //1 2 3
• 允许嵌套
•  var [a, b, [c, d], e] = [1, 2, [3], 4, 5];
•  console.log(a, b, c, d, e)  //1 2 3 undefined 4
• 允许有默认值，后面赋值回将其覆盖
• var [a, b, [c, d], e = 1] = [1, 2, [3, 4]];
•   console.log(a, b, c, d, e);     //1 2 3 4 1
•   var [a, b, [c, d], e = 1] = [1, 2, [3, 4], 5];
•  console.log(a, b, c, d, e);      //1 2 3 4 5
• 解构赋值(对象)
• 等号左边是变量名，等号右边不能全是变量名
•  如果有嵌套格式，需要等号两侧格式一致
• 等号右边可以有初始值，想要拿到初始值就不要赋新值
• var { a,  b, c } = { 'a': {'name': 'zhangsan',  'age': '18' }, 'b': 2, 'c': 3}
• console.log(a, b, c);      // {name: "zhangsan", age: "18"} 2 3
• 字符串解构赋值
• var [a, b, c, d, e, f, g, h] = "不想搬宿舍必须我";
•     console.log(a, b, c, d, e);   //不 想 搬 宿 舍
•     console.log(f, g, c)  //必 须 搬
•     console.log(h, a, b)  //我 不 想
• 解构赋值的用途
• 交换变量的值
• var x = 10;
•     var y = 20;
•     [x, y] = [y, x];
•     console.log(x, y);   //20 10
• 提取函数返回的多个值
• function fn1() { 
• return { 'name': '张三', 'age': '22' }
•     }
•     var {  name,   age } = fn1();
•     console.log(name, age);     //张三 22
• 定义函数参数
• function fn2({ a, b, c }) {
•         console.log('姓名：' + a);
•         console.log('身高：' + b);
•         console.log('体重：' + c);  }
•     fn2({ a: "张三",  b: "177cm",   c: "55kg",  d: '学生'  });
• 姓名：张三
•  身高：177cm
• 体重：55kg
• 函数参数的默认值
• function fn3({  name = "马俏桥" }) { consoe.log('姓名：' + name)  }
  •    fn3({});    //姓名：马俏桥