优质选题：web前端面试题

1.怎么去设计一个组件封装?

1.1组件封装的目的是为了重用，提高开发效率和代码质量

1.2低耦合，单一职责，可复用性，可维护性

1.3.前端组件化设计思路

2.js 异步加载的方式

2.1.渲染引擎遇到 script 标签会停下来，等到执行完脚本，继续向下渲染

2.2.defer 是“渲染完再执行”，async 是“下载完就执行”，defer 如果有多个脚本，会按照在页面中出现的顺序加载，多个async 脚本不能保证加载顺序

2.3.加载 es6模块的时候设置 type=module，异步加载不会造成阻塞浏览器，页面渲染完再执行，可以同时加上async属性，异步执行脚本(利用顶层的this等于undefined这个语法点，可以侦测当前代码是否在 ES6 模块之中)

3.css 动画和 js 动画的差异

3.1、代码复杂度，js 动画代码相对复杂一些

3.2.动画运行时，对动画的控制程度上，js 能够让动画，暂停，取消，终止，css动画不能添加事件

3.3.动画性能看，js 动画多了一个js 解析的过程，性能不如 css 动画好

4.XSS 与 CSRF 两种跨站攻击

4.1.xss 跨站脚本攻击，主要是前端层面的，用户在输入层面插入攻击脚本，改变页面的显示，或则窃取网站 cookie，预防方法：不相信用户的所有操作，对用户输入进行一个转义，不允许 js 对 cookie 的