Strict-Transport-Security "max-age=63072000; includeSubdomains;";
// includeSubDomains 可选，用来指定是否作用于子域名。

X-Frame-Options DENT;

X-Xss-Protection "1; mode=block";

X-Content-Type-Options nosniff;

Content-Security-Policy: default-src 'self'

// 简单的发布订阅模式
let state = { count: 1 }
let listeners = [] // 订阅的事件列表

function subscribe(listener) { // 订阅事件
  listeners.push(listener)
}

function publish(count) { // 一旦发布，即调用订阅的所有事件
  state.count = count
  for (let i = 0; i < listeners.length; i++) {
    let listener = listeners[i]
    listener()
  }
}

subscribe(() => { // 订阅打印state的事件
  console.log(state)
})

// 发布状态，触发订阅的事件。
publish(1) // {count: 1}
publish(2) // {count: 2}

function createStore(reducer, preloadedState, enhancer) {
    let currentReducer = reducer
    let currentState = preloadedState;
    let currentListeners = [];
    let nextListeners = currentListeners;
    let isDispatching = false;

    if (typeof enhancer !== 'undefined') {
        return enhancer(createStore)(reducer, preloadedState)
    }

    function ensureCanMutateNextListeners() {
        if (nextListeners === currentListeners) {
          	nextListeners = currentListeners.slice()
        }
    }

    function dispatch(action) {
        try {
            isDispatching = true
            currentState = currentReducer(currentState, action)
        } finally {
          	isDispatching = false
        }
        
        let listeners = (currentListeners = nextListeners)
        for (let i = 0; i < listeners.length; i++) {
            const listener = listeners[i]
            listener()
        }

        return action;
    }

    function subscribe(listener) {
        if (!isDispatching) {
            let isSubscribe = true

            ensureCanMutateNextListeners()
            nextListeners.push(listener)
        }
        return function unsubscribe() {
            if (!isSubscribe) return;
            isSubscribe = false;

            ensureCanMutateNextListeners()
            const index = nextListeners.indexOf(listener);
            nextListeners.slice(index, 1)
            currentListeners = null
        }
    }

    function getState() {
        if (!isDispatching) {
          	return currentState;
        }
    }

    function replaceReducer(nextReducer) {
        currentReducer = nextReducer
        dispatch({ type: Symbol() })
    }

    // 用一个不匹配任何action的type, 来触发state = reducer(state, action), 获取初始值
    dispatch({ type: Symbol() })

    return {
        dispatch,
        getState,
        subscribe,
        replaceReducer,
    }
}

const combineReducers = reducers => {
    return (state = {}, action) => {
        return Object.keys(reducers).reduce(
            (nextState, key) => {
                nextState[key] = reducers[key](state[key], action);
                return nextState;
            },
            {} 
        );
    };
}

function bindActionCreator(actionCreator, dispatch) {
    return function() {
        return dispatch(actionCreator.apply(this, arguments))
    }
}

function bindActionCreators(actionCreators, dispatch) {
    if (typeof actionCreators === 'function') {
        return bindActionCreator(actionCreators, dispatch)
    }

    const boundActionCreators = {}
    for (const key in actionCreators) {
        const actionCreator = actionCreators[key]
        if (typeof actionCreator === 'function') {
        boundActionCreators[key] = bindActionCreator(actionCreator, dispatch)
        }
    }
    return boundActionCreators
}

// example:
    // Function
    let bindAction = bindActionCreators(a => ({ type: 'INCREMENT', params: a }), store.dispatch)
    bindAction(1)

    // Object
    let bindAction = bindActionCreators({
        INCREMENT: (a) => ({ type: 'INCREMENT', params: a }),
        DECREMENT: (a) => ({ type: 'DECREMENT', params: a })
    }, store.dispatch)
    bindAction.INCREMENT(1)
    bindAction.DECREMENT(1)

function compose(...funcs) {
    if (funcs.length === 0) {
        return arg => arg
    }

    if (funcs.length === 1) {
        return funcs[0]
    }

    return funcs.reduce((a, b) => (...args) => a(b(...args)))
}

function applyMiddleware(...middlewares) {
    return createStore => (...args) => {
        const store = createStore(...args)
        let dispatch = () => {
            throw new Error(
                'Dispatching while constructing your middleware is not allowed. ' +
                'Other middleware would not be applied to this dispatch.'
            )
        }

        const middlewareAPI = {
            getState: store.getState,
            dispatch: (...args) => dispatch(...args)
        }
        const chain = middlewares.map(middleware => middleware(middlewareAPI))
        dispatch = compose(...chain)(store.dispatch)

        return {
            ...store,
            dispatch
        }
    }
}

// example:
const logger = ({ getState, dispacth }) => next => action => {
    console.log('老状态', getState());
    next(action);
    console.log('新状态',getState());
}
const store = applyMiddleware(logger)(createStore)(reducer);

// ES5

function Fun(x, y) {
    this.x = x
    this.y = y
}

Fun.prototype.plus = function() {
    return this.x + this.y
}

var num = new Fun(1, 2)
num.plus() // 3

// ES6
// 类的内部默认使用严格模式，不需要再显示声明。

class Fun {
    constructor(x, y) {
        // 类的原型方法，使用new关键字则自动调用该方法
        // 若未声明该方法，则会默认添加一个空的constructor方法
        this.x = x
        this.y = y
        
        // 默认return this;
    }
    
    plus() {
        return this.x + this.y
    }
}
var num = new Fun(1, 2)
num.plus() // 3

typeof Fun // "function"

// 所有方法不可枚举

Object.keys(Fun.prototype) // []

// 所有实例共享同一个原型对象

let num1 = new Fun(1, 2)
let num2 = new Fun(2, 3)
num1.__proto__ === num2.__proto__ // true

// class表达式

let name = new class {
    constructor() {
        this.name = 'j.'
    }
    
    console() {
        console.log(this.name)
    }
}
name.console() // 'j.'

// 类不存在变量提升

new Fun() // Cannot access 'Fun' before initialization
class Fun {}

// 私有方法
// ES6不提供私有方法，但可使用其他方法实现

// 方法一
class Widget {
    foo(options) {
        this._bar(options)
    }
    
    // 方法前加_表示为私有方法，但在类的外部依旧可以调用该方法。
    _bar(options){
        return options;
    }
}

// 方法二
class Widget {
    foo(options) {
        bar.call(this, options)
    }
}

function bar(options) {
    return options;
}

// 方法三 使用Symbol
class Widget {
    foo(options) {
        this[bar](options)
    }
    [bar](options) {
        return options;
    }
}

// 私有方法（提案）在变量或函数前加#
class Widget {
//    #a;
//    #fun() {
//    }
}

// 类的方法中的this默认指向类的实例，在外部调用类的方法时this指向可能会指向运行环境。

class Logger {
    print(name = 'J'){
        this.console(name)
    }
    
    console(name) {
        console.log(name)
    }
}
const logger = new Logger()
const { print } = logger
print() // Cannot read property 'console' of undefined

// 方法一
class Logger {
    constructor() {
        this.print = this.print.bind(this)
    }
    // ...
}

// 方法二 箭头函数
class Logger {
    this.print = (name = 'J') => {
        this.console(name)
    }
    // ...
}

// 方法三 Proxy
function selfish(target) {
    const cache = new WeakMap()
    const handler = {
        get (target, key) {
            const val = Reflect.get(target, key)
            if (typeof val !== 'function') {
                return val;
            }
            if (!cache.has(val)) {
                cache.set(val, val.bind(target))
            }
            return cache.get(val)
        }
    }
    const proxy = new Proxy(target, handler)
    return proxy
}

const a = selfish(new Logger())
const { pring } = a
pring() // J

class Myclass {
    constructor() {
        this.name = 'jjj'
    }
    get prop () {
        return this.name
    }
    set prop (val) {
        this.name = val
        console.log(this.name)
    }
}

let myclass = new Myclass()
myclass.prop = 'xxx' // 'xxx'
console.log(myclass.prop) // 'xxx'

class Foo {
    static hello() {
        console.log('hello')
        return 'hello'
    }
}
// 在类上调用
Foo.hello() // hello

// 在类的实例上调用
let foo = new Foo() // Uncaught TypeError: foo.hello is not a function

// 父类的静态方法可以被子类继承，子类也可以通过super调用该方法

class Son extends Foo {
    static method() {
        console.log(super.hello() + ' world')
    }
}

// 通过子类调用
Son.hello() // hello

// 从super对象上调用
Son.method() // hello
            // hello world

// 实例属性
class Foo {
    state = 'state'
    method() {
        console.log(this.state)
    }
}
let foo = new Foo()
foo.hello() // state

// 静态属性
class Foo {
    static state = 'state'
    method() {
        console.log(this.state)
    }
}

let a = new Foo()
a.method() // Foo.state = state
          // this.state = undefined
console.log(a.state) // undefined
console.log(Foo.state) // state

class Foo {
    constructor() {
        console.log(new.target)
    }
}
new Foo() // class Foo {
         //     constructor() {
         //         console.log(new.target)
         //     }
         // }
         

class Foo {
    method() {
        console.log(new.target)
    }
}
const foo = new Foo()
foo.method() // undefined

class Foo {
    constructor(x, y) {
        this.x = x
        this.y = y

        console.log('foo', x ,y)
    }

    method() {
        console.log('foo method', this.x, this.y)
    }
}

class Son extends Foo {
    constructor(x, y) {
        super(x, y) // super作为函数调用时代表父类的构造函数，且只能在constructor中使用。


        console.log(x, y)
        console.log(this.x, this.y)
        super.method() // super作为对象时指向父类的原型，可以调用父类的方法，super.method()相当于Foo.prototype.method()
    }
}

new Son(2, 3)
// foo 2 3
// 2 3
// 2 3
// foo method 2 3

// 判断一个类是否继承了另一个类
Object.getPrototypeOf(Son) === Foo // true

class Foo {
    FooMethod() {

    }
}
class Son extends Foo {
    SonMethod () {

    }
}

console.log(Son.__proto__ === Foo) // true
console.log(Son.prototype.__proto__ === Foo.prototype) // true

class Foo {
    FooMethod() {

    }
}
class Son extends Foo {
    SonMethod () {

    }
}
let foo = new Foo()
let son = new Son()

console.log(son.__proto__.__proto__ === foo.__proto__) // true

// target: 要拦截的目标对象。
// handler: 拦截行为。
var proxy = new Proxy(target, handler)

let o = {
    name: 'j',
}
let proxy = new Proxy(o, {
    get: function(target, propKey) {
        if (propKey in target) {
            console.log('get ' + propKey)
            return target[propKey]
        } else {
            console.log('没有' + propKey)
        }
    }
})

console.log(proxy.name) // get name
                     // j
                     
// get 方法可以继承

let obj = Object.create(proxy)
console.log(obj.age) // 没有age
                   // undefined
                   
// 实现读取数组负数索引
arr = [1,2,3,4,5]
let proxy = new Proxy(arr, {
    get: function(target, propKey) {
        let index = Number(propKey)
        if (index < 0) {
            propKey = target.length + index
        }
        return Reflect.get(target, propKey)
    }
})
console.log(proxy[-1]) // 5

let proxy = new Proxy({}, {
    set: function(target, propKey, value) {
        if (propKey === 'age') {
            if (!Number.isInteger(value)) {
                throw new TypeError('The age is not an integer')
            }

            if (value > 200) {
                throw new RangeError('The age seems invalid')
            }
            target[propKey] = value
        }
    }
})
proxy.age = 100
console.log(proxy) // Proxy {age: 100}

let target = function(){ return "I am the target"}
let prox = new Proxy(target, {
    apply(target, ctx, args) {
        console.log(target())
        console.log(ctx)
        console.log(args)
    }
})
prox(1, 2) // I am the target
          // undefined
          // [1, 2]
          
let plus = function(x, y) {
    return x + y;
}
let prox = new Proxy(plus, {
    apply(target, ctx, args) {
        return Reflect.apply(...arguments) * 2
    }
})
prox(2, 3) // 10
prox.call(null, 1, 2) // 6
prox.apply(null, [3, 4]) // 14

// promist构造函数接收一个函数作为参数，该函数接收两个函数resolve、reject作为参数。

// resolve函数将promise对象的状态从pinding变为resolved，在异步操作成功时调用。
// reject函数将promise对象的状态从pending变为rejected，在异步操作失败时调用。

var promise = new Promise(function(resolve, reject) {
    if (true) {
        resolve(val)
    } else {
        reject(error)
    }
})

Promise.prototype.then()
// promise实例生成后，可以使用then方法分别指定resolve和reject的回调函数。
promise.then(function(success) {
    // success回调
}, function(error) {
    // error回调
})


Promise.prototype.catch()
// 用于指定发生错误时的回调函数，


Promise.all()
// 用于将多个Promise实例包装成一个新的Promise实例，该方法接受一个数组，数组成员均为promise实例。
let p = Promise.all([p1, p2, p3])
// 只有所有实例成员的状态都变为resolved时，p的状态才会变成resolved。
// 只要有一个实例变成rejected，则p的状态变为rejected，返回变为rejected状态的实例的返回值。给每一个promise实例都添加catch回调，并return结果，这样就可以在最后的结果中都获取到。


Promise.allSettled()
// 接受多个promise实例数组，只有等到所有参数实例都返回结果(不管成功失败)，该实例才会结束。Promise.all()无法确定所有请求都结束。想要达到这个目的，Promise.allSettled()就容易多了。


Promise.race()
// 接受多个promise实例数组，哪个先resolved就返回哪个值。


Promise.resolve('foo')
// 等价于
new Promise((resolve) => { resolve('foo') })


Promise.reject('foo')
// 等价于
new Promise((resolve, reject) => { reject('foo') })


Promise.prototype.done()
// 处于回调链的最尾端，保证捕捉到可能出现的任何错误。


Promise.prototype.finally() // ES2018
// 不管Promise对象最后状态如何都会执行的操作，接受一个普通函数作为回调函数，不论如何都会执行。

let arr = ['a', 'b'];
let iter = arr[Symbol.iterator]();

iter.next() // { value: 'a', done: false }
iter.next() // { value: 'b', done: false }
iter.next() // { value: undefined, done: true }

// class
class RangeIterator {
  constructor(start, stop) {
    this.value = start;
    this.stop = stop;
  }

  [Symbol.iterator]() { return this; }
  
  next() {
    var value = this.value;
    if (value < this.stop) {
      this.value++;
      return {done: false, value: value};
    }
    return {done: true, value: undefined};
  }
}

for (var value of new RangeIterator(0, 3)) {
  console.log(value); // 0, 1, 2
}

// Object
let obj = {
  data: [ 'hello', 'world' ],
  [Symbol.iterator]() {
    const self = this;
    let index = 0;
    return {
      next() {
        if (index < self.data.length) {
          return {
            value: self.data[index++],
            done: false
          };
        } else {
          return { value: undefined, done: true };
        }
      }
    };
  }
};

for (var value of obj) {
  console.log(value); // 'hello', 'world'
}

// 使用Generator部署Symbol.iterator
let myIterable = {
  [Symbol.iterator]: function* () {
    yield 1;
    yield 2;
    yield 3;
  }
}
[...myIterable] // [1, 2, 3]

// 或者采用下面的简洁写法
let obj = {
  * [Symbol.iterator]() {
    yield 'hello';
    yield 'world';
  }
};

for (let x of obj) {
  console.log(x);
}
// "hello"
// "world"

function* generator() {
  yield 1;
}

let generator = function* () {
  return 1;
}

// 作为对象属性
let obj = {
  myGeneratorMethod: function* () {}
};
// 可简写为
let obj = {
  * myGeneratorMethod() {}
};

function* foo() {
  yield 'a';
  yield 'b';
}
function* bar() {
  yield 'x';
	yield* foo();
  yield 'y';
}
for (let v of bar()){
  console.log(v);
}
// x, a, b, y

// 两个独立的异步操作（不互相依赖），被写成继发关系会比较耗时。
// example:
let foo = await getFoo();
let bar = await getBar();

// 可让其同时触发
// 写法一
let [foo, bar] = await Promise.all([getFoo(), getBar()]);

// 写法二
let fooPromise = getFoo();
let barPromise = getBar();
let foo = await fooPromise;
let bar = await barPromise;

@decorator
class A {}

// 等同于

class A {}
A = decorator(A) || A;

class Person {
  @readonly
  name() { return `${this.first} ${this.last}` }
}

function readonly(target, name, descriptor) {
    // descriptor对象原来的值如下
  // {
  //   value: specifiedFunction,
  //   enumerable: false,
  //   configurable: true,
  //   writable: true
  // };
  descriptor.writable = false;
  return descriptor;
}

// ES6块级作用域
{
    let a = 1
    {
        let a = 2
        console.log(a)  // 2
    }
}

// 立即执行匿名函数 (IIFE)
(function(){
    ...
}())

// 函数声明语句
{
    function b() {}
}

// 函数表达式
{
    let a = function() {}
}

for (let i = 0; i < 10; i++) { // 父作用域
    // 子作用域
    let i = 10;
    console.log(i) // 10
}

const obj = {}
// 为obj添加一个属性
obj.a = 1 // { a: 1 }

// 为obj重新赋值
obg = 1 // Uncaught TypeError: Assignment to constant variable.

// 冻结obj
const obj =  Object.freeze({})
obj.a = 1 // {}

// 两边模式相等，左边变量就会被赋予对应的值
let [a, b, c] = [1, 2, 3]
a // 1
b // 2
c // 3

let [ , , d] = [4, 5, 6]
d //6

let [e, ...f] = [7, 8, 9]
e // 7
f // [8, 9]

// 如果解构不成功，值为 undefined
let [g, h] = [10]
g // 10
h // undefined

// 允许指定默认值
// 如果数组成员不严格等于undefined，默认值不会生效
let [i, j = 2] = [1]
i // 1
j // 2

let { a: c, b: b } = { a: 1, b: 2 }
// 其中a为模式，c是真正被赋值的变量
c // 1
b // 2

// 简写为
// 变量必须与属性同名
let { a, b } = { a: 1, b: 2 }

// 嵌套
let { c, c: { d } } = { c: { d: 3 }}
c // { d: 3 }
d // 3

// 默认值，对象的属性值必须严格等于 undefined
let { e = 4 } = {}
e // 4

let f;
{ f } = { f: 5 } // SyntaxError：syntax error
// JavaScript引擎会将首行的{}理解为代码块，因此语法错误
// 应写为 ({ f } = { f: 5 })

// 字符串会被解构为一个类数组的对象
const [a, b, c, d, e] = 'hello'
a // h
c // l

const { length } = 'hello'
length // 5

// Number
let { toString: s } = 123
s === Number.prototype.toString // true

// Boolean
let { toString: s } = true
s === Boolean.prototype.toString // true

// Number、Boolean都有toString属性，所以变量可以取到值

let fun = ([x, y]) => x + y
fun([1, 2]) // 3

[[1, 2], [3, 4]].map(([x ,y]) => x + y) // [3, 7]

// 交换变量的值
let x = 1
let y = 2
[x, y] = [y, x]
x // 2
y // 1

// 函数返回多个值
function fun() {
    return {a: 1, b: 2}
}
let { a, b } = fun()
a // 1
b // 2

// 引入模块
import { a, b } from 'mou'

// includes()
'abcdefg'.includes('c') // true
'abcdefg'.includes('c', 2) // true, 第二个参数表示开始搜索的位置

'abcdefg'.indexOf('c') // 2

// startsWith()
'abcdefg'.startsWith('a') // true
'abcdefg'.startsWith('d', 3) // true

// endsWith()
'abcdefg'.endsWith('g') // true
'abcdefg'.endsWith('g', 7) // true

// repeat()
'aa'.repeat(3) // ’aaaaaa'

// padStart()
'X'.padStart(4, 'ak') // 'akakX'

// padEnd()
'X'.padEnd(4, 'ak') // 'Xaka'

let pig = 'pig'
`Hello ${ pig }` // "Hello pig"

// 括号内可放入表达式
`${ 1 + 2 } + ${ 3 + 4 } = 10` // "3 + 7 = 10"

// 可调用函数
let fun = () => 'pig'
`Hello ${ fun() }` // "Hello pig"

// 可以嵌套
`xx${ `Y` }xx` // "xxYxx"

// 标签模板
alert`123` // 123

// Math.trunc() 去除一个数的小数部分
Math.trunc(1.5) // 1

// Math.sign() 判断一个数为正数、负数、0️⃣，返回1、-1、0
Math.sign(2) // 1
Math.sign(-2) // -1

// ** 指数运算符
2 ** 3 // 8 等同于 2 * 2 * 2 
3 ** 2 // 9 等同于 3 * 3

// 函数参数默认值
let fun = (x, y = 1) => {
    console.log(x, y)
}
fun(2) // 2, 1
fun() // undefined, 1

// 函数的length属性, 返回传入函数参数的个数
(function(a, b){}).length // 2
// 指定默认值会导致length属性失真
(function(a, b, c = 3){}).length // 2

// rest 参数, 返回传入函数参数的数组, rest参数后不得有其他参数。
let fun = (...value) => {
    return value.sort()
}
fun(3, 1, 2) // [1, 2, 3]

// 举个例子，阶乘
let fun = (n) => {
    if (n === 1) return 1;
    return n * fun(n - 1)
}
fun(5) // 120

// 尾递归 （部分JS解释器不支持）
let fun = (n, total) => {
    if (n === 1) return total;
    return fun(n - 1, n * total)
}
fun(5, 1) // 120
fun(10000, 1) // Infinity
fun(100000, 1) // Maximum call stack size exceeded

// 正常情况下函数尾递归优化的实现，使用蹦床函数并改写原来的递归函数
// 蹦床函数将递归执行转换为循环执行
let trampoline = (f) => {
    while(f && f instanceof Function){
        f = f() 
    }
    return f;
}
// 每执行一次返回另一个函数。
let fun = (n, total) => {
    if (n === 1) return total;
    return fun.bind(null, n - 1, n * total);
}
trampoline(fun(10000000, 1)) // Infinity

// 蹦床函数并非真正的尾递归优化。
let tco = (f) => {
    let value;
    let active = false;
    let accumulated = [];
    
    return function accumulator() {
        accumulated.push(arguments)
        if (!active) {
            active = true
            while (accumulated.length) {
                value = f.apply(this, accumulated.shift())
            }
            active = false
            return value
        }
    }
}

let fun = tco(function(n, total) {
    if (n === 1) return total;
    return fun(n - 1, n * total)
})

fun(10000000, 1) // Infinity

// 主要用于函数调用
let arr = [1, 2, 3]
let push = (arr, ...items) => {
    arr.push(...items)
}
push(arr, 4, 5, 6) // [1, 2, 3, 4, 5, 6]

// 替代apply方法
let add = (x, y) => {
    return x + y
}
add.apply(null, arr) // 3
add(...arr) // 3

// 合并数组
let arr = [3, 4]
[1, 2].concat(arr) // ES5
[1, 2, ...arr]  //ES6

// 结合解构赋值,只能放在参数的最有一位。
[first, ...rest] = [1, 2, 3, 4]
fist // 1
rest // [2, 3, 4]

// 将字符串转为数组
[...'hello'] // ["h", "e", "l", "l", "o"]

// Array.from(obj，fun) 将类数组或可遍历对象转换为数组
let arr = {
    '0': 'a',
    '1': 'b',
    '2': 'c',
    length: 3
}
// ES6
Array.from(arr) // ["a", "b", "c"]
// ES5
[].slice.call(arr) // ["a", "b", "c"]

// 第二个参数类似map方法。
Array.from(arr, (i) => i + 'x') // ["ax", "bx", "cx"]

// Array.of() 将一组值转换为数组
Array.of(1, 2) // [1, 2]

let arr = [1, 2, 3, 4, 5, 6]

// copyWithin(target, start, end) 将指定的数组成员复制到其它位置（覆盖原有成员），返回该数组
// target: 从该位置开始替换数据
// start: 从该位置开始读取数据，默认0
// end: 到该位置停止读取数据，默认数组长度
arr.copyWithin(3) // [1, 2, 3, 1, 2, 3]
arr.copyWithin(1, 2) // [1, 3, 4, 5, 6, 6]
arr.copyWithin(3, 0, 3) // [1, 2, 3, 1, 2, 3]

// find() 查找符合条件的成员，无则返回undefined
arr.find(i => i < 0) // undefined
arr.find(i => i > 3) // 4

// findIndex(val, index, arr) 查找符合条件的成员，返回其位置,无则返回-1
arr.findIndex((val) => {
    return val > 3 // 3
})

// fill(val, start, end) 使用给定的值填充数组
arr.fill('x') // ["x", "x", "x", "x", "x", "x"]
arr.fill('x', 4) // [1, 2, 3, 4, "x", "x"]
arr.fill('x', 2, 4) // [1, 2, "x", "x", 5, 6]

// includes() 类似indexOf()，返回boolean
arr.includes(1) // true

// in运算符 判断指定的属性是否在原型链中，返回boolean
2 in arr // true
length in arr // true

// 数组空位, 表示该位置没有任何值。
// ES5会忽略空位，ES6会将空位转换为undefined
let empty = [ , , , ]
0 in empty // false

// ES6中，对象的属性名和属性值相同时可以不写属性值。
let a = 'b'
let obj = { a }
a // { a: 'b' }

// ES5写法
let foo = {
    'class': function() { } // class为关键字，加引号防止解析错误 
}
// ES6写法
let foo = {
    class() { }
}

// 属性名表达式
obj['j' + 'x' + 'r'] = 315
obj.jxr // 315

// Object.is() 判断两个值是否完全相等，行为与’===‘一致
Object.is({}, {}) // false

let a = {
        a: 0,
        b: {
            c: 0,
            d: 0
        }
    }
let b = Object.assign({}, a)
JSON.stringify(b) // "{"a":0,"b":{"c":0,"d":0}}" 

// 浅拷贝
a.b.c = 1
JSON.stringify(a) // "{ "a": 0, "b": { "c": 1, "d": 0 } }"
JSON.stringify(b) // "{ "a": 0, "b": { "c": 1, "d": 0 } }"

b.b.d = 2
JSON.stringify(a) // "{ "a": 0, "b": { "c": 1, "d": 2 } }"
JSON.stringify(b) // "{ "a": 0, "b": { "c": 1, "d": 2 } }"

// 扩展运算符实现浅拷贝
let d = { e: 1, ...a }
d // "{ "e": 1, "a": 0, "b": { "c": 0, "d": 0 } }"

// 深拷贝
let c = JSON.parse(JSON.stringify(a))
a.b.c = 1
JSON.stringify(a) // "{ "a": 0, "b": { "c": 1, "d": 0 } }"
JSON.stringify(c) // "{ "a": 0, "b": { "c": 0, "d": 0 } }"

// 为对象添加方法
Object.assign(example.prototype, {
    method() {}
})

example.prototype.method = function() {}
// 以上两中写法等同。

let proto = {}
let obj = {
        a: 0
    }

Object.setPrototypeOf(obj, proto)
proto.b = 1
obj.b // 1

Object.getPrototypeOf(obj) // { b: 1 }

const product = (data && data.results && data.results.product) || 'default'

const product = data?.results?.product) || 'default'

fun?.(...arg) // 函数调用方法

new C?.(...arg) // 构造函数调用

let obj = {
        a: 1,
        b: 2
    }
    
// for...in
for(let i in obj) {
    console.log(i)
}
// a
// b

// Object.keys() 返回数组，包含对象自身的所有属性，不含Symbol
Object.keys(obj) // ["a", "b"]

// Object.values() 返回数组，包含对象自身所有的属性值。
Object.values(obj) // [1, 2]

// Object.entries()  返回二维数组，成员是键值对数组。
Object.entries(obj) // [["a", 1], ["b", 2]]

// Object.getOwnPropertyNames(obj) 返回数组, 包含对象自身所有属性，不包含Symbol和不可枚举属性
Object.getOwnPropertyNames(obj) // ["a", "b"]

// Object.getOwnPropertySymbols(symbols) 返回自身所有Symbol属性

// Reflect.ownKeys(obj) 返回所有属性。everything~

// 数组去重，将Set结构转换为数组。
let s = new Set([1, 2, 3, 3, 3, 4])
[...s] // [1, 2, 3, 4]
Array.from(s) // [1, 2, 3, 4]

// size 返回Set实例的成员总数
s.size // 4

// add(val) 添加成员，返回添加后的结构
s.add(5) // Set(5) {1, 2, 3, 4, 5}

// delete(val) 删除成员，返回boolean
s.delete(1) // true

// has(val) 返回boolean，是否包含成员
s.has(2) // true

// 清除成员，无返回值
s.clear() //

// keys()
let s = new Set([1, 2, 3])
for(let i of s.keys()){
    console.log(i)
}
// 1
// 2
// 3

// values()
for(let i of s)){ // 可省略values方法
    console.log(i)
}
// 1
// 2
// 3

// entries()
for(let i of s.entries()){
    console.log(i)
}
// [1, 1]
// [2, 2]
// [3, 3]

// forEach()
s.forEach((values, keys, others) => {
    console.log(values, keys, others)
})
// 1 1 Set(3) {1, 2, 3}
// 2 2 Set(3) {1, 2, 3}
// 3 3 Set(3) {1, 2, 3}

let a = new Set([1, 2, 3])
let b = new Set([4, 3, 2])

let union = new Set([...a, ...b])
union // 交集 Set(4) {1, 2, 3, 4}

let intersect = new Set([...a].filter(x => b.has(x)))
intersect // 并集 Set(2) {2, 3}

let difference = new Set([...a].filter(x => !b.has(x)))
difference // 差集 Set(1) {1}

const ws = new WeakSet([[1, 2], [3, 4]])
ws // WeakSet { [1, 2], [3, 4] }

// 向实例添加成员
const obj = {}
ws.add(obj) // WeakSet { {} }

// 某个值是否在实例中
ws.has(obj) // true

// 清除实例指定成员
ws.delete(obj) // true

// Map构造函数接受一个二维数组作为参数.
let m = new Map([[1, 2], [3, 4], [5, 6]])
// Map(3) {1 => 2, 3 => 4, 5 => 6}

// 也可接受双元素数组的Set、Map对象用来生成新的Map数据结构。
let s = new Set([[1, 2], [3, 4], [5, 6]])
new Map(s) // Map(3) {1 => 2, 3 => 4, 5 => 6}
new Map(m) // Map(3) {1 => 2, 3 => 4, 5 => 6}

// Map的键实际上是与内存地址绑定，内存地址不同则视为两个键。
let a = ['a']
let b = ['a']
let m = new Map()

m.set(a, 1)
m.set(b, 2)

m.get(a) // 1
m.get(b) // 2
m.get(['a']) // undefined

let m = new Map([[1, 2], [3, 4]])

// size 返回Map结构的成员个数
m.size // 2

// set(key, val) 设置键值，若存在则覆盖，返回整个Map结构
m.set(5, 6) // Map(3) {1 => 2, 3 => 4, 5 => 6}

// get(key) 返回对应的值，无则返回undefined
m.get(3) // 4
m.get(7) // undefined

// has(key) 查找键名，返回boolean
m.has(1) // true

// delete() 删除键值，返回boolean
m.delete(1) // true

// clear() 清空数据结构，无返回值。