var a = 10;
console.log(window.a) // 10

console.log(a) // undefined
var a = 20

var a
console.log(a)
a = 20

var a = 20
var a = 30
console.log(a) // 30

var a = 20

function change() {
	var a = 30
}
change()
console.log(a) // 20

var a = 20

function change() {
	a = 30
}
change()
console.log(a) // 30

{
	let a = 20
}
console.log(a) // ReferenceError: a is not defined.

console.log(a) //报错ReferenceError
let a = 2

var a = 123
if (true) {
	a = 'abc' // ReferenceError
	let a;
}

let a = 20
let a = 30
// Uncaught SyntaxError: Identifier 'a' has already been declared

let a = 20 
{
	let a = 30
}

function func(arg) {
	let arg;
}
func()
// Uncaught SyntaxError: Identifier 'arg' has already been declared

const a = 1
a = 3
// TypeError: Assignment to constant variable.

const a;
// SyntaxError: Missing initializer in const declaration

var a = 20
let b = 20
const a = 30
const b = 30
// 都会报错

const foo = {};
// 为foo添加一个属性，可以成功 
foo.prop = 123;
foo.prop // 123
// 将foo指向另一个对象，就会报错 
foo = {}; // TypeError: "foo" is read-only

// var
console.log(a) // undefined
var a = 10

// let
console.log(b) // Cannot access 'b' before initialization
let b = 10

// const
console.log(c) // Cannot access 'c' before initialization
const c = 10

// var
console.log(a) // undefined
var a = 10

// let
console.log(b) // Cannot access 'b' before initialization
let b = 10

// const
console.log(c) // Cannot access 'c' before initialization
const c = 10

// var
{
	var a = 20
}
console.log(a) // 20

// let
{
	let b = 20
}
console.log(b) // Uncaught ReferenceError: b is not defined

// const
{
	const c = 20
}
console.log(c) // Uncaught ReferenceError: c is not defined

// var
var a = 10
var a = 20 // 20

// let
let b = 10
let b = 20 // Identifier 'b' has already been declared

// const
const c = 10
const c = 20 // Identifier 'c' has already been declared

// var
var a = 10
a = 20
console.log(a) // 20

//let
let b = 10
b = 20
console.log(b) // 20

// const
const c = 10
c = 20
console.log(c) // Uncaught TypeError: Assignment to constant variable

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>]

function push(array, ...items) {
	array.push(...items);
}

function add(x, y) {
	return x + y;
}
const numbers = [4, 38];
add(...numbers) // 42

[...document.querySelectorAll('div')]

const a1 = [1, 2];
const [...a2] = a1;
// [1,2]

const arr1 = ['a', 'b'];
const arr2 = ['c'];
const arr3 = ['d', 'e'];
[...arr1, ...arr2, ...arr3]
// [ 'a', 'b', 'c', 'd', 'e' ]

const arr1 = ['a', 'b',[1,2]];
const arr2 = ['c'];
const arr3 = [...arr1,...arr2]
arr[1][0] = 9999 // 修改arr1里面数组成员值
console.log(arr[3]) // 影响到arr3,['a','b',[9999,2],'c']

const [first, ...rest] = [1, 2, 3, 4, 5];
first // 1
rest // [2, 3, 4, 5]

const [first, ...rest] = [];
first // undefined
rest // []

const [first, ...rest] = ["foo"];
first // "foo"
rest // []

const [...butLast, last] = [1, 2, 3, 4, 5];
// 报错

const [first, ...middle, last] = [1, 2, 3, 4, 5];
// 报错

[...'hello']
// [ "h", "e", "l", "l", "o" ]

let nodeList = document.querySelectorAll('div');
let array = [...nodeList];
let map = new Map([
	[1, 'one'],
	[2, 'two'],
	[3, 'three'],
]);
let arr = [...map.keys()]; // [1, 2, 3]

const obj = {a: 1, b: 2};
let arr = [...obj]; // TypeError: Cannot spread non-iterable object

let arrayLike = {
	'0': 'a',
	'1': 'b',
	'2': 'c',
	length: 3
};
let arr2 = Array.from(arrayLike); // ['a', 'b', 'c']

Array.from([1, 2, 3], (x) => x * x)
// [1, 4, 9]

Array.of(3, 11, 8) // [3,11,8]

Array() // []
Array(3) // [, , ,]
Array(3, 11, 8) // [3, 11, 8]

[1, 2, 3, 4, 5].copyWithin(0, 3) // 将从3号位直到数组结束的成员(4和5),复制 到从0号位开始的位置，结果覆盖了原来的1和2
// [4, 5, 3, 4, 5]

[1, 5, 10, 15].find(function(value, index, arr) {
	return value > 9;
}) // 10

[1, 5, 10, 15].findIndex(function(value, index, arr) {
	return value > 9;
}) // 2

function f(v) {
	return v > this.age;
}
let person = {
	name: 'John',
	age: 20
};
[10, 12, 26, 15].find(f, person); // 26

['a', 'b', 'c'].fill(7)
// [7, 7, 7]

new Array(3).fill(7)
// [7, 7, 7]

['a', 'b', 'c'].fill(7, 1, 2)
// ['a', 7, 'c']

for (let index of ['a', 'b'].keys()) {
	console.log(index);
}
// 0
// 1

for (let elem of ['a', 'b'].values()) {
	console.log(elem);
}
// 'a'
// 'b'

for (let [index, elem] of ['a', 'b'].entries()) {
	console.log(index, elem);
}
// 0 "a"

[1, 2, 3].includes(2) // true
[1, 2, 3].includes(4) // false
[1, 2, NaN].includes(NaN) // true

[1, 2, 3].includes(3, 3); // false
[1, 2, 3].includes(3, -1); // true

[1, 2, [3, 4]].flat()
// [1, 2, 3, 4]

[1, 2, [3, [4, 5]]].flat()
// [1, 2, 3, [4, 5]]

[1, 2, [3, [4, 5]]].flat(2)
// [1, 2, 3, 4, 5]

// 相当于[[2, 4], [3, 6], [4, 8]].flat()
[2, 3, 4].flatMap((x) => [x, x * 2])
// [2, 4, 3, 6, 4, 8]

const arr = [
	'peach',
	'straw',
	'apple',
	'spork'
];
const stableSorting = (s1, s2) => {
	if (s1[0] < s2[0]) return -1;
	return 1;
};
arr.sort(stableSorting)
// ["apple", "peach", "straw", "spork"]

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

function foo(x = 5) {
	let x = 1; // error
	const x = 2; // error
}

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

function foo({x,y = 5} = {}) {
	console.log(x, y);
}
foo() // undefined 5

function f(x = 1, y) {
	return [x, y];
}

f() // [1, undefined]
f(2) // [2, undefined]
f(, 1) // 报错
f(undefined, 1) // [1, 1]

(function (a) {}).length // 1
(function (a = 5) {}).length // 0
(function (a, b, c = 5) {}).length // 2

(function(...args) {}).length // 0

(function (a = 0, b, c) {}).length // 0
(function (a, b = 1, c) {}).length // 1

var f = function () {};

// ES5
f.name // ""

// ES6
f.name // "f"

const bar = function baz() {};
bar.name // "baz"

(new Function).name // "anonymous"

function foo() {};
foo.bind({}).name // "bound foo"

(function(){}).bind({}).name // "bound "

let x = 1;

function f(y = x) {
	// 等同于let y = x 
	let x = 2;
	console.log(y);
}
f() // 1

// 报错
function doSomething(a, b = a) {
	'use strict';
	// code
}
// 报错
const doSomething = function({a, b}) {
	'use strict';
	// code
};
// 报错
const doSomething = (...a) => {
	'use strict';
	// code
};
const obj = {
	// 报错
	doSomething({a, b}) {
		'use strict';
		// code
	}
};

var f = v => v;

// 等同于
var f = function(v) {
	return v;
};

var f = () => 5;
// 等同于
var f = function() {
	return 5
};

var sum = (num1, num2) => num1 + num2;
// 等同于
var sum = function(num1, num2) {
	return num1 + num2;
};

var sum = (num1, num2) => { return num1 + num2; }

let getTempItem = id => ({ id: id, name: "Temp" });

const baz = {foo:foo}
// 等同于
const baz = {foo}

const o = {
	method() {
		return "Hello!";
	}
};
// 等同于
const o = {
	method: function() {
		return "Hello!";
	}
}

function getPoint() {
	const x = 1;
	const y = 10;
	return {x, y};
}
getPoint()
// {x:1, y:10}

const obj = {
	f() {
		this.foo = 'bar';
	}
};
new obj.f() // 报错

let lastWord = 'last word';
const a = {
	'first word': 'hello',
	[lastWord]: 'world'
};
a['first word'] // "hello"
a[lastWord] // "world"
a['last word'] // "world"

let obj = {
	['h' + 'ello']() {
		return 'hi';
	}
};
obj.hello() // hi

// 报错
const foo = 'bar';
const bar = 'abc';
const baz = {
	[foo]
};

// 正确
const foo = 'bar';
const baz = {
	[foo]: 'abc'
};

const keyA = {
	a: 1
};
const keyB = {
	b: 2
};
const myObject = {
	[keyA]: 'valueA',
	[keyB]: 'valueB'
};
myObject // Object {[object Object]: "valueB"}

const proto = {
	foo: 'hello'
};
const obj = {
	foo: 'world',
	find() {
		return super.foo;
	}
};
Object.setPrototypeOf(obj, proto); // obj
obj.find() // "hello"

let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4 };
x // 1
y // 2
z // { a: 3, b: 4 }

let obj = { a: { b: 1 } };
let { ...x } = obj;
obj.a.b = 2; // 修改obj里面a属性中键值
x.a.b // 2,影响到了结构出来x的值

Reflect.ownKeys({ [Symbol()]:0, b:0, 10:0, 2:0, a:0 })
// ['2', '10', 'b', 'a', Symbol()]

+0 === -0 //true
NaN === NaN // false

Object.is(+0, -0) // false
Object.is(NaN, NaN) // true

const target = { a: 1, b: 1 };

const source1 = { b: 2, c: 2 };
const source2 = { c: 3 };

Object.assign(target, source1, source2);
target // {a:1, b:2, c:3}

const obj = {
	foo: 123,
	get bar() {
		return 'abc'
	}
};
Object.getOwnPropertyDescriptors(obj) 
// {
// 	foo: {
// 		value: 123,
// 		writable: true,
// 		enumerable: true,
// 		configurable: true
// 	},
// 	bar: {
// 		get: [Function: get bar],
// 		set: undefined,
// 		enumerable: true,
// 		configurable: true
// 	}
// }

Object.setPrototypeOf(object, prototype)

// 用法
const o = Object.setPrototypeOf({}, null);

Object.getPrototypeOf(obj);

var obj = { foo: 'bar', baz: 42 };
Object.keys(obj)
// ["foo", "baz"]

const obj = { foo: 'bar', baz: 42 };
Object.values(obj)
// ["bar", 42]

const obj = { foo: 'bar', baz: 42 };
Object.entries(obj)
// [ ["foo", "bar"], ["baz", 42] ]

Object.fromEntries([
	['foo', 'bar'],
	['baz', 42]
])
// { foo: "bar", baz: 42 }

doSomething(function(result) {
	doSomethingElse(result, function(newResult) {
		doThirdThing(newResult, function(finalResult) {
			console.log('得到最终结果：' + finalResult);
		}, failureCallback);
	}, failureCallback);
}, failureCallback);

doSomething().then(function(result) {
		return doSomethingElse(result);
	})
	.then(function(newResult) {
		return doThirdThing(newResult);
	})
	.then(function(finalResult) {
		console.log('得到最终结果：' + finalResult);
	})
	.catch(failureCallback);

const promise = new Promise(function(resolve, reject) {});

getJSON("/posts.json").then(function(json) {
	return json.post;
}).then(function(post) {
	// ...
});

getJSON('/posts.json').then(function(posts) {
	// ...
}).catch(function(error) {
	// 处理getJSON和前一个回调函数运行时发生的错误
	console.log(' ', error);
});

getJSON('/post/1.json').then(function(post) {
	return getJSON(post.commentURL);
}).then(function(comments) {
	// some code
}).catch(function(error) {
	// 处理前面三个Promise产生的错误
});

const someAsyncThing = function() {
	return new Promise(function(resolve, reject) {
		// 下面一行会报错，因为x没有声明
		resolve(x + 2);
	});
};

promise
	.then(result => {
		// ···
	})
	.catch(error => {
		// ···
	})
	.finally(() => {
		// ···
	});

const p = Promise.all([p1, p2, p3]);

const p1 = new Promise((resolve, reject) => {
		resolve('hello');
	})
	.then(result => result)
	.catch(e => e);
const p2 = new Promise((resolve, reject) => {
		throw new Error('报错了');
	})
	.then(result => result)
	.catch(e => e);
Promise.all([p1, p2])
	.then(result => console.log(result))
	.catch(e => console.log(e));
// ["hello", Error: 报错了]

const p1 = new Promise((resolve, reject) => {
		resolve('hello');
	})
	.then(result => result);
const p2 = new Promise((resolve, reject) => {
		throw new Error('报错了');
	})
	.then(result => result);
Promise.all([p1, p2])
	.then(result => console.log(result))
	.catch(e => console.log(e));
// Error:报错了

const p = Promise.race([p1, p2, p3]);

const p = Promise.race([
	fetch('/resource-that-may-take-a-while'),
	new Promise(function(resolve, reject) {
		setTimeout(() => reject(new Error('request timeout')), 5000)
	})
]);
p
	.then(console.log)
	.catch(console.error);

const promises = [
	fetch('/api-1'),
	fetch('/api-2'),
	fetch('/api-3'),
];
await Promise.allSettled(promises);
removeLoadingIndicator();

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

const p = Promise.reject('出错了');
// 等同于
const p = new Promise((resolve, reject) => reject('出错了'))

p.then(null, function(s) {
	console.log(s)
});
// 出错了

Promise.reject('出错了')
	.catch(e => {
		console.log(e === '出错了')
	})
// true

const preloadImage = function(path) {
	return new Promise(function(resolve, reject) {
		const image = new Image();
		image.onload = resolve;
		image.onerror = reject;
		image.src = path;
	});
};

// 各司其职
getInfo().then(res => {
	let {
		bannerList
	} = res
	// 渲染轮播图
	console.log(bannerList)
	return res
}).then(res => {
	let {
		storeList
	} = res
	// 渲染店铺列表
	console.log(storeList)
	return res
}).then(res => {
	let {
		categoryList
	} = res
	console.log(categoryList)
	// 渲染分类列表
	return res
})

function initLoad() {
	// loading.show() // 加载loading
	Promise.all([getBannerList(), getStoreList(), getCategoryList()]).then(res => {
		console.log(res)
		loading.hide() // 关闭loading
	}).catch(err => {
		console.log(err)
		loading.hide() // 关闭loading
	})
}
// 数据初始化
initLoad()

// 请求某个图片资源
function requestImg() {
	var p = new Promise(function(resolve, reject) {
		var img = new Image();
		img.onload = function() {
			resolve(img);
		}
		//img.src = "https://b-gold-cdn.xitu.io/v3/static/img/logo.a7995ad.svg "; 正确的
		img.src = "https://b-gold-cdn.xitu.io/v3/static/img/logo.a7995ad.svg1 ";
	});
	return p;
}
// 延时函数，用于给请求计时
function timeout() {
	var p = new Promise(function(resolve, reject) {
		setTimeout(function() {
			reject('图片请求超时');
		}, 5000);
	});
	return p;
}
Promise
	.race([requestImg(), timeout()])
	.then(function(results) {
		console.log(results);
	})
	.catch(function(reason) {
		console.log(reason);
	});

/**main.js入口文件/主模块**/
// 首先用config()指定各模块路径和引用名
require.config({
	baseUrl: "js/lib",
	paths: {
		"jquery": "jquery.min", // 实际路径为js/lib/jquery.min.js
		"underscore": "underscore.min",
	}
});
// 执行基本操作
require(["jquery", "underscore"], function($, _) {
	// some code here
});

// a.js
module.exports={ foo , bar}

// b.js
const { foo,bar } = require('./a.js')

// CommonJS模块
let {
	stat,
	exists,
	readfile
} = require('fs');
// 等同于
let _fs = require('fs');
let stat = _fs.stat;
let exists = _fs.exists;
let readfile = _fs.readfile;

// ES6
import { stat, exists, readFile } from 'fs';

// profile.js
export var firstName = 'Michael';
export var lastName = 'Jackson';
export var year = 1958;

// 或
// 建议使用下面写法，这样能瞬间确定输出了哪些变量
var firstName = 'Michael';
var lastName = 'Jackson';
var year = 1958;
export { firstName, lastName, year };

export function multiply(x, y) {
	return x * y;
};

function v1() {
	// ...
}

function v2() {
	// ...
}
export {
	v1 as streamV1,
	v2 as streamV2,
	v2 as streamLatestVersion
};

// main.js
import {
	firstName,
	lastName,
	year
} from './profile.js';

function setName(element) {
	element.textContent = firstName + ' ' + lastName;
}

import { lastName as surname } from './profile.js';

// circle.js
export function area(radius) {
	return Math.PI * radius * radius;
}
export function circumference(radius) {
	return 2 * Math.PI * radius;
}

// main.js
import * as circle from './circle';
console.log(circle) // {area:area,circumference:circumference}

import {
	a
} from './xxx.js'
a.foo = 'hello'; // 合法操作
a = {}; // Syntax Error : 'a' is read-only;

import { a } from './a';

import { myMethod } from 'util';

foo();
import { foo } from 'my_module';

import 'lodash';
import 'lodash';

// export-default.js
export default function() {
	console.log('foo');
}

// import-default.js
import customName from './export-default';
customName(); // 'foo'

import('/modules/myModule.mjs')
	.then((module) => {
		// Do something with the module.
	});

export { foo, bar } from 'my_module';

// 可以简单理解为
import { foo, bar } from 'my_module';
export { foo, bar };

<template>
	<div class="App">
		组件化开发 ----  模块化
	</div>
</template>
<script>
	export default {
		name: 'HelloWorld',
		props: {
			msg: String
		}
	}
</script>

function App() {
	return (
		<div className="App">
			组件化开发 ----  模块化
		</div>
	);
}
export default App;

function* helloWorldGenerator() {
	yield 'hello';
	yield 'world';
	return 'ending';
}

function* gen() {
	// some code
}
var g = gen();
g[Symbol.iterator]() === g
// true

function* helloWorldGenerator() {
	yield 'hello';
	yield 'world';
	return 'ending';
}
var hw = helloWorldGenerator();

hw.next()
// { value: 'hello', done: false }

hw.next()
// { value: 'world', done: false }

hw.next()
// { value: 'ending', done: true }

hw.next()
// { value: undefined, done: true }

function* foo(x) {
	var y = 2 * (yield(x + 1));
	var z = yield(y / 3);
	return (x + y + z);
}

var a = foo(5);
a.next() // Object{value:6, done:false}
a.next() // Object{value:NaN, done:false}
a.next() // Object{value:NaN, done:true}

var b = foo(5);
b.next() // { value:6, done:false }
b.next(12) // { value:8, done:false }
b.next(13) // { value:42, done:true }

function* foo() {
	yield 1;
	yield 2;
	yield 3;
	yield 4;
	yield 5;
	return 6;
}
for (let v of foo()) {
	console.log(v);
}
// 1 2 3 4 5

function* objectEntries(obj) {
	let propKeys = Reflect.ownKeys(obj);
	for (let propKey of propKeys) {
		yield [propKey, obj[propKey]];
	}
}

let jane = {
	first: 'Jane',
	last: 'Doe'
};

for (let [key, value] of objectEntries(jane)) {
	console.log(`${key}: ${value}`);
}
// first: Jane
// last: Doe

fs.readFile('/etc/fstab', function(err, data) {
	if (err) throw err;
	console.log(data);
	fs.readFile('/etc/shells', function(err, data) {
		if (err) throw err;
		console.log(data);
	});
});

const fs = require('fs');
const readFile = function(fileName) {
	return new Promise(function(resolve, reject) {
		fs.readFile(fileName, function(error, data) {
			if (error) return reject(error);
			resolve(data);
		});
	});
};

readFile('/etc/fstab').then(data => {
	console.log(data)
	return readFile('/etc/shells')
}).then(data => {
	console.log(data)
})

const gen = function*() {
	const f1 = yield readFile('/etc/fstab');
	const f2 = yield readFile('/etc/shells');
	console.log(f1.toString());
	console.log(f2.toString());
};

const asyncReadFile = async function() {
	const f1 = await readFile('/etc/fstab');
	const f2 = await readFile('/etc/shells');
	console.log(f1.toString());
	console.log(f2.toString());
};

function* loadUI() {
	showLoadingScreen();
	yield loadUIDataAsynchronously();
	hideLoadingScreen();
}
var loader = loadUI();
// 加载UI
loader.next()
// 卸载UI
loader.next()

import {
	call,
	put,
	takeEvery,
	takeLatest
} from 'redux-saga/effects'
import Api from '...'

function* fetchUser(action) {
	try {
		const user = yield call(Api.fetchUser, action.payload.userId);
		yield put({
			type: "USER_FETCH_SUCCEEDED",
			user: user
		});
	} catch (e) {
		yield put({
			type: "USER_FETCH_FAILED",
			message: e.message
		});
	}
}

function* mySaga() {
	yield takeEvery("USER_FETCH_REQUESTED", fetchUser);
}

function* mySaga() {
	yield takeLatest("USER_FETCH_REQUESTED", fetchUser);
}
export default mySaga;

function* iterEntries(obj) {
	let keys = Object.keys(obj);
	for (let i = 0; i < keys.length; i++) {
		let key = keys[i];
		yield [key, obj[key]];
	}
}
let myObj = {
	foo: 3,
	bar: 7
};
for (let [key, value] of iterEntries(myObj)) {
	console.log(key, value);
}
// foo 3
// bar 7

class soldier{
}

function strong(target) {
	target.AK = true
}

@strong
class soldier {}

soldier.AK //true

@decorator
class A {}
// 等同于
class A {}
A = decorator(A) || A;

@testable
class MyTestableClass {
	// ...
}

function testable(target) {
	target.isTestable = true;
}
MyTestableClass.isTestable // true

function testable(isTestable) {
	return function(target) {
		target.isTestable = isTestable;
	}
}

@testable(true)
class MyTestableClass {}
MyTestableClass.isTestable // true

@testable(false)
class MyClass {}
MyClass.isTestable // false

function readonly(target, name, descriptor) {
	descriptor.writable = false; // 将可写属性设为false
	return descriptor;
}

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

readonly(Person.prototype, 'name', descriptor);

function dec(id) {
	console.log('evaluated', id);
	return (target, property, descriptor) => console.log('executed', id);
}
class Example {
	@dec(1)
	@dec(2)
	method() {}
}
// evaluated 1
// evaluated 2
// executed 2
// executed 1

var counter = 0;
var add = function() {
	counter++;
};
@add

function foo() {}

var counter;
var add;
@add

function foo() {}
counter = 0;
add = function() {
	counter++;
};

class MyReactComponent extends React.Component {}
export default connect(mapStateToProps, mapDispatchToProps)(MyReactComponent);

@connect(mapStateToProps, mapDispatchToProps)
export default class MyReactComponent extends React.Component {}

function mixins(...list) {
	return function(target) {
		Object.assign(target.prototype, ...list);
	};
}
// 使用
const Foo = {
	foo() {
		console.log('foo')
	}
};
@mixins(Foo)
class MyClass {}
let obj = new MyClass();
obj.foo() // "foo"

const s = new Set();

s.add(1).add(2).add(2); // 2只被添加了一次

s.delete(1)

s.has(2)

s.clear()

let set = new Set(['red', 'green', 'blue']);
for (let item of set.keys()) {
	console.log(item);
}
// red
// green
// blue

for (let item of set.values()) {
	console.log(item);
}
// red
// green
// blue

for (let item of set.entries()) {
	console.log(item);
}
// ["red", "red"]
// ["green", "green"]
// ["blue", "blue"]

let set = new Set([1, 4, 9]);
set.forEach((value, key) => console.log(key + ' : ' + value))
// 1 : 1
// 4 : 4
// 9 : 9

// 数组
let arr = [3, 5, 2, 2, 5, 5];
let unique = [...new Set(arr)]; // [3, 5, 2]

// 字符串
let str = "352255";
let unique = [...new Set(str)].join(""); // "352"

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

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

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

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

const m = new Map()

const map = new Map();
map.set('foo', true);
map.set('bar', false);
map.size // 2

const m = new Map();

m.set('edition', 6) // 键是字符串
m.set(262, 'standard') // 键是数值
m.set(undefined, 'nah') // 键是undefined
m.set(1, 'a').set(2, 'b').set(3, 'c') //链式操作

const m = new Map();
const hello = function() {console.log('hello');};
m.set(hello, 'Hello ES6!') // 键是函数
m.get(hello) // Hello ES6!

const m = new Map();

m.set('edition', 6);
m.set(262, 'standard');
m.set(undefined, 'nah');

m.has('edition') // true
m.has('years') // false
m.has(262) // true
m.has(undefined) // true

const m = new Map();
m.set(undefined, 'nah');
m.has(undefined) // true
m.delete(undefined)
m.has(undefined) // false

let map = new Map();
map.set('foo', true);
map.set('bar', false);
map.size // 2
map.clear()
map.size // 0

const map = new Map([
 ['F', 'no'],
 ['T', 'yes'],
]);

for (let key of map.keys()) {
 console.log(key);
}
// "F"
// "T"

for (let value of map.values()) {
 console.log(value);
}
// "no"
// "yes"

for (let item of map.entries()) {
 console.log(item[0], item[1]);
}
// "F" "no"
// "T" "yes"

// 或者
for (let [key, value] of map.entries()) {
 console.log(key, value);
}
// "F" "no"
// "T" "yes"

// 等同于使用map.entries()
for (let [key, value] of map) {
 console.log(key, value);
}
// "F" "no"
// "T" "yes"

map.forEach(function(value, key, map) {
 console.log("Key: %s, Value: %s", key, value);
});

const ws = new WeakSet();

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

let ws=new WeakSet();

// 成员不是引用类型
let weakSet=new WeakSet([2,3]);
console.log(weakSet) // 报错

// 成员为引用类型
let obj1={name:1}
let obj2={name:1}
let ws=new WeakSet([obj1,obj2]);
console.log(ws) //WeakSet {{…}, {…}}

// WeakMap可以使用set方法添加成员 
const wm1 = new WeakMap();
const key = {foo: 1};
wm1.set(key, 2);
wm1.get(key) // 2

// WeakMap也可以接受一个数组
// 作为构造函数的参数
const k1 = [1, 2, 3];
const k2 = [4, 5, 6];
const wm2 = new WeakMap([[k1, 'foo'], [k2, 'bar']]);
wm2.get(k2) // "bar"

const map = new WeakMap();
map.set(1, 2)
// TypeError: 1 is not an object!
map.set(Symbol(), 2)
// TypeError: Invalid value used as weak map key
map.set(null, 2)
// TypeError: Invalid value used as weak map key

const wm = new WeakMap();
const element = document.getElementById('example');
wm.set(element, 'some information');
wm.get(element) // "some information"

const wm = new WeakMap();
let key = {};
let obj = {foo: 1};

wm.set(key, obj);
obj = null;
wm.get(key)
// Object {foo: 1}

#!/bin/bash
# metaprogram
echo '#!/bin/bash' >program
for ((I=1; I<=1024; I++)) do
 echo "echo $I" >>program
done
chmod +x program

var proxy = new Proxy(target, handler)

var person = {
	name: "张三"
};
var proxy = new Proxy(person, {
	get: function(target, propKey) {
		return Reflect.get(target, propKey)
	}
});
proxy.name // "张三"

function createArray(...elements) {
	let handler = {
		get(target, propKey, receiver) {
			let index = Number(propKey);
			if (index < 0) {
				propKey = String(target.length + index);
			}
			return Reflect.get(target, propKey, receiver);
		}
	};
	let target = [];
	target.push(...elements);
	return new Proxy(target, handler);
}
let arr = createArray('a', 'b', 'c');
arr[-1] // c

const target = Object.defineProperties({}, {
	foo: {
		value: 123,
		writable: false,
		configurable: false
	},
});
const handler = {
	get(target, propKey) {
		return 'abc';
	}
};
const proxy = new Proxy(target, handler);
proxy.foo
// TypeError: Invariant check failed

let validator = {
	set: function(obj, prop, value) {
		if (prop === 'age') {
			if (!Number.isInteger(value)) {
				throw new TypeError('The age is not an integer');
			}
			if (value > 200) {
				throw new RangeError('The age seems invalid');
			}
		}
		// 对于满足条件的age属性以及其他属性，直接保存
		obj[prop] = value;
	}
};
let person = new Proxy({}, validator);
person.age = 100;
person.age // 100
person.age = 'young' // 报错
person.age = 300 // 报错

const obj = {};
Object.defineProperty(obj, 'foo', {
	value: 'bar',
	writable: false,
});
const handler = {
	set: function(obj, prop, value, receiver) {
		obj[prop] = 'baz';
	}
};
const proxy = new Proxy(obj, handler);
proxy.foo = 'baz';
proxy.foo // "bar"

'use strict';
const handler = {
	set: function(obj, prop, value, receiver) {
		obj[prop] = receiver;
		// 无论有没有下面这一行，都会报错
		return false;
	}
};
const proxy = new Proxy({}, handler);
proxy.foo = 'bar';
// TypeError: 'set' on proxy: trap returned falsish for property 'foo'

var handler = {
	deleteProperty(target, key) {
		invariant(key, 'delete');
		Reflect.deleteProperty(target, key)
		return true;
	}
};

function invariant(key, action) {
	if (key[0] === '_') {
		throw new Error(`无法删除私有属性`);
	}
}
var target = {
	_prop: 'foo'
};
var proxy = new Proxy(target, handler);
delete proxy._prop
// Error:无法删除私有属性

Proxy.revocable(target, handler); 1

let numericDataStore = {
	count: 0,
	amount: 1234,
	total: 14
};
numericDataStore = new Proxy(numericDataStore, {
	set(target, key, value, proxy) {
		if (typeof value !== 'number') {
			throw Error("属性只能是number类型");
		}
		return Reflect.set(target, key, value, proxy);
	}
});
numericDataStore.count = "foo"
// Error: 属性只能是number类型
numericDataStore.count = 333
// 赋值成功

let api = {
	_apiKey: '123abc456def',
	getUsers: function() {},
	getUser: function(userId) {},
	setUser: function(userId, config) {}
};
const RESTRICTED = ['_apiKey'];
api = new Proxy(api, {
	get(target, key, proxy) {
		if (RESTRICTED.indexOf(key) > -1) {
			throw Error(`${key} .`);
		}
		return Reflect.get(target, key, proxy);
	},
	set(target, key, value, proxy) {
		if (RESTRICTED.indexOf(key) > -1) {
			throw Error(`${key} `);
		}
		return Reflect.get(target, key, value, proxy);
	}
});
console.log(api._apiKey)
api._apiKey = '987654321'
// 上述都抛出错误

const queuedObservers = new Set();
const observe = fn => queuedObservers.add(fn);
const observable = obj => new Proxy(obj, {
	set
});

function set(target, key, value, receiver) {
	const result = Reflect.set(target, key, value, receiver);
	queuedObservers.forEach(observer => observer());
	return result;
}