前端技术图谱
2021-11-11 17:46:27 47 举报
AI智能生成
前端技术图
作者其他创作
大纲/内容
浏览器
浏览器安全
XSS
存储型
反射型
文档型
防范措施
千万不要信任用户的输入
CSP
HTTPOnly
CSRF
自动发送GET请求
自动发送POST请求
诱导点击发送GET请求
防范措施
Cookie的SameSite属性
验证来源站点
CSRF Token
浏览器缓存
强缓存
不需要发请求
字段
HTTP1.0
Expires
HTTP1.1
Cache Control
协商缓存
Last Modified
Etag
缓存的位置
Serivce Worker
Memory Cache
Disk Cache
Push Cache
浏览器事件机制
浏览器本地存储
Cookie
WebStorage
localStorage
sessionStorage
IndexedDB
V8垃圾回收
跨域问题
算法
贪心
动态规划
回溯
二分
排序
二叉树
位运算
双指针
栈和队列
哈希表
字符串
链表
滑动窗口
Node.js
express
koa
fs
模块化
path
中间件
npm
微信小程序
uniapp
登录的流程
获取用户的微信账号信息
原生微信小程序开发
Vue
Vue基础
Vue的双向绑定
Vue2
Object.defineProperty
Vue3
Proxy
Reflact
MVC,MVVM,MVP的区别
computed和watch的区别
filter的作用
保存当前页面的状态
常见的事件修饰符以及作用
v-if和v-show的区别
为什么data是一个函数不是对象
Vue.nextTick()
Vue.set和Vue.delete
Vue的数组的响应式原理
Vue的响应式渲染
Vue.directive
Vue的单向数据流
VueRouter
懒加载实现
hash和history的区别
$route和$router的区别
VueRouter的路由卫士
路由的跳转
动态路由的定义以及传参
Vuex
Vuex的工作流程图
Vuex的各种属性
action和mutation的区别
Vuex和localStorage的区别
mutation为何不能处理异步事件
批量使用Vuex的getter
重复使用Vuex的mutation
组件
组件间通信
props & $emit
$parent & $children
$atrrs & $listeners
递归子组件
生命周期
生命周期的各个过程以及所做到事
子组件和父组件的生命周期顺序
Diff算法
Diff算法的流程
为什么不能用数组的下标做为key
性能优化
Vue3.0
Compostion API
Vue3的响应式原理
Vue3的ref属性
webpack
webpack的基础架构
webpack的构建流程
常见的Loader
常见的Plugin
Loader和Plugin的区别
自己开发Loader,Plugin
HMR
source map
babel原理
优化webpack的构建速度
计算机网络
HTTP
HTTP报文格式
HTTP的状态码
1XX
2XX
3XX
4XX
HTTP的方法
GET
POST
DELETE
PUT
OPTION
HTTP不同版本的区别
HTTP1.1
HTTP2.0
HTTP优点和缺点
HTTP缓存
HTTPS
HTTP和HTTPS的区别
HTTPS握手过程
TCP/IP
TCP和UDP的区别
TCP报文首部
三次握手
四次挥手
TCP的拥塞控制
TCP流量控制
DNS
根DNS
顶级DNS
权威DNS
域名的IP地址寻找过程
Vite
JavaScript
基本的数据类型
Number
String
Null
Undefined
Symbol
Object
Boolean
BigInt
类型的判断
typeof
instanceof
constructor
Object.prototype.toString.call
作用域
闭包
this
垃圾回收机制
函数
普通函数
箭头函数
call
bind
apply
数组
常见的方法
改变原数组的方法
push
pop
shift
unshift
splice
sort
常用操作
concat
map
filter
reduce
slice
forEach
every
some
indexOf
join
类
原型和原型链
继承
原型链继承
构造函数继承
组合式继承
原型式继承
寄生式继承
寄生组合继承
new
new 中间的过程
手写实现new
class
JavaScript的运行机制
同步代码
异步代码
ES6
var,let,const
rest参数
拓展运算符
数组和对象的解构
模板字符串
异步编程
setTimeout
setInterval
requestAnimationFrame
Promise
async,await
DOM
BOM
CSS
CSS基础
css选择器(按优先级排序)
!important
行内样式
ID选择器
类,伪类和属性选择器
元素和伪元素
继承
通配符
盒模型
标准盒模型
width=内容宽度
height=内容高度
IE盒模型
width=border+padding+内容宽度
height=border+padding+内容高度
动画效果
display
CSS3
布局
布局单位
px
rem,em
%
vh,vw
两栏布局
三栏布局
水平垂直居中
已知宽高
绝对定位+负margin
绝对定位+left+right+top+bottom+margin
flex布局
不定宽高
绝对定位+tranform
flex布局
Flex布局
flex-direction
justify-content
align-items
Grid布局
响应式布局
定位和浮动
清除浮动
添加额外标签,设置其样式clear:both
父级元素添加overflow:hidden,或者设置高度
建立伪元素,设置clear:both
外边距重叠
BFC
实际案例
单行,多行文本溢出处理
实现一个三角形
判断元素是否可视
HTML
行内元素
块级元素
HTML5
script标签的async和defer
跨域请求
同源策略
JSONP
CORS
简单请求
Origin中的源不在允许的范围之内,服务器就返回一个正常的HTTP响应
服务端检测没有Access-Control-Allow-Origin,就知道出错了
服务端检测没有Access-Control-Allow-Origin,就知道出错了
在允许的范围中,服务器就会返回Access-Control-Allow-Origin
他表示接受那些域名的请求
他表示接受那些域名的请求
非简单请求
预检成功
预检失败
Node正向代理
Nginx反向代理
0 条评论
下一页