一些你可能不熟悉的JS知识点总结

 var temp = 123; if(true) { console.log(temp); let temp; }

 var arr = [1, 2, 3]; var max = Function.prototype.apply.call(Math.max, null, arr); console.log(max); // 3

 (Function.prototype.apply).call(Math.max, null, arr)

 Math.max.apply(undefined, arr)

 var arr = [1, 2, 3]; var max = Function.prototype.call.apply(Math.max, null, arr); console.log(max); // -Infinity

 var arr = [1, 2, 3]; var max = Function.prototype.call.apply(Math.max, arr); console.log(max); // 3

 var a = Function.prototype.call.apply(function(a){return a;}, [0,4,3]); alert(a); 

 // 将call方法看成一个整体 (Function.prototype.call).apply(function(a){return a;}, [0,4,3]); // func.apply(context, args)可以转化为context.func(...args) (function(a){return a;}).call(0, 4, 3); // 所以结果很明显，输出4

 // onChange 即要进行的监听操作 var watch = (object, onChange) => { const handler = { // 如果属性对应的值为对象，则返回一个新的Proxy对象 get(target, property, receiver) { try { return new Proxy(target[property], handler); } catch (err) { return Reflect.get(target, property, receiver); } }, // 定义或修改对象属性 defineProperty(target, property, descriptor) { onChange('define',property); return Reflect.defineProperty(target, property, descriptor); }, // 删除对象属性 deleteProperty(target, property) { onChange('delete',property); return Reflect.deleteProperty(target, property); } }; return new Proxy(object, handler); }; // 测试对象 var obj = { name: 'bjw', age: 22, child: [1, 2, 3] } // 对象代理 var p = watch(obj1, (type, property) => { console.log(`类型：${type}, 修改的属性：${property}`) }); p.name = 'qwe' 类型：define, 修改的属性：name "qwe" p.child Proxy {0: 1, 1: 2, 2: 3, length: 3} p.child.push(4) 类型：define, 修改的属性：3 类型：define, 修改的属性：length 4 p.child.length = 2 类型：define, 修改的属性：length 2 p.child Proxy {0: 1, 1: 2, length: 2}

 // target：目标函数 // this：绑定的上下文对象 // arguments：函数的参数列表 Reflect.apply(target, this, arguments) const arr = [2, 3, 4, 5, 6]; let max; // ES6 max = Reflect.apply(Math.max, null, arr) // ES5 max = Math.max.apply(null, arr); max = Function.prototype.apply.call(Math.max, null, arr);

 // 这个方法，提供了一种新的不使用new来调用构造函数的方法 function A(name) { console.log('Function A is invoked!'); this.name = name; } A.prototype.getName = function() { return this.name; }; function B(age) { console.log('Function B is invoked!'); this.age = age; } B.prototype.getAge = function() { return this.age; }; // 测试 (这两种是一致的) var tom = new A('tom'); var tom = Reflect.construct(A, ['tom']); // jnney继承了A的实例属性，同时继承了B的共享属性 // 简单来说，A构造函数被调用，但是 jnney.__proto__ === B.prototype var jnney = Reflect.construct(A, ['jnney'], B); 

 let obj = {}; let obj1 = Object.defineProperty(obj, 'name', { enumerable: true, value: 'bjw' }); // 这里会返回false 因为我们上面定义name这个属性是不可修改的, // 然后我们又在这里修改了name属性,所以修改失败返回值为false let result1 = Reflect.defineProperty(obj, 'name', { configurable: true, enumerable: true, value: 'happy' }); console.log(result1); // false 

 let obj = { name: 'dreamapple', age: 22 }; let r1 = Reflect.deleteProperty(obj, 'name'); console.log(r1); // true let r2 = Reflect.deleteProperty(obj, 'name'); console.log(r2); // true let r3 = Reflect.deleteProperty(Object.freeze(obj), 'age'); console.log(r3); // false

 var obj = {age: 22} Reflect.getOwnPropertyDescriptor(obj, 'age') {value: 22, writable: true, enumerable: true, configurable: true}

 function A(name) { this.name = name || 'dreamapple'; } A.prototype.getName = function() { return this.name; }; var a = new A(); console.log('name' in a); // true console.log('getName' in a); // true let r1 = Reflect.has(a, 'name'); let r2 = Reflect.has(a, 'getName'); console.log(r1, r2); // true true

 let obj = {}; let r1 = Reflect.isExtensible(obj); console.log(r1); // true // 密封这个对象 Object.seal(obj); let r2 = Reflect.isExtensible(obj); console.log(r2); // false

 // AMD define(['./a', './b'],function(a, b){ // 模块加载完毕可以使用 a.do(); b.do(); }); // CMD define(function(require, exports, module){ // 加载模块 var a = require('./a'); });

 // a.js module.exports = { a: 1 } // or exports.a = 1; // 在b.js中可以引入 var module = require('./a'); module.a // log 1

 // module 基本实现 var module = { id: 'xxx', exports: {} } var exports = module.exports; // 所以，通过对exports重新赋值，不能导出变量

 // 导入模块 import xxx form './a.js'; import { xxx } from './b.js'; // 导出模块 export function a(){} // 默认导出 export default {}; export default function(){} 

 const PENDING = 'pending'; const RESOLVED = 'resolved'; const REJECTED = 'rejected'; function MyPromise(fn) { const _this = this; _this.state = PENDING; _this.value = null; _this.resolvedCallbacks = []; _this.rejectedCallbacks = []; // resolve函数 function resolve(value) { if (_this.state === PENDING) { _this.state = RESOLVED; _this.value = value; _this.resolvedCallbacks.map(cb => cb(_this.value)); } } // rejected函数 function reject(value) { if (_this.state === PENDING) { _this.state = REJECTED; _this.value = value; _this.rejectedCallbacks.map(cb => cb(_this.value)); } } // 当创建对象的时候，执行传进来的执行器函数 // 并且传递resolve和reject函数 try { fn(resolve, reject); } catch (e) { reject(e); } } // 为Promise原型链上添加then函数 MyPromise.prototype.then = function (onFulfilled, onRejected) { const _this = this; onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : v => v; onRejected = typeof onRejected === 'function' ? onRejected : r => { throw r; } if (_this.state === PENDING) { _this.resolvedCallbacks.push(onFulfilled); _this.rejectedCallbacks.push(onRejected); } if (_this.state === RESOLVED) { onFulfilled(_this.value); } if (_this.state === REJECTED) { onRejected(_this.value); } return _this; } // 测试 new MyPromise(function (resolve, reject) { setTimeout(() => { resolve('hello'); }, 2000); }).then(v => { console.log(v); }).then(v => { console.log(v + "1"); })