作为前端的一枚小菜鸟也憧憬着自己有朝一日能写出自己的框架，哪怕是流利理解三大框架的源码也好，当然这没有关公面试耍大刀的意味╮(‵▽′)╭

一、找到问题，思考解决思路，参考同类或者类比同类框架实现方式，抽象自己的方案，不断的优化重构去写就可以了。

框架的目的解决一系列特定的问题，复刻不是水平，创新才是。

二、框架是解决方案的代码实现。要写出优秀的框架，首先要善于发现问题（当然也要善于发现机会，总是亦步亦趋解决别人已经解决过的问题是不被认可的），其次才是用精巧的思路进行代码实现。

三、现在的前端mvvm（react、vue，）框架基本都是由以下几部分组成

• 虚拟dom
• diff算法（本质是如何找到一个对象树的差异并更新，当然为了避免一股脑diff可能造成页面卡顿，可以设计成时间切片的形式）
• 如何设计组件化（函数组件、类组件）
• 数据更新机制（vue是数据劫持、react是调用setState）
• 全局状态管理（vuex、redux...）
• 路由设计
• 逻辑复用机制（hooks、Function based ）
• 模板语法的选择（jsx or template）
• 实现模板解析

综上，再复杂的框架都是由各个小的技术点累计而成的，那么将以上每一个技术点都能钻研透彻，并能够将其灵活的组合起来的那么你离完成一个框架就不远了。

当然，能写框架到写出好的框架再到能够投入到生产环境还有相当长的一段路要走，大部分人也就停留到能写框架的地步吧。

JavaScript进阶攻略

高级前端进阶导学

前端高级课程体系梳理

高效源码学习技巧

设计模式-jQuery源码分析

整体架构-jQuery核心功能函数揭秘

Sizzle-选择器

回调对象设计

Callbacks入门

Callbacks原理分析

异步回调解决方案

延时对象-Deferred概念

延时对象-Deferred源码解析

事件绑定

事件绑定-bind/delegate/on

事件绑定-体系结构/委托设计

事件绑定-自定义设计/模拟事件

DOM操作

DOM操作核心

DOM操作方法-html.text.css

UNDERSCORE.JS源码分析

设计篇

函数式编程思想概述

underscors整体机构&面向对象

undefned的处理/函数式编程回调iteratee设计

rest参数/underscors创建对象方式

辅助功能篇

数组篇

数组定位&摊平数组

数组运算uniq去重函数 原生对象扩展

函数篇

对象篇

模块化编程-自研模块加载器

大家可以关注我，私信回复“前端资源”获取JavaScript进阶资料