jsliang 求职系列 - 15 - 手写源码系列汇总

一 目录

不折腾的前端，和咸鱼有什么区别

目录
一 目录
二 jsliang 整理
三 参考文献
3.1 手写系列文章
3.2 手写 call/bind/apply
3.3 手写深拷贝和浅拷贝
3.4 手写 Promise

二 jsliang 整理

本系列有 8 篇文章，19 个手写方法，大纲 32 个知识点。

手写系列存放位置：

• 手写系列

jsliang 温馨提示：公众号可能无法直接跳转对应地址，请点击阅读原文

各个手写具体实现：

• Promise

• • 简写版 Promise（不支持异步）

  • 手写 Promise（resolve、reject、then）

  • 实现 Promise.all()

  • 实现 Promise.race()

  • 实现 Promise 异步调度器

• 防抖和节流

• • 防抖

  • 节流

  • 防抖 + 节流（必定能触发的防抖）

• 浅拷贝和深拷贝

• • 手写浅拷贝

  • Object.assign

  • 浅拷贝其他方法：concat()、slice()、[...arr]

  • 手写深拷贝

  • JSON.parse(JSON.stringify())

  • Lodash 的 _.cloneDeep()

  • JQuery 的 $.extend()

• call+bind+apply

• • 原生 call 和手写 call

  • 原生 bind 和手写 bind

  • 原生 apply 和手写 apply

• JSONP

• • 基本原理：利用 script 标签的 src 没有跨域限制来完成实现

  • 优缺点：只能 GET；兼容性好

  • 简单实现：通过 url, params, callbackKey, callback 来定义 JSONP() 方法的参数

  • 考虑多次调用：基于简单实现，添加数组保存 callback 的返回

• new

• • 3 行代码手写 new

  • 手写 new 的 5 个特点

  • 完整版手写 new

• 其他

• • Object.create()

  • ES5 实现类继承

  • instanceof

  • 柯里化：求 add(1)(2)(3)

  • 迭代器

  • Ajax

  • 数组扁平化：手撕、flat()、reduce()

  • 数组去重：手撕、Set、filter()

  • 其他

三 参考文献

本系列有 46 篇参考文献。

3.1 手写系列文章

• 前端面试常见的手写功能【阅读建议：30min】

• 32个手写JS，巩固你的JS基础（面试高频）【阅读建议：30min】

• 22 道高频 JavaScript 手写面试题及答案【阅读建议：30min】

• 「中高级前端面试」JavaScript手写代码无敌秘籍【阅读建议：30min】

• 几道JS代码手写题以及一些代码实现【阅读建议：30min】

• 三元-手写代码系列【阅读建议：30min】

• CORS 原理及实现【阅读建议：30min】

• JSONP 原理及实现【阅读建议：30min】

• jsonp的原理与实现【阅读建议：10min】

• 20道JS原理题助你面试一臂之力！【阅读建议：30min】

• 7分钟理解JS的节流、防抖及使用场景【阅读建议：10min】

• 防抖和节流原理分析【阅读建议：10min】

• 前端性能相关：防抖、节流【阅读建议：5min】

• 面试官(6): 写过『通用前端组件』吗?【阅读建议：20min】

• 面试官:既然React/Vue可以用Event Bus进行组件通信,你可以实现下吗?【阅读建议：20min】

• 浅谈 instanceof 和 typeof 的实现原理【阅读建议：10min】

• 解锁多种JavaScript数组去重姿势【阅读建议：20min】

• 如何在 JavaScript 中更好地使用数组【阅读建议：10min】

• 7种方法实现数组去重【阅读建议：20min】

3.2 手写 call/bind/apply

• MDN - Arguments【阅读建议：5min】

• MDN - call【阅读建议：5min】

• MDN - apply【阅读建议：5min】

• MDN - bind【阅读建议：5min】

• 不用call和apply方法模拟实现ES5的bind方法【阅读建议：1h】

• JavaScript深入之call和apply的模拟实现【阅读建议：20min】

• this、apply、call、bind【阅读建议：30min】

• 面试官问：能否模拟实现JS的call和apply方法【阅读建议：10min】

• JavaScript基础心法—— call apply bind【阅读建议：20min】

• 回味JS基础:call apply 与 bind【阅读建议：10min】

3.3 手写深拷贝和浅拷贝

• 如何写出一个惊艳面试官的深拷贝?【阅读建议：2h】

• 深拷贝的终极探索（90%的人都不知道）【阅读建议：1h】

• JavaScript基础心法——深浅拷贝【阅读建议：30min】

• JavaScript专题之深浅拷贝【阅读建议：20min】

• javaScript中浅拷贝和深拷贝的实现【阅读建议：20min】

• 深入剖析 JavaScript 的深复制【阅读建议：20min】

• 「JavaScript」带你彻底搞清楚深拷贝、浅拷贝和循环引用【阅读建议：20min】

• 面试题之如何实现一个深拷贝【阅读建议：30min】

• 面试官:请你实现一个深克隆【阅读建议：10min】

3.4 手写 Promise

• 100 行代码实现 Promises/A+ 规范【阅读建议：30min】

• 最简实现 Promise，支持异步链式调用（20行）【建议阅读：20min】

• BAT 前端经典面试问题：史上最最最详细的手写 Promise 教程【阅读建议：30min】

• 一起学习造轮子（一）：从零开始写一个符合Promises/A+规范的promise【阅读建议：大概看了遍，没前面剖析的清晰】

• Promise实现原理（附源码）【阅读建议：大概看了遍，没前面剖析的清晰】

• 剖析Promise内部结构，一步一步实现一个完整的、能通过所有Test case的Promise类【建议阅读：写得比较细，没前面剖析的清晰】

• 小邵教你玩转promise源码【建议阅读：写得比较细，没前面剖析的清晰】

• Promise不会？？看这里！！！史上最通俗易懂的Promise！！！【建议阅读：写得比较细，没前面剖析的清晰】

---

jsliang 的文档库由 梁峻荣 采用 知识共享 署名-非商业性使用-相同方式共享 4.0 国际 许可协议 进行许可。
基于 https://github.com/LiangJunrong/document-library 上的作品创作。
本许可协议授权之外的使用权限可以从 https://creativecommons.org/licenses/by-nc-sa/2.5/cn/ 处获得。