ES6学习

let声明变量

• 使用let声明的变量具有块级作用域
• 使用let声明的变量没有变量提升
• 使用let声明的变量具有暂时性死区
• et 声明的变量不能重复声明

const声明变量

1.一定要赋予初始值
2.一般常量要大写（潜规则） 实际小写并无错 大小写均可
3.常量值不能修改
4.块级作用域
5.对于数组和对象的元素修改 不算对常量的修改 不会报错

变量的解构赋值

	   let [a,b] = [2,3];
       console.log(a,b);//2 3
       let [c,d,e] = [2,3]
       console.log(c,d,e);//2 3 undefined
       let [a,[b,c],[[d,e]]] = [0,[1,2],[[3,4]]];
       console.log(a,b,c,d,e);//0 1 2 3 4
       let [a,[b,c],[[d,e]]] = [0,1,2,3,4];
       console.log(a,b,c,d,e);//undefined is not a function
       let [,,z] = [1,2,3,4,5];
       console.log(z);//3

若是不完全解构，即等号左边的模式，只匹配一部分的等号右边的数组。这种情况下，解构依然可以成功。没有解构的变量的值就等于undefined。

模板字符串

用''符号编写的字符串，称为模板字符串

在模板字符串中，我们可以通过反引号``内编写${变量}的形式将字符串和动态的变量拼接到一起。

const name = "aaa"
const age = 18
 
console.log(`my name is ${name}.I'm ${age} years old`) //my name is aaa.I'm 18 years old

字符串扩展

includes()、startsWith()、endsWith()

• includes()：返回布尔值，表示是否找到了参数字符串。
• startsWith()：返回布尔值，表示参数字符串是否在原字符串的头部。
• endsWith()：返回布尔值，表示参数字符串是否在原字符串的尾部。

let s = 'Hello world!';
 
s.startsWith('Hello') // true
s.endsWith('!') // true
s.includes('o') // true

repeat方法返回一个新字符串，表示将原字符串重复n次。

'x'.repeat(3) // "xxx"
'hello'.repeat(2) // "hellohello"
'na'.repeat(0) // ""

padStart()、padEnd(),padStart()用于头部补全，padEnd()用于尾部补全。

'x'.padStart(5, 'ab') // 'ababx'
'x'.padStart(4, 'ab') // 'abax'
 
'x'.padEnd(5, 'ab') // 'xabab'
'x'.padEnd(4, 'ab') // 'xaba'

数组扩展

扩展运算符（spread）是三个点（…）。它好比 rest 参数的逆运算，将一个数组转为用逗号分隔的参数序列。

console.log(...[1, 2, 3])
// 1 2 3
 
console.log(1, ...[2, 3, 4], 5)
// 1 2 3 4 5
 
[...document.querySelectorAll('div')]
// [<div>, <div>, <div>]

替代数组的 apply 方法
由于扩展运算符可以展开数组，所以不再需要apply方法，将数组转为函数的参数了。

// ES5 的写法
function f(x, y, z) {
  // ...
}
var args = [0, 1, 2];
f.apply(null, args);
 
// ES6的写法
function f(x, y, z) {
  // ...
}
let args = [0, 1, 2];
f(...args);

对象扩展

属性的简洁表示

const foo = 'bar';
const baz = {foo};
baz // {foo: "bar"}

function f(x, y) {
  return {x, y};
}
f(1, 2) // Object {x: 1, y: 2}

定义对象的属性有两种方法

obj.foo = true;

// 方法二
obj['a' + 'bc'] = 123;

ES6允许字面量定义对象时使用方法二作为对象的属性名
表达式还可以用于定义方法名

注意，属性名表达式如果是一个对象，默认情况下会自动将对象转为字符串[object Object]，这一点要特别小心。

const keyA = {a: 1};
const keyB = {b: 2};

const myObject = {
  [keyA]: 'valueA',
  [keyB]: 'valueB'
};

myObject // Object {[object Object]: "valueB"}

函数扩展

在 ES6 之前，不能直接为函数的参数指定默认值，只能采用变通的方法

function log(x, y) {
	y = y || 'World';
	console.log(x, y);
}
log('Hello') // Hello World
log('Hello', 'China') // Hello China
log('Hello', '') // Hello World

ES6 允许为函数的参数设置默认值，即直接写在参数定义的后面

function log(x, y = 'World') {
	console.log(x, y);
}
log('Hello') // Hello World
log('Hello', 'China') // Hello China
log('Hello', '') // Hello

参数变量是默认声明的，所以不能用let或const再次声明
参数默认值可以与解构赋值的默认值，结合起来使用

function foo({x, y = 5}) {
	console.log(x, y);
}
foo({}) // undefined, 5
foo({x: 1}) // 1, 5
foo({x: 1, y: 2}) // 1, 2
foo() // TypeError: Cannot read property 'x' of undefined

symbol

概述

• Symbol()是一个内置全局函数，生成一个独一无二的的数据。

• symbol是一个ES6标准中新增的一种基本数据类型，

• Symbol类型数据的原理：保证每一个属性名都是独一无二的，从根本上防止属性名的冲突。
  symbol 的值是通过 Symbol() 函数生成

       let data = Symbol();
        console.log(data);  //红色字体：Symbol() 表示Symbol数据
        console.log(typeof data); //"symbol"类型

每一个 symbol 的值都是唯一的，Symbol() 函数可以接受一个字符串作为参数，表示对该值的描述，因此即使定义 symbol 使用相同的参数互相之间也不是相同的：

let a1 = Symbol("G");
        let a2 = Symbol("G");
        console.log(a1 == a2); //false 不严格情况下都不相等，严格情况下更不相等
 //这里通俗理解为：两个不同的人，叫相同的名字G

iterator迭代器

Iterator 迭代器是一种接口，Iterator本质是一个指针对象，其中包含一个next方法，这个方法可以改变指针的指向，并且返回一个包含value和done的对象

遍历过程：遍历一个对象时，Iterator要新建一个指针，指向数据结构的起始位置；然后调用next()方法，返回如下对象：

• done：是否遍历完成标识
• value：当前位置数据值

Iterator 的遍历过程:
（1)创建一个指针对象，指向当前数据结构的起始位置。也就是说，遍历器对象本质上，就是一个指针对象。
（2）第一次调用指针对象的next方法，可以将指针指向数据结构的第一个成员。
（3）第二次调用指针对象的next方法，指针就指向数据结构的第二个成员。
（4）不断调用指针对象的next方法，直到它指向数据结构的结束位置。

set数据结构

它类似于数组，但是 成员的值都是唯的，没有重复的值 。
Set.prototype.size 返回 Set 对象中的值的个数

const s = new Set()

Set函数可以接受一个数组作为参数，用来初始化

const s = new Set([1,2,3,3,4,4])
console.log(s) // Set(4) {1, 2, 3, 4}
console.log(s1.size); // 4

增删改查

• add() 添加
• delete() 删除
• has() 判断是否是其成员
• clear() 清空成员
• 遍历 set

Map数据结构

• Map.prototype.keys()：返回键名的遍历器。

       console.log(maparr.keys());
       for(let key of maparr.keys()){
           console.log(key);
       }

• Map.prototype.values()：返回键值的遍历器

       console.log(maparr.values());
       for(let value of maparr.values()){
           console.log(value);
       }

• Map.prototype.entries()：返回所有成员的遍历器

       console.log(maparr.entries());
       for(let item of maparr.entries()){
           console.log(item);
       }

• Map.prototype.forEach()：遍历 Map 的所有成员

       maparr.forEach((item)=>{
           console.log(item);//zhaojiamin 女
       })

Reflect

修改某些Object方法的返回结果，让其变得更加合理。比如，Object.defineProperty(obj.name,desc)在无法定义属性时会抛出一个错误，而Reflect。definedProperty(obj, name, desc)则会返回false

 旧写法
        try{
            Object.defineProperty(target, property, attributes);
            //success
        } catch(e){
            //faliure
        }

        新写法
        if(Reflect.defineProperty(target, property, attributes){
            //seccess
        }else{
            //failure
        }

Reflect对象的方法与Proxy对象的方法一一对应，只要是Proxy对象的方法，就能放在Reflect对象上找到相应的方法

 Proxy(target,{
            set(target, name, value, recevier){
                let success = Reflect.set(target, name, value, recevier);
                if(success){
                    console.log('property' + name + 'on' + target + 'set to' + value); 
                }
                return success;
            }
        })

Promise对象

Promise对象：代表了未来某个将要发生的操作，通常是异步操作
promise对象可以将异步操作以同步的流程表达出来，避免了层层嵌套的
回调函数
promise对象的创建

let promise = new Promise((resovle,reject)=>{
    console.info("create promise object");
    setTimeout(() => {
        resovle("ok");
    });
}).then(value=>{
    console.info("successed to promise,returned value:"+value);
},reason=>{
    console.info("failed to execute promise,reason"+reason);
}).catch(reason=>{
    console.error(`failed to reason:${reason}`);
});;

promise.then(value=>{
    console.info("then:"+value);
});
console.info("end js ......");

promise常用静态方法
Promise.all()并发处理多个异步任务，所有任务都执行完成才能得到结果

Promise.all( [p1,p2,p3] ) .then ( (result) => {console.info (result);
})

Generator

Generator 函数是一个普通函数，但是有两个特征。一是，function关键字与函数名之间有一个星号；二是，函数体内部使用yield表达式，定义不同的内部状态

    function* method(){
        yield 1+1;
        yield 2+2;
        yield 3+3;
        yield 4+4;
        return 10;
    }
    //执行该函数
    let f=method();//执行之后返回遍历器
    //下面是一个遍历器的使用
    console.log(f.next());
    console.log(f.next());
    console.log(f.next());
    console.log(f.next());
    console.log(f.next());

class语法

ES6 的类，完全可以看作构造函数的另一种写法

class Point {
  // ...
}

typeof Point // "function"

// prototype对象的constructor()属性，直接指向“类”的本身
Point === Point.prototype.constructor // true

ES6类上依旧有构造函数的prototype属性，类的所有方法都定义在类的prototype属性上面

class Point {
  constructor() {
    // ...
  }

  toString() {
    // ...
  }

  toValue() {
    // ...
  }
}

// 等同于

Point.prototype = {
  constructor() {},
  toString() {},
  toValue() {},
};

module对象

CommonJS规范规定，每个模块内部，module变量代表当前模块。这个变量是一个对象，它的exports属性（即module.exports）是对外的接口。加载某个模块，其实是加载该模块的module.exports属性。
模块的属性：
module.id： 模块的识别符，通常是带有绝对路径的模块文件名。
module.filename： 模块的文件名，带有绝对路径。
module.loaded： 返回一个布尔值，表示模块是否已经完成加载。
module.parent：返回一个对象，表示调用该模块的模块。
module.children： 返回一个数组，表示该模块要用到的其他模块。
module.exports： 表示模块对外输出的值。

NodeJs的模块化

const obj1 = require("./1.js")
const obj2 = require("./2.js")


exports.B1=B1
exports.B2=B2