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({}); //姓名:马俏桥
-