知食记
  • 知食记
  • 思维导图
  • 归档
  • 博客
    • 理解 CAP 理论,以开一家餐厅为例
    • TypeScript tsconfig.json 整理
    • this 陷阱与原理
    • 时间戳与时区
    • vue-cli 项目添加 tailwind.css
    • 实现 JavaScript 数组的逆序索引
    • 工程师段位记
    • Jest 内部原理剖析
    • 如何成为技术高手
    • Vue lifecycle hook little trick
    • 利用 Cloudflare Worker 定制 Gitbook
    • 如何解除端口占用?
  • 🎃CSS
    • CSS基础
      • 盒模型
      • 清除浮动
      • html5的语义化标签
      • 水平居中
      • 垂直局中
      • 水平垂直居中
      • Sticky Footer
      • 三栏布局
      • 文本截断省略号
      • 伪类与伪元素
      • 定位
      • BEM
      • 主题切换
      • 权重
      • px, em, rem
      • flex 布局
    • CSS3
      • calc
    • SCSS
      • lighten
  • 🎉JavaScript
    • JS 概念
      • 类型
      • 类型转换
      • 内存
      • 原型链
      • 继承
        • 类式继承+原型继承
        • 构造函数继承
        • 组合式继承
        • 寄生继承
        • 寄生组合
      • 词法作用域
      • 事件委托
      • Falsy
      • This
      • 闭包
      • Event-loop
      • 跨域
      • function.length
      • arguments
      • !!
      • void 0
      • 柯里化1
      • 柯里化2
      • 异常
      • 协程
    • JS陷阱
      • 相等
      • 连等赋值
      • 改变数组的length
      • 引用传参
      • new Number vs Number
      • new Object vs Object vs Object.create(null)
    • JS开发知识点
      • html classlist
      • 图片懒加载
      • 提取对象中所有属性除了某一项
      • 空值判断
    • 实现JS常见函数
      • Debounce
      • Throttle
      • Call, Apply, Bind
      • type
      • 深拷贝
      • isEuqal
      • 数组乱序
      • 数组去重
      • 实现 merge
      • 数组flat
      • 实现 map
      • 数组filter
      • 模拟new
      • 模拟实现async
      • 模拟instance of
      • Object.create(null)与{}
      • 实现promisify
      • 实现Promise.all
      • 实现Promise.race
      • 实现Promise.resolve/reject
      • 实现Promise.finnaly
      • 实现Promise
      • 实现parseInt
      • 实现foreach
      • 实现Object keys
    • 实现JS 常见操作函数
      • JS Empty
      • JS Safe Get
    • JS Worker
      • Cloudflare Worker
    • ES6
      • ES6/ES7/ES8/ES9索引
      • +,-,** 运算符
      • Let 知识点
      • 块级作用域
      • Const知识点
      • Class
      • Proxy
      • Reflect
      • Symbol
      • Promise
      • Iterator
      • For-of
      • for..in 与 for..of的区别
      • Iterator
      • Generator函数
      • async
      • 装饰器
      • 模块
      • WeakMap
      • 模块
      • 尾调用优化
    • ES6 函数
      • concat
      • reduce
      • slice
      • splice
      • Array.some
      • Array every
      • Array.prototype.includes
      • Object.entries/Object.values/Object.keys
    • Typescript
      • 使用
        • 基础类型
        • ?: 可选属性
        • Keyof
        • is
        • in
        • Partial
        • DeepPartial
        • Required
        • Exclude
        • Pick
        • Omit
        • infer
        • ReturnType
        • Record
        • 重载
        • 泛型变量
        • 泛型接口
        • 字面量类型守卫
        • type和interface的区别
        • 赋值断言
        • 类型断言
      • 编译原理
        • 编译器
      • 设计工具类型(重要)
    • V8
      • JS 数组
      • 垃圾回收
  • 🕹️框架
    • Vue
      • 基础知识
      • 长列表性能优化
      • mixin
      • 渲染函数
      • 组件间通信
      • vue中的柯里化闭包
      • vue 渲染过程
      • Vue采用虚拟DOM的目的是什么
      • keep-alive
      • nextTick
      • vue 数组变异
      • vue-computed原理
      • vue-router原理
      • vue-router权限控制
      • 路由懒加载
      • Vue diff原理
      • computed如何与视图绑定
      • scope css
      • Runtime Only vs Runtime + Compiler
      • 集中变量管理
        • 程序化的事件侦听器
        • Flux
        • Redux
        • Vuex
    • Vue3
      • Object.defineProperty与Proxy区别
    • React
      • 无法preventDefault
      • Parent控制Child(Lifting state up)
      • Dynamic Ref
      • useRef warning
      • 定义固定长度的数组
    • React-Redux
      • 基础概念
      • mapStateToProps
      • mapDispatchToProps
      • Provider
    • React Hooks
      • useState
      • useEffect
      • useContext
      • useReducer
      • useMemo
    • Nuxt
      • SSR 与 预渲染
    • Koa2
      • compose
  • 🎯算法
    • 算法与数据结构
      • 基础知识
        • 大O表示法
      • 排序
        • 基础知识
        • 冒泡排序 bubble sort
        • 选择排序
        • 插入排序
        • 前三种总结
        • 归并排序
        • 快速排序
        • 以上总结
      • 递归
        • 实现斐波那契数列
        • 深拷贝
        • Array.flat 实现
        • 爬楼梯
        • 递归问题
      • 队列
        • 队列模仿栈
      • 二叉树专题
        • 基本结构
        • 前序遍历
        • 中序遍历
        • 后序遍历
        • 重建二叉树
        • 求二叉树的遍历
        • 相同的树
      • 回溯法
      • JS 大数相加
      • 动态规划
        • 爬楼梯
      • 二分搜索
      • LRU
      • 数据结构
        • 数组
        • 栈
        • 队列
        • 链表
          • 单链表
          • 双向链表
          • 循环列表
        • 集合
        • 字典
      • Leetcode
        • 1. 两数之和
        • 2. 两数相加
        • 3. 无重复字符最长字串
        • 5. 最长回文子串
        • 6. Z字形变换
        • 7. 整数反转
        • 8. 字符串转换整数
        • 15. 三数之和
        • 134. 加油站
  • 🎁HTML
    • DOM
      • MutationObserver
      • node.contains
      • readystate
    • SVG
      • 坐标系
      • g元素
      • 实现缩放
      • react typescript svg相关
  • 🏈计算机网络
    • 浏览器
      • 浏览器与JS 线程
      • 缓存
      • 浏览器的本地存储
      • 输入URL到页面加载发生了什么
      • Preload, Prefetech,DNS Prefetching
      • defer, async 脚本
      • 前端监控异常捕捉
      • 内存泄露
      • 指纹
      • XSS
      • CSRF
      • 性能优化
      • *网页优化
      • requestAnimationFrame
      • 问题清单
        • 为什么 Javascript 是单线程的?
    • 计算机网络
      • 基础知识
      • 代理
      • HTTP1/2/3
      • HTTPS
      • HTTP请求中的keep-alive
      • http的方法
      • HTTP状态码
      • 运输层
        • TCP
          • 可靠传输
        • UDP
      • CA
      • CORS
      • Referer
      • referer, host, origin对比
      • websocket
      • CDN
  • 🥊前端生态
    • Webpack
      • 基础概念
      • 配置记录
      • sourcemap
      • 常用Webpack插件记录
      • webpack相关竞品
      • HMR
      • Tree-shaking的原理
      • Long Term Cache
      • Code Splitting
    • Babel
    • Fetch
      • Fetch取消请求
    • Axios
      • axios避免重复请求
      • 运行机制
      • 取消源码
      • axios做到多种调用方式
    • Npm
      • 设置镜像源
      • 全局安装目录
      • npx
      • 镜像源
    • Yarn
      • yarn link
    • 业务开发
      • 记住登陆
      • 统一登录/单点登录/SSO
      • 大文件上传与断点续传
      • 防止表单重复提交
      • 扫码登录如何实现的
      • 高性能网站标准
      • 性能监控
        • performance 分析
        • 上报
        • 首屏时间
    • 微前端
      • 微前端实施方式
      • single-spa重要概念
    • Hexo
      • 常用Hexo插件记录
  • 🏀后端
    • Node
      • nodejs的应用
      • API 网关
    • Java
      • 简介
    • Python
      • Pyenv
  • 🕹️面试
    • 面试真经
      • Set、Map、WeakSet 和 WeakMap 的区别?
      • Map+ParseInt
      • 红绿灯Promise问题
      • 0.1 + 0.2
      • vue面试清单
      • 状态码问题 301 302
      • 算法和数据结构清单
      • 腾讯面经
        • 电话面试
          • window的onload事件和domcontentloaded顺序
        • 远程面
          • new和instanceof的内部机制
          • typeof 和 instanceof 区别
          • flex-grow和flex-shrink属性有什么用?
      • 头条面经
        • 笔试
          • 153812.7 转化153,812.7
          • 日期转化为2小时前,1分钟前等
          • 实现sum(1)(2)(3) = 6
          • 最多频次
          • 类继承面试
          • 前端请求并发控制
          • CSS画三角形
          • CSS 画正方形
          • 下载页面的所有图片
          • 实现链式调用
          • 100 * 100 的 Canvas 占内存多大
      • javascript-questions
        • 原型链与new优先级
        • 函数+模板字符串
        • 对象引用
        • use strict
        • 声明提升相关
        • 对象键值存储
        • target与事件冒泡
        • call与bind
        • falsy
        • map, reduce和正则
        • event-loop与promise
        • 变量提升和声明作用域
    • To-do
      • axios 重放多种策略
  • 🤖开源
    • 开源项目
      • Hooks
      • 论坛
      • 开发流程
      • 前端监控
      • 模板
      • svg
  • 🧸其他
    • Linux
      • 免密登陆
      • Mac终端代理
    • Git
      • 创建 ssh rsa
      • 删除分支
      • 覆盖已有提交
      • 合并多个commit
      • 撤销merge
    • 正则
      • 题目
        • 转换为驼峰命名法
        • JS实现千位分隔符
        • 获取 url 参数
        • 用正则实现trim() 清除字符串两端空格
    • 设计模式
      • 简单工厂模式
      • 抽象工厂模式
      • 单例模式
      • 装饰器模式
      • 适配器模式
      • 代理模式
      • 观察者模式
      • 发布-订阅模式
      • 观察者模式与发布-订阅模式的区别是什么?
      • 单例模式
      • 工厂模式
      • 享元模式
    • 计算机理论
      • solid原则
        • SRP | The Single Responsibility Principle
        • OCP | The Open Closed Principle
        • LSP | The Liskov Substitution Principle
        • ISP | The interface Segregation Principle
        • DIP | The Dependency Inversion Principle
由 GitBook 提供支持
在本页
  • 第一阶段 认真构建完整的知识体系
  • 第二阶段 顺着一个Topic钻进去,锻炼自己的预研能力
  • 第三阶段 疯狂回答技术问题
  • 第四阶段 RCA/总结
  • 第一,写 RCA 报告。
  • 第二,写总结。

这有帮助吗?

  1. 博客

如何成为技术高手

转载

这是一篇转载文,文中注重体系化的知识构建和我建立知食记的初衷是一致的。

第一阶段 认真构建完整的知识体系

十几年前我投身软件行业的时候,光是讲解数据库原理、操作系统、TCP/IP、组网、算法等等基础知识的英文原版书摞起来就等身,认认真真看完,各种上手实践,入行后,读遍 C++ 各种经典著作,读遍各种协议原文,认认真真打基础。 很多工程师都说自己平常就是在某些 IT 门户上看看推荐的博文或新闻,我说这属于典型的零敲碎打,不够刺激。 聊到这时,我会举一个例子,为什么要阅读长篇小说,因为中短篇小说就像用针扎你,而长篇小说就像把你装进一个沙袋里吊起来,从四面八方用狼牙棒打你,酣畅淋漓。构建可用的知识体系,就得读书,书是有体系结构的,你关心不关心,现阶段你用到用不到,它都讲到了,从头到尾看几遍,针扎得透透的。 何谓知识体系? 几年前,前支付宝架构师姚建东曾经在我们公司做过技术人员如何规划自己的分享讲座,他是这么论述的: 技术与技巧包括:

  • 计算机基础理论

    • 计算机模型:内存/IO/时钟/CPU……

    • 算法

    • 专项技术领域:

      • 数据挖掘

      • 数据管理

      • 智能推荐

      • 搜索

      • ……

  • 语言与工具

    • 语言与相关体系

    • 开发工具,分析工具,代码管理工具

    • HTML/CSS/JS/Ajax

    • 常用框架与第三方类库

  • 调试与测试

    • 调试方法和哲学

    • 定位问题

    • BUG管理工具

    • 单元测试

    • 集成测试

    • 性能测试

    • 安全测试

    • 兼容性测试与方法

    • JS/Ajax测试与方法

    • 服务层测试

    • Web层测试

  • 网络与系统

    • TCP/IP协议与模型,HTTP/SMTP等协议

    • Linux系统,网络分析工具,系统分析工具

    • 容量,流量与负载均衡

    • 应用部署、规范、规划

    • 安全

    • 监控与故障分析

    • 磁盘与存储

    • Shell

    • DNS与域名

    • 缓存,反向代理

    • 图片服务器(海量小文件)

  • 需求挖掘与分析

    • 需求文档格式

    • 需求访谈

    • 需求分析方法,需求分析工具

    • 领域知识与经验

  • 系统分析与设计

    • UML语言与模型

    • 分析模式

    • 设计模式,领域驱动

    • 系统分析文档格式

    • 系统设计文档格式

    • 功能性需求与非功能性需求

  • 数据与系统

    • 数据库

    • 可伸缩策略,扩展策略,备份,容灾,性能,安全,高可用……

    • 数据设计与范式,SQL/NoSQL,Cache,分布式文件

  • 架构设计

    • 架构模式,典型互联网公司架构演进历史

    • 架构原则,常用策略

    • 架构设计方法

    • 非功能性理解

      • 扩展性

      • 伸缩性

      • 稳定性

      • 一致性

      • 性能

      • 吞吐量

    • 容量预测与规划

    • 架构体系与相关技术

  • 过程与管理

    • 分析过程

    • 研发过程

    • 评审过程

    • 测试过程

    • 发布过程

    • 回滚过程

    • 文档管理

    • 知识管理

    • 项目管理

以上其实就是一份从业基础知识清单,你可以按图索骥,阅读相关书籍。

第二阶段 顺着一个Topic钻进去,锻炼自己的预研能力

无论公司业务还是自己喜欢做的事,都可以抽象出通用性课题,然后以做论文的方式杀进去。这个事情得反复操练,有意识操练。 做事方式为:

  1. 抽象出 Topic——如分布式锁,分布式并行计算引擎,防CSRF的FormToken自动生成框架,定时任务管理与调度平台,分布式跟踪,等等

  2. 向功课好的学生学习——有针对性地深入了解业界其他公司是如何分析问题和解决问题的,汇总各种方案,站在巨人的肩膀上

  3. 分析特定应用场景,技术选型

  4. 兼顾高可用性和可伸缩,做设计评审

  5. 做测试自证靠谱,梳理知识点,开技术分享会

  6. 上线商用,总结经验教训,开经验分享会

其中一个重点是汇总和分享。05年时,应电信级统一消息业务需要,我去研究了 SIP 协议,做了各种试验,分析报文,写了一系列的幻灯片,做了公开分享,一时间还颇受欢迎:

  1. SIP_to_Freshman_by_zhengyun.ppt

  2. SIP之穿越NAT_by_zhengyun.ppt

  3. SIP体系架构讲义及消息交互演示_by_zhengyun.ppt

  4. SIP多方会话消息之实例讲解_by_zhengyun.ppt

  5. SIP安全框架之认证[NTLM和Kerberos]_by_zhengyun.ppt

  6. SIP消息之逐项讲解_by_zhengyun.ppt

第三阶段 疯狂回答技术问题

知识体系慢慢构建,与业务相关的抽象 Topic 也在探索中。 但这还不够。 因为你亲身接触到的世界太小,可能不足以构成挑战,你可能意识不到自己缺多少知识和技能,不利于你分析问题、提出问题和解决问题的能力培养。 所以,要主动出击: 疯狂回答问题。 我曾经在入行的头几年里几乎把我关注的垂直领域(包括语言领域和业务领域)里的所有问题都回答了一遍。我对外宣扬知无不言言无不尽,放出邮件地址和 MSN(那时候 MSN 很高大上),很多网友都会发邮件或者加我好友,问各种开发疑难问题,平均每天都有几个,然后我把解决问题的过程写成微软 KB(KnowledgeBase) 文体发表在我的博客上。 你想想看,工作中的问题你平均每隔几天才能遇到一个,而这么做,每天你都会遇到几个乃至于十几个,第一让你脑力激荡,第二接触到更多新知。 05年到06年期间,我因工作需要学习了 JavaME(或古老的称呼 J2ME),早年间 Symbian 手机上的客户端开发。那段时间我天天扫中文论坛的帖子,力求回答所有问题,尤其是那些 BUG 或故障。对于那些暂时没有人解决的,如流媒体实时播放,如仿 OperaMini 二级菜单界面,都上下求索,最后放出思路以及源码。 同时,我经常整理常见问题,梳理成册并发布。譬如我整理过的 J2ME 疑难问题:

  1. [J2ME Q&A]真机报告MontyThread -n的错误之解释

  2. [J2MEQ&A]WTK初始化WMAClient报错XXX has no IP address的解释

  3. [J2ME Q&A]untrusted domain is not configured问题回应

  4. [J2ME]“Cannot open socket for LIME events”错误解决

几个月后,我成为 J2ME 中文论坛超级版主。通过这个历程,我想告诉大家,回答网友问题,技巧得当的话,比如别老是重复回答新手问题,试着攻克那些疑难问题,或者离奇故障,绝对不会浪费你的时间。 为什么? 因为你要信奉:

你学过的每一样东西,你遭受的每一次苦难,都会在你一生中的某个时候派上用场。 ——佩内洛普·菲兹杰拉德 《离岸》 Everything that you've learnt and all the hardships you've suffered will all come in handy at some point in your life.

第四阶段 RCA/总结

现在是你把经验教训变为财富的时刻了。 什么是好的技术 Leader? 随便一个业务需求或业务场景讲出来,你立刻把它抽象为几个模块/系统/Topic,然后侃侃而谈,业界都是怎么解决的,我们以前又是怎么分析怎么解决的,现在咱们这种情况下应该如何设计,可能会遇到什么问题,我们应该做哪些预防设计,blabla。 怎么做到这一点?

第一,写 RCA 报告。

我以前说过,『窝窝从 2011 年开始,一直坚持每错必查、错了又错就整改、每错必写,用身体力行告诉每一个新员工直面错误、公开技术细节、分享给所有人,长此以往,每一次事故和线上漏测都会变为我们的财富。这就是我们的 RCA(Root Cause Analysis)制度,截止到目前已经收集整理了近两百个详尽的 RCA 报告。』 RCA 报告格式为:

  1. 背景知识(Optional)

  2. 问题现象

  3. 影响范围

  4. 问题原因

  5. 问题分析过程(Optional)

  6. 解决办法

  7. 后续处理措施:如线上脏数据如何修复,如对用户造成的影响如何弥补等(Optional)

  8. 经验教训

  9. RCA类型:如代码问题、实施问题、配置问题、设计问题、测试问题

这样,作为一名合格的老兵,你见过了足够多的血,并且把它们变成了你的人生财富。

第二,写总结。

话说,要经常拉清单。 侃侃而谈得有资料,这些都得是你自己写才能印象深刻,关键时刻想得起来。 好了,这就是我告诉面试者的高手炼成四个阶段。

上一页Jest 内部原理剖析下一页Vue lifecycle hook little trick

最后更新于5年前

这有帮助吗?

为什么要写出来、讲出来呢? 因为有一个学习金字塔理论,如下图所示: 我们读过的事情能够记住学习内容的10%, 我们听过的事情能够记住20%, 我们看过的事情能够记住30%, 我们听过和看过的事情能够记住50%——如看影像/看展览/看演示/现场观摩, 我们说过的事情能够记住70%——如参与讨论/发言, 我们说过和做过的事情能够记住90%——如做报告,给别人讲,亲身体验,动手做。 这也就是我在《》中阐述的管理方法:我们从入职之后就有意识地训练大家,让大家能够公开陈述、清晰表达。所以,试用期内,新人必须做一次技术分享和一次技术评审,面对各方的 challenge;预研的中间和结尾都要有分享会;平时也要定期组织技术讲座。

窝窝研发过去几年做对了哪些事