满满干货|2021年Web前端面试试题（汇总持更中~~~）

题目的答案提供了一个思考的方向,答案不一定正确全面,

Q: 怎么去设计一个组件封装
　　
　　1. 组件封装的目的是为了重用,提高开发效率和代码质量
　　2. 低耦合,单一职责,可复用性,可维护性
　　3. [前端组件化设计思路]
　　
　　Q: js 异步加载的方式
　　
　　1. 渲染引擎遇到 script 标签会停下来,等到执行完脚本,继续向下渲染
　　2. defer 是"渲染完再执行",async 是"下载完就执行",defer 如果有多个脚本,会按照在页面中出现的顺序加载,多个async 脚本不能保证加载顺序
　　3. 加载 es6模块的时候设置 type=module,异步加载不会造成阻塞浏览器,页面渲染完再执行,可以同时加上async属性,异步执行脚本(利用顶层的this等于undefined这个语法点,可以侦测当前代码是否在 ES6 模块之中)
　　
　　Q: css 动画和 js 动画的差异
　　
　　1. 代码复杂度,js 动画代码相对复杂一些
　　2. 动画运行时,对动画的控制程度上,js 能够让动画,暂停,取消,终止,css动画不能添加事件
　　3. 动画性能看,js 动画多了一个js 解析的过程,性能不如 css 动画好
　　
　　Q: XSS 与 CSRF 两种跨站攻击
　　
　　1. xss 跨站脚本攻击,主要是前端层面的,用户在输入层面插入攻击脚本,改变页面的显示,或则窃取网站 cookie,预防方法:不相信用户的所有操作,对用户输入进行一个转义,不允许 js 对 cookie 的读写
　　2. csrf 跨站请求伪造,以你的名义,发送恶意请求,通过 cookie 加参数等形式过滤
　　3. 我们没法彻底杜绝攻击,只能提高攻击门槛
　　
　　Q: 事件委托,目的,功能,写法
　　
　　1. 把一个或者一组元素的事件委托到它的父层或者更外层元素上
　　2. 优点,减少内存消耗,动态绑定事件
　　3. target 是触发事件的最具体的元素,currenttarget是绑定事件的元素(在函数中一般等于this)
　　4. JavaScript 事件委托详解
　　
　　Q: 线程,进程
　　
　　1. 线程是最小的执行单元,进程是最小的资源管理单元
　　2. 一个线程只能属于一个进程,而一个进程可以有多个线程,