（1）input 中如何监听值的变化？
Answer：因为input的onchange事件是要改变值之后失去焦点才触发，并不能实现实时监听，所以存在3种情况，第一种是只需要失去焦点时监听，那就用onchange，第二种是js改变值，这时候可以在改变值的方法里手动触发，第三种则是实时监听，可以用keypress、keydown、keyup等事件监听。
（2）什么是事件冒泡和事件捕获，区别是什么？
Answer：事件冒泡是子元素向父元素传递事件，而事件捕获是父元素向子元素传递事件（ps.事件代理/事件委托：直接在父元素写事件，可以避免遍历子节点的操作，优化性能），事件触发的顺序是相反的。阻止：event.stopPropagation();
（3）什么是跨域，如何处理跨域？
Answer：一个域下的文档或脚本试图去请求另一个域下的资源。（协议，域名，端口，三者有一不一样，就是跨域）。
解决方法：1.jsonp（动态创建srcipt标签请求静态资源服务器的资源，缺点是只能实现get请求）；2.document.domain + iframe跨域（仅限主域相同，子域不同的跨域应用场景。实现原理：两个页面都通过js强制设置document.domain为基础主域，实现同域）；3.location.hash + iframe（a欲与b跨域相互通信，通过中间页c来实现。 三个页面，不同域之间利用iframe的location.hash传值，相同域之间直接js访问来通信。）；4.window.name + iframe跨域（name值在不同的页面、甚至不同域名加载后依旧存在，并且可以支持非常长的 name 值（2MB））；5.postMessage跨域（postMessage是HTML5 XMLHttpRequest Level 2中的API，postMessage(data,origin)方法接受两个参数，data最好为字符串，origin是协议+主机+端口号，也可以设置为"*"，表示可以传递给任意窗口，如果要指定和当前窗口同源的话设置为"/"）；6.跨域资源共享（CORS）（普通跨域请求：只服务端设置Access-Control-Allow-Origin即可，前端无须设置，若要带cookie请求：前后端都需要设置。）；6.nginx代理跨域；7.nodejs中间件代理跨域；8.WebSocket协议跨域。
（4）什么是节流与防抖，如何实现
Answer：前端中存在的一种因为用户行为会频繁触发的事件，因为对DOM的操作、资源加载等耗费性能的处理，容易导致页面卡顿甚至浏览器崩溃。为了解决这类需求，产生了函数节流与防抖。节流就是预定一个函数，只有在大于等于执行周期时才执行，周期内调用不执行（比如窗口调整，页面滚动，抢购疯狂点击）。防抖就是函数需要频繁触发时，只有足够空闲才会执行一次（比如实时搜索，拖拽）。
（5）网站的性能优化
Answer：1、减少http访问请求，合并css，js和图片（精灵图）等提高访问性能。2、静态资源使用浏览器缓存。3、压缩文件减少传输数据量。4、减少cookie传播，不必要的数据则不要写入cookie。5、使用CDN（内容分发网络）加速（他可以将数据缓存到距离用户最近的位置，用户可以尽快获取数据，数据中心也可以减轻压力，从而提高访问速度）。6、使用代理服务器，在代理服务器上缓存部分热点信息，用户可以直接从代理服务器获取数据，从而加快web访问速度；另外，使用反向代理可以实现负载均衡，提高系统整体处理能力，提高高并发网站的性能【反向代理：用户不知道从哪来的数据，但是服务正常提供。正向代理：用户托一个服务器帮忙发送请求给真正要请求的服务器】。7、代码优化（多线程，资源复用，垃圾回收……好像是后端的，前端就代码简化，去掉无用代码，逻辑循环清晰等等吧）。
（6）浏览器缓存原理
Answer：发起请求的过程是：发起网络请求->后端处理->浏览器响应，而浏览器缓存则可以直接使用缓存不发起请求，或者发起请求后后端存储的数据和前端一致，则不必再把数据回传，减少响应数据。那么浏览器如何确定是否该缓存某个资源呢？它发起请求并拿到请求结果后，将请求结果和缓存标识存入浏览器缓存（浏览器对于缓存的处理是根据第一次请求资源时返回的响应头来确定的），然后每次发起请求都会先去浏览器缓存中查找该请求的结果和缓存表示。在强缓存中可以设置HTTP Header的Expires和Cacht-Control规定缓存过期时间和命中强缓存时间。而协商缓存就是浏览器拿着缓存标识去请求服务端，服务端决定要不要用缓存。
PS：缓存机制：强制缓存优先于协商缓存进行，若强制缓存(Expires和Cache-Control)生效则直接使用缓存，若不生效则进行协商缓存(Last-Modified / If-Modified-Since和Etag / If-None-Match)，协商缓存由服务器决定是否使用缓存，若协商缓存失效，那么代表该请求的缓存失效，返回200，重新返回资源和缓存标识，再存入浏览器缓存中；生效则返回304，继续使用缓存。如果啥缓存机制都没设置，那么浏览器会采用一个启发式的算法，通常会取响应头中的 Date 减去 Last-Modified 值的 10% 作为缓存时间。
（7）当输入 URL 时，整个过程是什么样的
Answer：
- 域名解析（为了将消息从你的PC上传到服务器上，需要用到1P协议、ARP协议和0SPF协议）
- 发起TCP的3次握手
- 建立TCP连接后发起http请求
- 服务器响应http请求
- 浏览器解析htm代码,并请求html代码中的资源(如js、css、图片等）
- 断开TCP连接
- 浏览器对页面进行渲染
（8）React 的生命周期
Answer：
componentWillMount// 服务端渲染时调用，在整个生命周期中只会调用一次.
componentDidMount// 初始化：组件第一次渲染完成，dom节点已生成。可以在这里请求ajax返回数据setState后，组件会重新渲染。整个生命周期中只会调用一次.
componentWillUnmount// 组件销毁后调用，多用于清理内存空间.
componentWillReceiveProps(newProps)// 当从父类接收到新的 props 前调用,newProps就是父级最新传入的数据,对比this.props 和 nextProps 将nextProps的state改为当前的state，页面可以重新渲染.
shouldComponentUpdate// 组件接受到新属性、新状态调用.返回true则组件正常运行,返回false则阻止render调用，后面的函数不会被继续执行。必须return.
componentWillUpdate(newProps, nextState, newContext) // 组件更新前调用.shouldComponentUpdate返回true后，组件进入重新渲染的进程,此时进入componentWillUpdate中，也可以同样拿到nextProps和nextState.
componentDidUpdate(prevProps, prevState, Snapshot)// 组件更新后调用.在这里可以拿到prevProps和prevState，也就是更新前的props和state.
render() // 渲染组件
（9）React 中的 setState
Answer：state的更新可能是异步的，因此如果要同步更新，可以添加回调函数。
（10）React 中函数组件和普通组件有什么区别
Answer：函数组件是个纯函数，接受一个props对象，返回一个react元素，没有生命周期和状态state（所以也叫无状态组件）；而类组件需要继承React.Component并且创建render函数返回react元素，有生命周期和状态state。
（11）什么是 render prop 的组件
Answer：render prop是React组件之间使用一个值为函数的prop在组件中共享代码的简单技术。他与高阶组件一样，都是React组件的一种设计模式，用于方法重用，因此更多用于容器型组件，渲染逻辑由调用者决定。
（12）fiber 是什么
Answer：React Fiber是对核心算法的一次重新实现。破解JavaScript中同步操作时间过长的方法：分片。React Fiber把更新过程碎片化，每执行完一段更新过程，就把控制权交还给React负责任务协调的模块，看看有没有其他紧急任务要做，如果没有就继续去更新，如果有紧急任务，那就去做紧急任务。维护每一个分片的数据结构，就是Fiber。
（13）关于模块分包
Answer：分包原则：按复用度，抽象度，稳定度分包。 webpack.config.js中添加配置
（14）有没有接触过 node，你认为 node 怎么样
Answer：没接触过。
（15）node 引入一个模块的过程是什么
Answer：
（16）https 有什么用，原理是什么
Answer：https是在http上建立ssl加密层，并对数据传输进行加密，是http协议的安全版。它的主要作用是对数据进行加密，并建立一个信息安全通道，保证传输过程中的数据安全，以及对网站服务器进行真实身份认证。HTTPS并不是一种新的协议，在通信接口使用了SSL和TLS协议而已。HTTP通常直接和TCP通信，而HTTPS中HTTP先和SSL通信，再由SSL和TCP进行通信。（SSL协议并不是一个应用层协议，它是介于应用层和传输层协议之间的一个安全协议，https采用了它的两种加密方式的混合加密）
（17）https 如何保证证书是可信任的
Answer：在菜单选项中查看证书功能。这信息可能是在页面信息中的文件属性或安全选项中。
（18）amd 和 cmd 的区别，commonjs，esmodule
Answer：
（19）什么是函数柯力化
Answer：
（20）virtual DOM 是什么以及是如何实现的
Answer：
（21）dom diff 是什么
Answer：
（22）get 和 post 请求
Answer：
（23）如何进行 CI 以及测试的，是否使用 ESLint
Answer：
（24）Accept 头部的作用什么，如果服务器不支持怎么办
Answer：
三面大部分都是一些主观问题：
才工作一年为什么就想着换工作
你遇到过什么有挑战的事情吗 (这个一定得想好呀，没有也得憋出来一个)
你对未来的工作有什么样的期待