前端知识图谱
2024-01-03 15:23:58 0 举报
AI智能生成
登录查看完整内容
为你推荐
查看更多
前端知识图谱,前端技术体系
作者其他创作
大纲/内容
VS Code
Webstorm
......
开发工具
Chrome Dev Tools
Firebug
调试工具
PS
切图
工具
基础标签
媒体标签
SVG
Canvas
图形标签
常用的语义标签(元素)
语法规范
DOM
HTML
CSS样式规则
行内
内嵌
链入
导入
引入
标记选择器
类选择器
id选择器
通配符:*、[]
基础选择器
核心基础
样式属性
文本样式
理解“流” - CSS 的设计核心
基础的图文样式
inline、block、inline-block
盒子模型
margin 相关
float 相关
flex 布局
gird 布局
float属性不为none
overflow不为visible(可以是hidden、scroll、auto)
position为absolute或fixed
display为inline-block、table-cell、table-caption
定义
清除内部浮动
垂直margin合并
创建自适应两栏布局
作用
BFC
布局
position:relative、absolute、fixed
z-index:正负值、值越大越底
定位上下文
定位
关于 viewport
rem(根元素html的font-size)、em(相对于父元素font-size)
vw、vh、%
响应式
渐变
动画
新特性
字体 iconfont
模块化
交互
Sass、Less、Scss
CSS
在ES5 中,变量声明有两种方式,分别是 var 和 function ,var 用于声明普通的变量,接收任意类型,function用于声明函数。(变量提升)
ES6 新增了 let、const、import 和 class 等四个命令,分别用以声明 普通变量、静态变量、模块 和 类 。
变量作用域(全局、局部):变量提升(先声明后赋值、后声明)
变量声明
String、Number、Boolean、Null、Undefined 和 Object 等。其中,Object 是引用类型,其他的都是原始类型(Primitive Type)。
ES6 新增了 Symbol 类型
数据类型
普通函数:直接调用时就是普通函数
构造函数:通过new创建对象时就是构造函数
对象方法:通过对象调用时就是方法内置函数
内置函数
函数
if else
for、for in、for of、while
switch case
控制语句
事件
内置对象
Array
Map 和 Set
基础语法
原型链
数据类型的安全检测:typeof、instanceof
构造函数的安全作用域
函数的重写
变量接收自执行函数
惰性载入函数(表示函数执行的分支仅会发生一次)
函数绑定
函数柯里化
高级函数
自由变量
闭包
this
作用域
JS源生请求方式:XMLHttpRequest
Fetch
浏览器同源策略
模版引擎
跨域解决方案:JSONP、proxy(cors)
promise
async/await:async函数、await使用
宏任务和微任务
event loop 模型
cookie、session、token
异步ajax
正则表达式
class 和继承
异常处理
ES6 Module(可对比 AMD、CMD、CommonJS)
DOM 结构
DOM 操作及性能考虑
事件特性及使用
冒泡模型
事件代理(委托)
window
location(获取 url)
navigator(获取 UA)
history(前端路由)
screen
BOM
localStorage
sessionStorage
indexedDB
存储
JS
概念
数据交互格式:XML、JSON
服务端编程
JS&JQ插件
变量类型
函数参数类型
函数返回值类型
类型
自定义类型
接口
泛型
枚举
函数重载
命名空间
Typescript
基础知识
HTTP1.0/1.1/2.0/3.0
HTTPS
UDP
WebSocket
通讯协议
RESTFul
RPC
GraphQL
API风格
网络通信
首次绘制(FP)
首次内容绘制(FCP)
首次有效绘制(FMP)
每秒传输帧数(FPS)
用户可交互时间
DNS解析时间
TCP连接时间
HTTP请求响应时间
性能指标
Page Speed
WebPagetest
PhantomJS
Lighthouse
JSPerf
Chrome dev tools
评估工具
性能
XSS
CSRF
CSP
Same-origin Policy
安全
IE6/7/8/9/10/11 (Trident) / Edge (EdgeHTML)
Firefox (Gecko)
Chrome/Chromium (Blink)
Safari (WebKit)
Opera (Blink)
浏览器
CDN
独立组件
代码调优
性能调优
页面响应速度、页面反馈速
调优
进阶
D3
Raphaël
Snap
Echarts
HighCharts
Canvas 2D
Three
WebGL
可视化
React Native
Weex
Flutter
jQuery Mobile
Zepto
移动Web
Vuex
Vue-router
Vue-cli
Element UI
Vue
Redux
React-router
create-react-app
Ant design
React
Angular
Ember
Knockout
Backbone
开发库/框架
Bootstarp
ElementUI
Vux
Mint UI
MUI
UI框架
jQuery
Bootstrap
Prototype
Underscore
Lodash
RxJS
moment
工具库
组件及框架
冯诺依曼结构
二进制
算术运算和逻辑运算
各级存储器的区别
计算机组成原理
进程和线程
CPU 调度算法
内存管理
文件系统和 IO
操作系统
寄存器和内存模型
堆栈模型
CPU 指令
汇编语言
编译器流程
AST
词法
文法
V8
编译原理
TCP/IP 协议
DNS
HTTP/HTTPS
计算机网络
ASCII 码
unicode 字符集
UTF-8 / UTF-16
编码
计算机基础
结构化与非结构化
栈(逻辑结构)可用数组、链表(代码)表示
队列(逻辑结构)可用数组(代码)表示
树(逻辑结构)可用对象(代码)表示
逻辑结构与代码表现
向量
堆(Heap)
栈(Stack)
队列(Queue)
链表(Linked List)
数组(Array)
集合(Set)
哈希表(Map)
线性结构
普通树
二叉树
AVL 树
红黑树
B 树
搜索树
树(Tree)
数据结构
复杂度
二分
贪心
动态规划
算法思想
递归思想(爆栈)
线性搜索
二分查找
索引
深度优先搜索(DFS)
广度优先搜索(BFS)
查找
冒泡排序
选择排序
插入排序
快速排序
希尔排序
归并排序
堆排序
计数排序
基数排序
排序
新增、删除
遍历
新增删除(平衡树)
树
搜索
最短路径
图
KMP 算法
前缀匹配
字符串
常用算法
Diff
算法
单例模式
原型模式
工厂模式
抽象工厂模式
建造者模式
创建型
适配器模式
装饰器模式
代理模式
外观模式
桥接模式
组合模式
享元模式
结构型
观察者模式
迭代器模式
策略模式
模板方法模式
职责链模式
命令模式
备忘录模式
状态模式
访问者模式
中介者模式
解释器模式
行为型
设计模式
类和对象
三要素(继承、封装、多态)
UML 类图
面向对象(OOP)
面向切面编程(AOP)
纯函数
curry
compose
函数式编程(FP)
响应式编程
编程模式
自顶向下
逐步求精
限制使用goto
结构化程序
单一职责原则(S)
开放关闭原则(O)
里氏替换原则(L)
接口隔离原则(I)
依赖反转原则(D)
面向对象程序
程序设计
MVC
MVP
MVVM
架构模式
SSR
大前端
微服务
Serverless
WebAssembly
Less code/No code
Express
Koa
Egg
Node
C/C++/Java/PHP/Ruby/Python/...
编程语言
Nginx
Apache
Tomcat
网页服务器
MySQL
Oracle
SQL Server
PostgreSQL
DB2
SQL
MongoDB
CouchDB
Hbase
NoSQL
数据库
Redis
Memcached
数据缓存
后端知识
CSS Module
ES6 Module
CommonJS
SeaJS/CMD
RequireJS/AMD
Gitlab
Github
Git
TortoiseSVN
Svn
版本管理
npm
Yarn
Lerna
依赖管理
less
Sass(Scss)
Stylus
Post css
TypeScript
CoffeeScipt
Flow
JavaScript
语言增强
Webpack
Gulp
Grunt
Rollup
构建工具
Babel
Traceur
转换器
Git web hook
Jenkins
CI/CD
JSLint/JSHint/TSLint/ESLint
StyleLint
Sonar
质量检测
Chai/Expect/Should
Unit/Mocha/QUnit/Jasmine/Jest
Karma
Sinon
Istanbul
单元测试
Nightwatch
Cypress
E2E测试
代码质量
工程开发
其他
前端知识图谱
0 条评论
回复 删除
下一页