JavaScript
- 语法
- 设计模式
- 函数式
- 底层
- 框架和类库
- 发展
语法
基础
- 数据类型
基本类型: String Number Boolean undefined null
引用类型: Object Array Function (Date Math RegExp) - 声明
变量声明:var let const symbol
函数声明:function
类声明:class - 运算符
算术运算符: + = * / % ++ –
赋值运算符: = += -= - 循环语句
if else while switch case - 内置属性与方法
高级
- this
动态作用域,谁调用指向谁,默认词法作用域的对象 - 闭包
在词法作用域之外调用 - 深浅拷贝
浅拷贝: Object.assign 深拷贝: JSON.parse(JSON.stringify(obj)) 递归 - 继承
构造函数继承 原型继承 组合继承 关联继承 类继承 - 单线程和异步
js单线程, 使用异步解决代码阻塞 事件队列 task micro task promise async await
设计模式
- 单例模式
- 工厂模式
- 观察者模式(发布订阅模式)
- 模板模式
- 代理模式
- 外观模式
参考: 常用设计模式
函数式
纯函数,高阶函数,柯里化
底层
- js解析原理
js -> 词法分析 -> 有意义代码块 –> 语法分析 –> AST –> 执行 - V8引擎
webkit技术内幕
框架和类库
- jquery
双构造函数共享原型实现无new操作,利用原型添加on, css, html等方法 - vue
响应式: Object.defineProperty
模板: 本质字符串
虚拟DOM: snabbdom diff算法
vue-router: hash history
vuex原理
发展
ES8 typescript
HTML&&CSS
- H5的语义化
- H5的新属性
- C3动画
开发与调试
- 规范
- 构建
- 调试
- 协同
- 测试
- 性能
规范
- 前端代码规范
变量函数命名规则,css命令规则,注释
构建
- webpack
功能强大,配置复杂 - parcel
配置简单,构建速度快
调试
- chrome
debug 性能调试 - fiddler
抓包 - eruda
移动端调试
协同
- svn
- git
测试
- mocha
性能
- 渲染
css+html –> css rules + DOM Tree –> Render Tree –> layout回流 –>point重绘 –> 显示页面 - 回流和重绘
减少DOM操作 使用translate替代top 将频繁重绘元素独立一个图层
安全
- 跨域脚本攻击 xss
标签过滤 转义 - 跨域请求伪造 xsrf
token验证 - 分布式拒绝服务 DDOS
cdn
监控
- 前端日志
原理: (new Image).src =url?ua=${ua}&err=${err}
业务场景
PC端
移动端
细分场景
- 静态页面
- 企业后台
- H5活动
- H5动画
- canvas
- 游戏
- 3D场景
软实力
- 数据结构与算法
- http
- 后端和数据库
- Linux和docker
数据结构与算法
- 冒泡排序
- 选择排序
- 插入排序
- 快速排序
- 希尔排序
- 归并排序
参考:ES6-sort
http
- 报文
报文行 报文头 空行 报文体 - 请求
Host: 服务器域名
User-Agent: 客户端代理
Cookie: 身份验证
Connection: 长连接
If-Modified-Since+If-None-Match: 缓存检测 响应
Last-Modified + ETag 缓存检测
Cache-Control: 缓存规则设置
Server: 服务器名称https
加密传输- http2
多路复用 头部压缩 全双工
后端和数据库
- node
- python
- nginx
- mongodb
insert find update remove - redis
get set hget hset lpush rpop
Linux和docker
- Linux包管理
Ubuntu:apt-get
centos:yum - Linux常用命令
ls cd mdkir touch cp rm - docker常用命令
docker images docker ps docker run docker exec
面试
- 试题积累
- 项目积累
- 思考积累
- 提问
- 获取学习资源
- 总结和前瞻