箭头函数与 this
法则：this的指向在函数定义的时候是确定不了的，只有函数执行的时候能力确定this到底指向谁，实际上this的最终指向的是那个调用它的对象。在 ES6+ 的箭头函数中是没有本人this的，解决机制是应用本人上下文里的this
为何 this？
this就是以后函数执行的主体（谁执行了函数）。
常见 this 场景
- 事件绑定：事件触发时
this个别都是被操作的元素 一般函数：
- 函数执行时查看后面是否有点，如果有点，则点后面的就是执行主体，没有点就是 window，严格模式下是 undefined。
- 匿名函数、回调函数中的
this是window或者undefined。
- 构造函数：待定。。。
- 箭头函数：函数中是没有本人
this的，解决机制是应用本人上下文里的this。 - 基于 call/bind/apply 强制扭转 this 指向
Proxy
Proxy 这个词的原意是代理，用在这里示意由它来“代理”某些操作，能够译为“代理器”。
const person = { name: "李四", sex: "男", age: 18,};var obj = new Proxy(person, { get: function (target, propKey, receiver) { return target[propKey]; }, set: function (target, propKey, value, receiver) { console.log("value --->", value); return target[propKey]; },});obj.name = "jack";console.log(obj.name);// 输入// value ---> jack// 李四比照 defineProperty
Object.defineProperty(object1, "property1", { value: 42, writable: false,});object1.property1 = 77;// throws an error in strict modeconsole.log(object1.property1);// expected output: 42defineProperty只能监督属性的读写，Proxy能够监督到删除、调用等defineProperty须要重写数组上的办法能力劫持，Proxy能够间接监督Proxy以非侵入的形式监管的对象的读写
Reflect
对立提供一套操作对象的 API
const person = { name: "李四", sex: "男", age: 18,};// console.log("name" in person);// console.log(delete person["age"]);// console.log(Object.keys(person));Reflect.has(person, "name");Reflect.defineProperty(person, "age");Reflect.ownKeys(person);Reflect.apply(target, thisArg, args)：等同于Function.prototype.apply.call(func, thisArg, args)，用于绑定this对象后执行给定函数。Reflect.construct(target, args)：同于new target(...args)，这提供了一种不应用new，来调用构造函数的办法。Reflect.get(target, name, receiver)：查找并返回target对象的name属性，如果没有该属性，则返回undefined。Reflect.set(target, name, value, receiver)：设置target对象的name属性等于value。Reflect.defineProperty(target, name, desc)：根本等同于Object.defineProperty，用来为对象定义属性Reflect.deleteProperty(target, name)：等同于delete obj[name]，用于删除对象的属性。Reflect.has(target, name)：对应name in obj外面的in运算符。Reflect.ownKeys(target)：用于返回对象的所有属性，根本等同于Object.getOwnPropertyNames与Object.getOwnPropertySymbols之和。Reflect.isExtensible(target)：对应Object.isExtensible，返回一个布尔值，示意以后对象是否可扩大。Reflect.preventExtensions(target)：对应Object.preventExtensions办法，用于让一个对象变为不可扩大。它返回一个布尔值，示意是否操作胜利。Reflect.getOwnPropertyDescriptor(target, name)：根本等同于Object.getOwnPropertyDescriptor，用于失去指定属性的形容对象Reflect.getPrototypeOf(target)：用于读取对象的__proto__属性，对应Object.getPrototypeOf(obj)。Reflect.setPrototypeOf(target, prototype)：用于设置指标对象的原型（prototype），对应Object.setPrototypeOf(obj, newProto)办法。它返回一个布尔值，示意是否设置胜利。
汇合
Set
相似于数组，然而成员的值都是惟一的，没有反复的值。
const s = new Set();s.add(1).add(2).add(3).add(4);console.log(s);// 循环for (item of s) { console.log(item);}// 大小console.log(s.size);// 判断是否存在console.log(s.has(1));// 删除console.log(s.delete(1));console.log(s);// 清空集合s.clear();console.log(s);// 数组转换const arr = [1, 2, 3, 4, 5, 6, 7];// const result = Array.from(new Set(arr));const result = [...new Set(arr)];console.log(result);Map
键值对汇合。与一般对象不必的是，键能够为任何值。一般对象的键位字符。
let map = new Map().set("name", "jaco").set("sex", "男").set("age", 18);console.log(map);console.log(map.has("name"));// map.delete();// map.size;// map.clear();Symbol
Symbol一种新的原始数据类型，示意举世无双的值。它是JavaScript语言的第七种数据类型，前六种是：undefined、null、Boolean、String、Number、Object。
console.log(Symbol("foo"));console.log(Symbol("bba"));const obj = {};obj[Symbol("foo")] = 123;obj[Symbol("bba")] = 123;console.log(obj);// 获取雷同symbolconst s1 = Symbol.for("foo");const s2 = Symbol.for("foo");console.log(s2 === s1);自定义 toString 标签
const obj = { [Symbol.toStringTag]: "hahaha", [Symbol()]: "ttttt",};console.log(obj.toString());获取 symbol 属性名
Object.keys(obj)，无奈获取symbol类型属性名。JSON.stringify(obj)，序列化时会疏忽symbol类型。
console.log(Object.getOwnPropertySymbols(obj));可迭代接口
是一种接口，为各种不同的数据结构（数组、对象、set、map）提供对立的拜访机制。任何数据结构只有部署 Iterator 接口，就能够实现遍历操作（即顺次解决该数据结构的所有成员）。var it = makeIterator(["a", "b"]);it.next(); // { value: "a", done: false }it.next(); // { value: "b", done: false }it.next(); // { value: undefined, done: true }function makeIterator(array) { var nextIndex = 0; return { next: function () { return nextIndex < array.length ? { value: array[nextIndex++], done: false } : { value: undefined, done: true }; }, };}（1）创立一个指针对象，指向以后数据结构的起始地位。也就是说，遍历器对象实质上，就是一个指针对象。
（2）第一次调用指针对象的 next 办法，能够将指针指向数据结构的第一个成员。
（3）第二次调用指针对象的 next 办法，指针就指向数据结构的第二个成员。
（4）一直调用指针对象的 next 办法，直到它指向数据结构的完结地位。
对象类型调用
const obj = { a: 1, b: 2, c: 3 };function* entries(obj) { for (let key of Object.keys(obj)) { yield [key, obj[key]]; }}for (let [key, value] of entries(obj)) { console.log(key, "->", value);}ECMAScript2016 概述
includes
const arr = [1, 2, 3, 45, NaN, false];console.log(arr.indexOf(45));console.log(arr.indexOf(NaN));console.log(arr.includes(NaN));// 3// -1// true- 指数运算符
console.log(Math.pow(2, 4)); // 16console.log(2 ** 4); // 16ECMAScript2017 概述
Object.values返回对象中值组成的数组
const person = { name: "李四", sex: "男", age: 18,};// Object.values;console.log(Object.keys(person)); // [ 'name', 'sex', 'age' ]console.log(Object.values(person)); // [ '李四', '男', 18 ]Object.entries以数组模式返回对象中的键值对
const person = { name: "李四", sex: "男", age: 18,};console.log(Object.entries(person));// [ [ 'name', '李四' ], [ 'sex', '男' ], [ 'age', 18 ] ]for (const [key, value] of Object.entries(person)) { console.log(key, value);}// name 李四// sex 男// age 18console.log(new Map(Object.entries(person)));// Map(3) { 'name' => '李四', 'sex' => '男', 'age' => 18 }String.prototype.padStart / String.prototype.padEnd：字符串减少前缀后缀
const obj = { num: 10, perice: 100,};for (const [name, count] of Object.entries(obj)) { console.log( `${name.padStart(10, "-")}|${count.toString().padStart(10, "0")}` );}// -------num|0000000010// ----perice|0000000100Object.getOwnPropertyDescriptors：获取对象形容信息
const p1 = { firstName: "jasper", lastName: "yang", get fullName() { return this.firstName + this.lastName; },};console.log(p1.fullName);// 通过 Object.assign 形式复制对象 get 办法被当作一般属性复制过去，所以更改 lastName 并没有扭转 p2// const p2 = Object.assign({}, p1);// p2.lastName = "wang";// console.log(p2.fullName);const desc = Object.getOwnPropertyDescriptors(p1);const p2 = Object.defineProperties({}, desc);p2.lastName = "wang";console.log(p2.fullName); // jasperwang