经纬恒润前端面经帖复习Ⅰ（2648字预警）

编者按：
以下面经题目来自牛客网其他作者，已注明原帖来源。
（原帖作者若不允许搬运，可私聊我进行删除处理）
答案由本人整理，不确保完全正确，有异议可评论区指出，感恩的心 

一、原帖：经纬恒润前端一面

①原型式继承

②构造函数继承

③组合继承（①+②）

④原型式继承

⑤寄生式继承

⑥寄生组合式继承（②+④+⑤）

①父子组件传参 props/$emit

②依赖注入 provide/inject

③父子组件 $parent / $children 与 ref

④跨级通信 $attrs/$listeners

⑤事件总栈 eventBus $emit/$on

⑥vuex

①vuex的存储是响应式的，当组件vue中store更改，其他相关的组件也会得到快速更新，是由统一的方法修改数据，全局变量可以任意修改，不是很安全
②全局变量多了可能会造成命名污染，但是vuex不会，每个组件可以根据自己vuex的变量名引用不受影响
③vuex适用于嵌套关系复杂的项目，针对于demo或者小项目，全局变量就够用了

vue采用数据劫持结合发布者-订阅者模式，通过Object.defineProperty()来劫持各个属性的getter、setter，在数据变动时发布消息给订阅者，触发相应的监听回调。

①构建DOM树和CSSOM树    ②构建渲染树    ③回流和重绘

后端、产品、测试、设计…

2、项目开发流程了解吗

（个人总结哈

①项目立项    ②需求分析    ③产品设计    ④开发    ⑤测试    ⑥联调    ⑦交付验收    ⑧维护升级

3、前后端怎么交互？怎么传递消息

前端发送请求，后端接收请求进行对数据库的操作，返回前端所需要的数据？

前后端交互方法：①服务端渲染    ②Ajax ③JSONP    ④cookie    ⑤WebSocket …

4、前端响应性能有什么指标要求吗？（我感觉想问测试方面的）

①FPS 画面每秒传输帧数，即动画或视频每秒切换的图片张数，帧数越大，流畅度越高

②页面加载/切换时间（研究表明：用户最满意的打开网页时间是2-5秒，如果等待超过10秒，99%的用户会关闭这个网页。）

③内存占用情况，对系统内存的占用越高，对系统消耗越高

④白屏时间、首屏时间、用户可交互时间、总下载时间、DNS解析时间、TCP连接时间、HTTP请求时间、HTTP响应时间等

5、接触过后端开发或者桌面程序开发吗？

面向对象就是把数据和数据的操作方法放在一起，作为一个相互依存的整体——对象。

面向对象有三大特性：封装、继承、多态

7、抽象类和接口的区别

抽象类：被abstract关键字修饰，只有方法的声明，没有方法体，不能被实例化，只能被用作子类的超类

接口：使用interface关键字修饰，接口是抽象方法的集合，如果一个类实现了某个接口，那么它就继承了这个接口的抽象方法

8、代码管理

Git / SVN

区别：①SVN是集中式版本控制系统，Git是分布式版本控制系统；②SVN是按照原始文件存储的，体积较大，Git是按照元数据方式存储的，体积很小；③Git的分支操作不会影响其他开发人员，而SVN会影响。

9、前端开发需要具备什么能力和素质？

硬实力+软实力

技术能力、理解能力、学习能力、沟通能力……

10、期望薪资

（尽情的夸自己吧

vue路由钩子分为三种：全局守卫、单个路由独享守卫、组件内守卫。
①全局守卫：beforeEach 路由进入之前、afterEach 路由进入之后
②单个路由独享守卫：beforeEnter 路由进入之前
③组件内守卫：beforeRouteEnter 路由进入之前、beforeRouteUpdate 路由更新之前、beforeRouteLeave 路由离开之前

2、组件间通信

vue2生命周期：beforeCreate、created、beforeMount、mounted、beforeUpdate、updated、beforeDestory、destoryed
vue3生命周期：setup、onBeforeMount、onMounted、onBeforeUpdate、onUpdated、onBeforeUnmount、onUnmounted

4、http和https区别

①端口：http的端口是80，https的端口是443
②传输数据：http是明文传输，https是用ssl进行加密的
③安全性：https更具有安全性
④申请证书：https传输需要申请证书（要钱），http不需要

5、js中的异步操作

①回调函数

②事件监听

③发布/订阅

④定时器setTimeout()/setInterval()

⑤Ajax请求

⑥promise

⑦generator

⑧async/await

⑨…（欢迎补充

6、webpack用过吗 说一下

webpack是一个用于JavaScript应用程序的静态模块打包工具

五大核心概念：①entry（入口）；②output（输出）；③loader（加载器）；④plugins（插件）；⑤mode（模式）

7、js中什么会造成内存泄 露

①意外的全局变量；②闭包；③定时器；④事件监听；⑤元素引用；⑥console.log; ⑦……

8、你觉得你为什么能胜任这个岗位

（全方位夸自己

9、做什么事情会很有成就感

（千万不要说对方公司没有工作地的地点🈲

四、原帖：经纬恒润前端一面

1、为什么做前端

（体现出自己对前端的热爱

2、介绍具体项目中遇到的问题

（遇到了什么样的问题，自己是如何解决的，最终达成了什么样的效果，在这个过程中收获了什么…

3、axios 的特点，和 AJAX 的区别

axios 的特点：

①axios是基于Promise的ajax请求库，支持Promise API，在浏览器端或者node.js环境都可以使用；
②支持请求和相应拦截器，支持请求取消，可以转换请求数据和响应数据，对响应得到的内容自动转成json格式的数据；
③支持批量发送多个请求axios.all和axios.spread…

axios和ajax的区别：

①axios是一个基于Promise的HTTP库，ajax是对原生XHR的封装；

②ajax技术实现了局部数据的刷新，axios实现了对ajax的封装;

③axios返回的数据是promise，ajax返回的数据是回调；

④axios比ajax更安全…

跨组件共享数据、跨页面共享数据、多个地方需要修改同一数据…构建中大型单页面应用时，何更好地在组件外部管理状态

7、vue 为什么要采用异步渲染

vue是组件级更新，如果不采用异步更新，那么每次更新数据都会对当前组件进行重新渲染，所以为了保证性能，vue 会在本轮数据更新后，在异步更新视图。

异步渲染核心思想是 nextTick ：dep.notify() 通知 watcher 进行更新，subs[i].update 依次调用 watcher 的 update ， queueWatcher 将 watcher 去重放入队列， nextTick（ flushSchedulerQueue ）在下一 tick 中刷新 watcher 队列（异步）。

console.log(1<2<3) // true
console.log(3<2<1) // true
console.log(3>2>1) // false
console.log(1>2>3) // false

先比较前两个，得true（1）或false（0），再与第三个比较得结果

函数式编程：以函数思维做为核心，在这种思维的角度去思考问题。这种编程最重要的基础是λ演算，接受函数当作输入和输出。
面向对象编程：把问题看作由对象的属性与对象的行为组成。基于对象的概念，以类作为对象的模板，把类和继承作为构造机制，以对象为中心，来思考并解决问题。

在vue中，可以借助EventBus、vuex，也可借助浏览器缓存localstorage、sessionstorage等

5、深拷贝和浅拷贝

浅拷贝只拷贝对象的引用值，当值发生改变时，两者都会变

方法：①Object.assign() ②扩展运算符 ③Array.concat() ④Array.slice()

深拷贝开辟了新的内存空间，拷贝的对象不会影响原对象

方法：①_.cloneDeep() ②JSON.parse(JSON.stringify()) ③手写递归方法

6、怎么快速实现深拷贝，浅拷贝？

（如上，除了自己手写都挺快的

个人笔面记录汇总：zkey秋招之旅 前端笔面汇总-附时间线

参见专栏：zkey秋招之旅

（持续更新，欢迎订阅~