前端进阶必备知识汇总

503 阅读2分钟

Html:

  1. 语义化
  2. 三栏布局
  3. H5和C3新特性

Css:

  1. 盒模型
  2. 盒子居中方式
  3. 移动端布局响应式布局
  4. 渲染原理
  5. BFC
  6. px,em,rem
  7. em和rem区别
  8. flex布局
  9. 瀑布流布局

JavaScript:

  1. 彻底搞懂你不懂的js基础
  2. 深浅拷贝
  3. 异步编程的实现方式
  4. es5和es6继承的区别
  5. 正则表达式
  6. promise原理
  7. js设计模式
  8. 模块化
  9. typeof和instanceof
  10. 类数组和数组
  11. 函数防抖节流
  12. 数组扁平化
  13. a.x = a = {n:2} 连等赋值

Vue:

  1. 路由钩子,生命周期
  2. vue-router原理
  3. history、哈希(hash)区别和原理
  4. 怎么监听哈希值改变的: hashChange事件
  5. vuex使用场景
  6. vue组件的通讯方式
  7. v-model原理
  8. v-if和v-show区别
  9. MVVM模式
  10. vue和react区别
  11. 动态路由
  12. vuex页面刷新数据没有保留
  13. keep alive与哪个钩子函数有关
  14. vue动态添加属性
  15. 组件封装
  16. template编译
  17. data为什么是方法

同一个组件被复用多次,会创建多个实例。这些实例用的是同一个构造函数,如果data是一个对象的话,那么所有的组件都共享了一个对象。为了保证组件的数据独立性要求每个组件必须通过data函数返回一个对象作为组件的状态。

  1. Virtual Dom和v-node
  2. computed原理和watch区别
  3. eventbus原理
  4. 路由懒加载
  5. v-for为什么要加key
  6. 描述组件渲染和更新过程
  7. vue中事件绑定原理

vue的时间绑定分为两种一种是原生绑定,还有一种是组件事件绑定:

// 原生绑定
<div @click="say">说话</div>
// 组件绑定 @click绑定只能$emit()触发  .native修饰符采用原生绑定的是直接能触发的
<test @click="()=>{}" @click.native="()=>{}"></test>
  • 原生dom时间的绑定,采用的是addEvevtListener实现
  • 组件绑定时间采用的是$on方法
  1. vue中v-html会导致哪些问题
 . 可能会导致xss攻击
 . v-html会替换掉标签每部的子元素
  1. Vue中相同逻辑如何抽离
  2. 什么是作用域插槽
  3. Vue3.0有哪些改进
. Vue3采用Ts编写
. 支持Compostion Api
. 响应数据采用proxy
. vdom得对比算法更新,只更新vdom得绑定了动态数据得部分
  1. vue项目优化

React

  1. ...prop 延展符解读

Es6:

  1. proxy和vue3.0
  2. generator原理
  3. 箭头函数
  4. 装饰器

Webpack:

  1. 反向代理
  2. webpack性能优化
  3. 按需加载原理
  4. webpack打包原理
  5. plugin
  6. gulp区别
  7. 配置多页项目
  8. loader和plugin和简介常用的loader和plugin

http:

  1. 跨域
  2. http介绍http协议缓存
  3. 性能优化
  4. http,https.http2区别
  5. 对称加密和非对称加密
  6. 浏览器渲染机制
  7. tcp

安全:

  1. xss和csrf

项目开发中遇到的问题:

一 移动端:

  1. 移动端1像素边框问题

  2. 300毫秒延迟

  3. 安卓机 input/textarea输入键盘遮盖输入框

  4. 微信H5页面兼容性解决方案

    未完待续...