8月前端面试题“出炉啦”，赶紧更新一波
发布时间：2018-08-24 22:00分享、转发、收藏，与身边的小伙伴一起学习
面试题分为两类，一种是基础试题: 主要考察前端技基础是否扎实，是否能够将前端知识体系串联。一种是开放式问题: 考察业务积累，是否有自己的思考，思考问题的方式，这类问题没有标准答案。
题目的答案提供了一个思考的方向，答案不一定正确全面，有错误的地方欢迎大家请在评论中指出，共同进步。
怎么去设计一个组件封装
组件封装的目的是为了重用，提高开发效率和代码质量
低耦合，单一职责，可复用性，可维护性
前端组件化设计思路
渲染引擎遇到 script 标签会停下来，等到执行完脚本，继续向下渲染
defer 是“渲染完再执行”，async 是“下载完就执行”，defer 如果有多个脚本，会按照在页面中出现的顺序加载，多个async 脚本不能保证加载顺序
加载 es6模块的时候设置 type=module，异步加载不会造成阻塞浏览器，页面渲染完再执行，可以同时加上async属性，异步执行脚本（利用顶层的this等于undefined这个语法点，可以侦测当前代码是否在 ES6 模块之中）
css 动画和 js 动画的差异
代码复杂度，js 动画代码相对复杂一些
动画运行时，对动画的控制程度上，js 能够让动画，暂停，取消，终止，css动画不能添加事件
动画性能看，js 动画多了一个js 解析的过程，性能不如 css 动画好
XSS 与 CSRF 两种跨站攻击
xss 跨站脚本攻击，主要是前端层面的，用户在输入层面插入攻击脚本，改变页面的显示，或则窃取网站 cookie，预防方法：不相信用户的所有操作，对用户输入进行一个转义，不允许 js 对 cookie 的读写
csrf 跨站请求伪造，以你的名义，发送恶意请求，通过 cookie 加参数等形式过滤
我们没法彻底杜绝攻击，只能提高攻击门槛
事件委托，目的，功能，写法
把一个或者一组元素的事件委托到它的父层或者更外层元素上
优点，减少内存消耗，动态绑定事件
target 是触发事件的最具体的元素，currenttarget是绑定事件的元素(在函数中一般等于this)
JavaScript 事件委托详解
线程，进程
线程是最小的执行单元，进程是最小的资源管理单元
一个线程只能属于一个进程，而一个进程可以有多个线程，但至少有一个线程
负载均衡
当系统面临大量用户访问，负载过高的时候，通常会使用增加服务器数量来进行横向扩展，使用集群和负载均衡提高整个系统的处理能力
服务器集群负载均衡原理？
什么是CDN缓存
CDN 是一种部署策略，根据不同的地区部署类似nginx 这种服务服务，会缓存静态资源。前端在项目优化的时候，习惯在讲台资源上加上一个 hash 值，每次更新的时候去改变这个 hash，hash 值变化的时候，服务会去重新取资源
(CDN)是一个经策略性部署的整体系统，包括分布式存储、负载均衡、网络请求的重定向和内容管理4个要件
CDN_百度百科
Node 事件循环，js 事件循环差异
Node.js 的事件循环分为6个阶段
浏览器和Node 环境下，microtask 任务队列的执行时机不同
Node.js中，microtask 在事件循环的各个阶段之间执行
浏览器端，microtask 在事件循环的 macrotask 执行完之后执行
递归的调用process.nextTick()会导致I/O starving，官方推荐使用setImmediate()
浅拷贝和深拷贝的问题
深拷贝和浅拷贝是只针对Object和Array这样的复杂类型的
也就是说a和b指向了同一块内存，所以修改其中任意的值，另一个值都会随之变化，这就是浅拷贝
浅拷贝， ”Object.assign() 方法用于将所有可枚举的属性的值从一个或多个源对象复制到目标对象。它将返回目标对象
深拷贝，JSON.parse()和JSON.stringify()给了我们一个基本的解决办法。但是函数不能被正确处理
开放性问题
开放性问题主要是考察候选人业务积累，是否有自己的思考，思考问题的方式，没有标准答案。不过有些问题挺刁的，哈哈哈哈，比如：" 你见过的最好的代码是什么？ "总之提前准备下没错。先自我介绍一下，说一下项目的技术栈，以及项目中遇到的一些问题
从整体中，看你对项目的认识，框架的认识和自己思考
项目中有没有遇到什么难点，怎么解决
如果你在创业公司你怎么从0开始做（选择什么框架，选择什么构建工具）
说一下你项目中用到的技术栈，以及觉得得意和出色的点，以及让你头疼的点，怎么解决的
一个业务场景，面对产品不断迭代，以及需求的变动该怎么应对，具体技术方案实现
你的学习来源是什么
你觉得哪个框架比较好，好在哪里
你觉得最难得技术难点是什么
你见过的最好的代码是什么