ES6学习笔记

摘要：学习笔记在学习的过程中做的一些记录，用于未来的快速回忆。数组成员为时，默认值仍会生效因为在内部使用严格相等运算符，判断一个位置是否有值，所以当一个数组成员严格等于默认值才会生效。

在学习ES6的过程中做的一些记录，用于未来的快速回忆。

ES6新增块级作用域的概念（一个大括号括起来的部分就是一个块作用域）

let与const用于在块级作用域中声明变量，该变量仅在当前块级作用域有效

ES6强制启用严格模式，变量未声明不允许使用

let关键词用于声明变量

const关键词用于声明常量，声明时必须赋值

let&const关键词不能在同一个块级作用域内重复声明一个变量

const定义的基本类型常量不能被修改，但是引用类型常量内部的值能被修改，只要不改变常量的引用即可

ES6允许按照一定模式，从数组和对象中提取值，对变量进行赋值。

// 完全解构
//本质上这种写法属于‘模式匹配‘，只要等号两边的模式相同，左边的变量就会被赋予对应的值
let [a,b,c] = [1,2,3];        // a=1,b=2,c=3
let [a,[b]] = [1, [2]];        // a=1,b=[2]
let [,,a] = [1,2,3];        // a=3
let [d,...rest] = [1,2,3,4,5,6];    // d=1,rest=[2,3,4,5,6]
// 解构不成功
// 如果解构不成功，变量的值就等于undefined
let [x,y] = ["xy"]    //x="xy",y=undefined
// 不完全解构
let [i,j] = [1,2,3];    // i=1,j=2
//如果等号的右边不是数组，或者说不是可遍历的结构，那么将会报错
let [a] = 1;    // 这里会报错：Uncaught TypeError: 1 is not iterable

解构赋值允许有默认值。

let [x,y="b"] = ["a"];
console.log(y); //b

let [x,y = "b"] = ["a",undefined];
console.log(y); //b 
// 数组成员为undefined时，默认值仍会生效
// 因为在ES6内部使用严格相等运算符‘===‘，判断一个位置是否有值，
// 所以当一个数组成员严格等于undefined,默认值才会生效。

let [x,y = "b"] = ["a",null];
console.log(y); //null
// 如果一个数组成员是null,默认值就不会生效，因为null不严格等于undefined

对象的解构与数组有一个重要的不同，数组的元素是按次序排列的，变量的取值由它的位置决定；而对象的属性没有次序，变量必须与属性同名，才能取到正确的值。

// 变量名与属性名一致的情况下
let {foo,bar} = {foo : "aaa",bar : "bbb"}
console.log(foo); //aaa
console.log(bar); //bbb
// 实际上 对象的解构赋值是以这样的形式简写的
let {foo : foo ,bar : bar} = {foo : "aaa",bar : "bbb"}
// 变量名与属性名不一致的情况下，必须这样写
let {a : name, b : age} = {a : "zhangsan", b : 33};
console.log(name); //zhangsan
console.log(age);  //33

对象的解构赋值的内部机制，是先找到同名属性，然后再赋值给对应的变量，真正被赋值的是后者，而不是前者，第一个foo/bar 是匹配的模式，对应的foo/bar属性值才是变量，真正被赋值的是属性值（也就是第二个foo/bar)。

const [a,b,c,d,e] = "hello";
console.log(a); //h
console.log(b); //e
console.log(c); //l
console.log(d); //l
console.log(e); //o

let { length : len} = "yahooa";
console.log(len); 
//类似数组的对象都有一个length属性，还可以对这个属性解构赋值

解构赋值时，如果等号右边是数值和布尔值，则会先转为对象，但是等号右边为undefined 和 null时无法转为对象，所以对他们进行解构赋值时，都会报错。

let {prop : x } = undefined;
console.log(x);
//报错：Uncaught TypeError: Cannot destructure property `prop` of "undefined" or "null"

function move({x = 0,y = 0} = { }){
    return [x,y];
 }
console.log(move({x : 3,y : 4})); //[3,4]
console.log(move({x : 3})); //[3,0]
console.log(move({})); //[0,0]
console.log(move()); //[0,0]
// move()的参数是一个对象，通过对这个对象进行解构，得到变量x、y的值，如果解构失败，x和y 等于默认值
function move2({x,y} = {x : 1, y : 2 }){
    return [x,y];
}
console.log(move2({x : 6,y : 8})); //[6,8]
console.log(move2({})); //[undefined,undefined]
console.log(move2()); //[1,2]
// move2() 是为函数move的参数指定默认值，而不是为变量x和y指定默认值，
// 所以与前一种写法的结果不太一样，undefined 就会触发函数的默认值

改变变量的值

let x = 1;
let y = 2;
[x,y] = [y,x];    // x=2, y=1

从方法返回多个值

function example(){
  return {
      foo : "a",
      bar : "b"
  }
} 
let {foo,bar} = example();    // foo="a",bar="b"
function example222(){
  return [1,2,3,4,5];
} 
let [a,,...b] = example222();    // a=1, b=[3,4,5]

函数参数的定义

//参数是一组有次序的值
function example([x,y,z]){
    return x + y + z;
}
example([1,2,3])
console.log(example([1,2,3])); //6
//参数是一组无次序的值
function f({x,y,z}){
    return x + y + z;
}
f({x : "a", z : "b", y : "c" });
console.log(f({x : "a", z : "b", y : "c" })); //acb

提取JSON数据

函数参数的默认值

输入模块的指定用法

// ES5 的方式
let reg = new RegExp("xyz", "i");
let reg2 = new RegExp(/xyz/i);
reg.test("xyz123");        // true
reg.test("xyz123");        // true
// ES6 方式的变化，可以有第二个参数用作修饰符
// 这种方式，第二个参数的修饰符会覆盖第一个正则表达式的修饰符
let reg3 = new RegExp(/xyz/ig, "i")
reg3.flags        // i

// u -> unicode，用于处理unicode编码的正则匹配
// unicode中4个字节 = 一个字母
/^uD83D/.test("uD83DuDC2A");         // true uD83DuDC2A 被当做两个字母来处理
/^uD83D/u.test("uD83DuDC2A");    // false，uD83DuDC2A 被当作一个字母来处理
// 正则中，大括号里面若是unicode编码，需添加u修饰符才能被识别
/u{61}/.test("a");        // false
/u{61}/u.test("a");    // true
// 用"."操作符识别大于两个字节的字符需要加上u修饰符
// "."操作符不能处理换行符/回车符/行分隔符/段分隔符
/^.$/.test("吉")；    // false
/^.$/u.test("吉")；    // true
/吉{2}/.test("吉吉");    // false
/吉{2}/u.test("吉吉");    // true
// 凡是超过两个字节的匹配都需要添加 u 修饰符

let s = "bbb_bb_b";
let a1 = /b+/g;
let a2 = /b+/y;
a1.exec(s);        // g修饰符全局匹配，不强调从下一个字符开始匹配，只要接下来的字符能匹配成功就ok
a2.exec(s);        // y修饰符全局匹配，必须紧跟着下一个字符开始匹配
// sticky属性用于判断是否开启了y修饰符
a1.sticky;        // false
a2.sticky;        // true

未实现，仅作为提案

// "."操作符不能处理换行符/回车符/行分隔符/段分隔符
// 但添加 s 修饰符就可以

console.log(`u0061`);            // a
console.log(`u20887`);            // []7，会将20087拆成2008 / 7
console.log(`u{20887}`);        //