前端知识体系

· ☕ 2 min read · 👀... views
🏷️
  • #system

    • es5 知识点
      • 原始类型 //值
        • boolean
        • undefined
        • null
        • number
        • string
        • symbol ?
      • 对象类型 object //内存地址(指针)<–> 值
      • typeof null // ‘object’ is bug
      • 0.1+0.2=0.30000000000000004 // number 浮点类型
      • typeof 判断原始类型
      • instanceof 判断对象类型
      • 类型转换
      • this指向
        • 函数直接调用 指向window
        • 对象 谁调用指向谁
        • new 指向实例
        • bind/箭头函数 多次调用,this指向取决于第一次调用上下文
      • == vs === //==涉及类型转换
      • 闭包 存在的意义就是可以访问外部函数的变量
      • 对象拷贝
        • 浅拷贝 object.assign() / 展开运算符 … //拷贝属性值,属性中有对象的话,拷贝的是地址
        • 深拷贝 lodash.cloneDeep() //自己实现一个
      • 原型 //重点
        • Object
        • Function
        • proto
      • 函数提升优先于变量提升
    • es6知识点
      • let,const 暂时性死区
      • 继承
        • 原型
        • class
      • 模块化
        • commonjs 服务器端/同步/值拷贝
        • es module 浏览器端/异步/地址拷贝
      • proxy
        • 数据响应式
      • map,filter,reduce
    • js进阶
      • 回调函数 callback
      • generator
      • promise 实现
      • async/await
      • requestAnimationFrame
      • call , apply , bind , new 实现
      • 垃圾回收机制
    • event loop
      • 执行栈 call stack 先进后出 同步执行的js代码
      • 任务队列 task queue 异步执行的js代码
        • 宏任务 macro task //setTimeout , setInterval , xhr …
        • 微任务 micro task // promise , mutation observer …
      • 浏览器
      • node
    • 浏览器
      • 事件机制
        • 注册
        • 触发
        • 代理
      • 跨域
        • 同源策略
        • 解决方案
          • jsonp
          • cors
          • document.domain
          • postMessage
      • 存储
        • cookie
        • localStorage
        • sessionStorage
        • service worker
      • 缓存机制
        • 缓存位置
        • 强缓存
        • 协商缓存
      • 渲染原理
      • 从url到页面渲染的整个流程
    • 安全
      • xss
      • csrf
    • 性能优化
      • chrome
        • audits
          • 性能分析报告
        • performance
          • 分析性能瓶颈
          • 每个阶段耗费时间
        • v8 js解释性语言首先会被解析成抽象语法树(AST),然后通过解释器转换成字节码(很多逻辑判断),或者通过编译器转换成机器码。
          • 优化策略
            • 减少代码文件大小
            • 减少嵌套函数
            • 传入参数类型保持一致,会直接编译成机器码
      • js
        • 图片优化
          • 减少像素点和每个像素点能够显示的颜色
          • css代替
          • 雪碧图
          • base64格式
        • 节流 在一段时间内只发生一次事件
        • 防抖 在一段事件内只执行最后一次事件
        • 预加载
        • 预渲染
        • 懒计算
        • 懒加载
        • cdn
      • webpack //自己实现一个
        • 减少打包时间
          • 优化loader
          • happypack 将loader同步执行转换成并行
        • 减少包大小
          • 按需加载
          • tree shaking
    • js框架
      • 基础
        • mvvm
        • virtual dom
        • 路由
      • react
      • vue
      • angular
    • 监控
      • 行为
      • 性能
      • 异常
    • http
      • 请求方法
      • 首部
        • 通用
        • 请求
        • 响应
        • 实体
      • 状态码
      • tsl
        • 加密
          • 对称
          • 非对称
        • 3次握手
          • udp
          • tcp
      • http2
    • css
    • 编译
      • jit编译,动态编译,在浏览器中进行代码编译
      • aot编译,静态编译,在项目工程打包阶段编译
    ·End·

    Rudy
    WRITTEN BY
    Rudy