各种手写源码
导航
防抖
节流
手写 new
手写 Object.create
手写 深拷贝
手写 instanceof
手写 call、apply
手写 bind
手写 Object.assign
手写 reduce
手写 AJAX
手写 柯里化
防抖
function throttle() {
}
节流
function
手写 new
文章可看new 做了什么
ES5 版本:
function new2(Constructor, ...args) {
let obj = Object.create(null);
obj.__proto__ = Constructor.prototype;
let result = Constructor.apply(obj, args);
return typeof result === 'object' ? result : obj;
}
ES3 版本:
function new3() {
let obj = {},
Constructor = Array.prototype.shift.call(arguments)
var F = function(){}
F.prototype = Constructor.prototype
obj = new F()
var result = Constructor.apply(obj, arguments)
returb typeof result === 'object' ? result : obj
}
手写 Object.create
function create(obj) {
function F() {}
F.prototype = obj;
return new F()
}
手写深拷贝
文章可看拷贝的密码
function deepClone(source, storage = new WeakMap()) {
// 针对基本数据类型
if (typeof source !== 'object' || source === null) {
return source
}
// 是否是日期
if (source.constructor === Date) {
return new Date(source)
}
// 是否是正则
if (source.constructor === RegExp) {
return new RegExp(source)
}
// 是否是数组
let target = source instanceof Array ? [] : {}
// 循环引用 返回存储的引用数据
if (storage.has(source)) return storage.get(source)
// 开辟存储空间设置临时存储值
storage.set(source, target)
// 是否包含 Symbol 类型
let isSymbol = Object.getOwnPropertySymbols(source)
// 包含 Symbol 类型
if (isSymbol.length) {
isSymbol.forEach((item) => {
if (typeof source[item] === 'object') {
target[item] = deepClone(source[item], storage);
return
}
target[item] = source[item]
})
}
// 不包含 Symbol
for(let key in source) {
if (source.hasOwnProperty(key)) {
target[key] = typeof source[key] === 'object' ? deepClone(sourcep[key], storage) : source[key]
}
}
return target;
}
写 instanceof
文章可看instanceof——找祖籍
function myInstanceof(left, right) {
if (typeof left !== 'object' || left === null) return false;
let proto = Object.getPrototypeOf(left);
while (true) {
if (proto == null) return false;
if (proto == right.prototype) return true;
proto = Object.getPrototypeOf(proto);
}
}
async/await 实现
reduce 实现
实现一个双向数据绑定
Array.isArray 实现
promise 实现
手写一个防抖/节流函数
柯里化函数的实现
高阶函数的实现
柯里化
分时函数
惰性加载