前端需要掌握的技术栈

前端中高级工程师必备技能

5个你可能不知道的CSS属性

css3鲜为人知的属性

实用小工具：js-doc 用于生成文档 传送门

类似的： jsdoc-toolkit

vscode 辅助生成注释 koroFileHeader

什么情况使用？

对于任何包含响应式数据的复杂逻辑，你都应该使用计算属性

当需要在数据变化时执行异步或开销较大的操作时，使用watch

什么情况使用？

v-if 有更高的切换开销，而 v-show 有更高的初始渲染开销。因此，如果需要非常频繁地切换，则使用 v-show 较好；如果在运行时条件很少改变，则使用 v-if 较好

当 v-if 与 v-for 一起使用时，v-if 具有比 v-for 更高的优先级

修饰符

阻止单击事件继续传播

<a @click.stop="doThis"></a>
           

提交事件不再重载页面

<form @submit.prevent="onSubmit"></form>
           

修饰符可以串联

<a @click.stop.prevent="doThat"></a>
           

只有修饰符

<form @submit.prevent></form>
           

添加事件监听器时使用事件捕获模式

即内部元素触发的事件先在此处理，然后才交由内部元素进行处理

<div @click.capture="doThis">...</div>
           

只当在 event.target 是当前元素自身时触发处理函数

即事件不是从内部元素触发的

<div @click.self="doThat">...</div>
           

注意

使用修饰符时，顺序很重要；相应的代码会以同样的顺序产生。因此，用 v-on:click.prevent.self 会阻止所有的点击，而 v-on:click.self.prevent 只会阻止对元素自身的点击。

点击事件将只会触发一次

<a @click.once="doThis"></a>
           

v-model.lazy v-model.number v-model.trim

vue 双向数据绑定实现原理

vue3 之前 通过遍历data数据 通过 Object.defineProperty 重定义getter setter方法实现数据劫持，已达到响应式的目的

vue3会使用带有 getter 和 setter 的处理程序遍历其所有 property 并将其转换为 Proxy

注意

Proxy 是一个包含另一个对象或函数并允许你对其进行拦截的对象

卡槽slot，生命周期，getter, setter,nexttrick

vue router

hash 模式，history模式，meta参数，keep-alive，路由传值params和query的区别,redirct(重定向)

vuex

state， action， mutation，数据流

inject、provide

mixin混入

eventbus

vue axios 、axios 拦截器

es6 箭头函数（this指向），解构赋值 ，异步（promise–then、catch、all、finally；async–awit），设计模式，模块化，let 和 var 区别（作用域，变量提升）、pubsub

Object.assign({}, item, ob); 解决vue双向数据绑定对对象属性的新增和删除不能及时响应的问题

Set 实现数组去重

filter 实现数组 arry.filter(item => item); 筛选

组件：组件间传值 r e f 、 ref、 ref、parent、 $emit，

css预处理器：stylus，less，sass

目前react + styled-components（我觉得vue程序员来说， 上面三种选一种就可以了）

打包工具：grunt，webpack

typeScript ：js超集

react

mpvue 小程序

ionic 混合开发

uni-app、flutter 跨平台App开发

vant + antd + element = vue UI库

svg(path,stroke, clip-path,mask,refs,use,滤镜，transform),canvas,css3

rxjs

rxjs 集成到 vue

node（koa） + nuxt + vue

无障碍阅读

quartz/corn

jsDoc

WebAssembly

js变量提升和闭包

js基本数据类型、apply和call的区别、es5实现继承

观察者模式和发布订阅模式有什么区别

websocket 前端 + 服务端实现