引言：先说说个人的一个基本情况吧：毕业于2021年6月，2021年3月开始参加的实习，所以到现在算是一年的工作经验。以下均为个人2022年3月份的真实的面试经历（初衷在于个人记录，最近也很忙所以还没有时间去整理排版以及答案，所以呢，先将就着看嘿嘿...）。
题外话：我虽菜，但也好学！
A公司
1.路由懒加载
2.export default 与export的区别
- export与export default均可以导出常量、函数、文件、模块等
- 在一个文件或者模块中，export、import可以有多个，export default仅有一个
- 通过export方式导出，在导入的时候需要加{}，export deault则不需要（因为这是模块指定默认输出，则不需要知道索要加载模块的变量名）
这样来说其实很多时候export与export default可以实现同样的目的，只是用法有些区别。下面举个简单的例子
var name="李四";
export { name }
//import { name } from "/.a.js"
可以写成：
var name="李四";
export default name
//import name from "/.a.js" 这里name不需要大括号
3.项目慢难点
4.es6有用到什么新特性
5.webpack常用的loader与plugin
6.性能优化
7.vue中路由的模式有哪几种，你都用过那些
8.移动端的适配你是怎么进行的
9.有用过vue3吗
10.什么情况下需要进行路由懒加载，什么时候不需要
11.路由守卫，是怎么判断token的，还有就是数据持久化是怎么实现的
12.通过什么方式去判断页面项目的加载速度的，通过什么工具吗还是？有没头用到什么优化的判断页面加载的api
13.action和mutation的区别
14.watcher和computed的区别
15.v-if和v-for为什么不能用还是使用？那我要是有这样的需求应该怎么实现呢？不在computed方式还可以有其他方式实现吗？
16.对于uni-app多端开发的兼容性你是如何解决的
17.数据的流加载是怎么实现的，有了解过虚拟渲染吗？
18.less与sass的区别，有使用过变量吗？有了解过@mixin吗
sass中的变量是以$开头即表示边框，而less则是以@开头，用法如下：
18.2 @mixin定义的是一个混入，通过@mixin指令来定义
1.定义混入
@mixin important-text { color: red; font-size: 25px; font-weight: bold; border: 1px solid blue;}
2.使用混入：Sass @include 混入语法：
selector {@include mixin-name;}
19.有用过过滤器吗？比如要在模板中使用单位之类的，你是怎么进行过滤的
21.有用过promise？有哪几种状态，状态是否可逆？你用过promise的哪些方法？all和rece的场景是怎么样的？
22.组件之间的通信有哪些？父子之间，兄弟之间，祖子比较深的之间的通信你有用过吗？bus那个有没有用过，还有有没有用过比较高级pridiver的通信方式？
- 通过props传递
- 通过$emit触发自定义事件
- 使用ref
- EventBus
- root
- attrs与listeners
- Provide与Inject
- Vuex
下面对上上面的通信进行选择性介绍
3.ref
- 父组件在使用子组件的时候设置ref
- 父组件通过$refs来获取数据
4.EventBus
- 使用场景：兄弟组件传值
- 创建伊特中央事件总线EventBus
- 兄弟组件通过emit第二个参数为传递的数值
- 另外一个兄弟组件通过$on监听自定义事件
Bus.js
// 创建一个中央时间总线类
class Bus {
constructor() {
this.callbacks = {}; // 存放事件的名字
}
$on(name, fn) {
this.callbacks[name] = this.callbacks[name] || [];
this.callbacks[name].push(fn);
}
$emit(name, args) {
if (this.callbacks[name]) {
this.callbacks[name].forEach((cb) => cb(args));
}
}
}
// main.js
Vue.prototype.$bus = new Bus() // 将$bus挂载到vue实例的原型上
// 另一种方式
Vue.prototype.$bus = new Vue() // Vue已经实现了Bus的功能
Children1.vue\
this.$bus.$emit('foo')
Children2.vue\
this.$bus.$on('foo', this.handle)
5.root
- 通过共同祖辈root搭建通信桥梁
兄弟组件：
this.$parent.on('add',this.add)
另一个兄弟组件\
this.$parent.emit('add')
6.listeners
- 使用场景：祖先传递数据给子孙
- 设置批量向下传属性listeners
- 包含了父级作用域中不作为prop被识别（且获取）的特性绑定（class和style除外）
- 可以通过v-bind="$attrs"传入内部组件
7.provide与inject
7.1 概念
成对出现：provide和inject是成对出现的
作用：用于父组件向子孙组件传递数据
使用场景： 由于vue有$parent属性可以让子组件方父组件，但是孙组件想要访问祖先组件式比较困难的，通过provide/inject可以轻松实现跨级访问父组件的数据
简单来说
provider/inject就是在父组件通过provide来提供变量，然后在子组件总通过inject来注入变量，需要注意的是这里不论组件有多深，只要调用了inject那么就可以注入provider中的数据，而不是局限只能从当前父组件prop属性来获取数据
- 在祖先组件定义provide属性，返回传递的值
- 在后代通过inject接收组件传递过来的值
祖先组件
provide(){
return {
foo:'foo'
}
}
后代组件：
inject:['foo'] // 获取到祖先组件传递过来的值
23.防抖优化说一下
24.封装通用组件你主要封装了哪一些，怎么实现的？
25.权限控制是怎么实现的？有没有使用过自定义指令的方式？
26.本地开启跨域的原理是什么？devserve
27.如果使用ref绑定元素，最后获取的时候会返回什么类型的数据？ 数组类型
28.一般用什么来判断数据类型，如果没有知道确切的类型的时候应该如何判断
使用Object.prototype.toString.call()---这种情况下当你不知道数据类型的时候也可以准确判断
Object.prototype.toString.call('') ; // [object String]Object.prototype.toString.call(1) ; // [object Number]Object.prototype.toString.call(true) ; // [object Boolean]Object.prototype.toString.call(Symbol()); //[object Symbol]Object.prototype.toString.call(undefined) ; // [object Undefined]
29.有了解过插槽吗？插槽有哪几种方式
- 默认插槽：匹配没有name属性的solt
- 具名插槽：通过solt的name属性
- 作用域插槽：在组件内部通过slot关键字将数据源教导外部的插槽中
30.数据持久化你做过吗，并且说一下你是怎么做的，localstorage和sessionstorage的区别
我使用的是vuex-persist持久化插件
B公司
初面（过了）
0.给定一个住呢各式各样nums和一个目标值terget，请你在该数组中找到和为目标值的哪两个整数，并返回他们的数组下标，你可以假设每种输入只会对应一个答案，但是，数组中同一个元素不能使用两遍。
实例： /* 给定nums =[2,7,11,15],target=9 因为nums[0]+nums[1]=2+7=9 所以返回[0,1] */
1.实现数组去重 (多种方法）
2.已知有两个已经排序好的数组，如何实现将这两个数组进行合并并且也是排序好的 （多种方法）
3.watcher和computed的区别
4.let const与var的区别
5.数组有哪些方法，他们的作用分别是什么？
6.介绍一下vuex
7.组件之间的通信有哪些？
8.vue中双向数据绑定的原理
9.vue中set的作用
10.nextTick的工作原理
11.事件循环机制，哪一些是红任务，哪一些是微任务，promise是微任务还是宏任务
12.作用域链的理解
13.闭包的理解，会有什么缺点
14.原型链的最终指向是什么 :null
15.防抖与节流的区别，并且他们的应用场所
16.对vue生命周期的理解？在created和mounted这两个生命周期中请求数据有什么区别呢？
17.vue中key的原理,说说你对它的理解
复试（就很迷，面我的那个面试官跟我说对我挺满意的说已经向上汇报了，然后有下文咱也不知道该说啥...）
C公司（已过）
初面
1.h5端的打包优化有没有做过
2.由于微信小程序打包有一定的限制，如果出现这种情况，你会怎么去解决？
3.页面传递参数你数如何实现的？
4.css3你用过哪些属性？兼容性问题你是怎么处理的
5.有没有想过自己封装tabbar导航栏？
6.你主要封装过哪些组件？怎么实现的？
7.看到你项目中引入高德地图，你是怎么实现引入的？
8.项目从0-1开始搭建，你是如何实现的？开始时你会注意哪些问题？
9.组件之间的通信有哪些？evenBus和$emit的区别你有了解过吗？
10.你有用过哪些布局
11.你觉得Vue和uni-app上有什么区别
- uni-app是基于vue进行开发的，继承勒Vue的而特性和语法
- uni-app中没有Vue-router
- 使用的标签不一样，在uni-app中通常使用的是view、image、text
- 生命周期也不一样
12.你有注意过安全性的问题吗？比如一些全局的id之类的，还有就是当数据需要全局使用的时候你一般是怎么处理的？存在localstorage和vuex中有什么区别？和全局挂在又有什么区别？
13.SSR解决了什么问题？有做过SSR吗？你是怎么做的？
14.怎么理解ES6中 Promise？使用场景？
15.
复试+终面（这里忘记录音了，想起来记录的时候已经忘记了....）
D公司（小公司）（已过）
1.es6的新语法
2.class用过吗
3.情景反应：主要是支付方面（这方面讲了很多）
4.pormise了解过吗？应用场景
5.......
E公司：
这是笔试（没过，然后我就没有进入二面）
1.在html页面中如何控制页面的加载顺序，比如有左右中三个布局，如何使得在中部分加载完毕之后左右布局才能加载
2.现在有a，b，c三个对象，如何使得a继承b的方法和a继承c的方法
3.提取url后面的参数，返回键值对的对象形式
4给出一个字符串，使用正则表达式对其识别
5.有些题我也没拍下来，记不太住了..
F公司（已过）
0.首先事笔试---大概有5-6页的纸，也是我面试以来做过最多的题目一次
- 有一道很长的关于宏任务和微任务执行顺序的题目（占一页纸不夸张）
- 10+道选择题（我看到面试官的改卷似乎很多我都作对了，不过没拍下来，这里就不写了）
- 两道算法题，做出了一个（是求两数之和等于某个值，返回这两个数在数组中的下表---funtion sum(num,target)
- 一个是光折射问题，我没怎么刷算法题没做出来
- 3-6道的简答题
1.css sipte图是什么？作用
2.一个是安全性能的问题，即什么是XSS和CSRF攻击，如何防御？‘
3.前端优化性能有哪些？
4.什么是跨域？解决跨域的方法有哪些？
5.http和https常见的状态码有哪些？loalhost和127:0:0:1与本地ip有什么区别？
6.
*上面是笔试题，以下是问答题
1.说说你的第一个项目你从0开始觉得做的不错的地方
2.es6新语法特性，而且在其中你最常用的有哪些？
3.图片懒加载是什么？怎么实现的
4.跨域了解吗？你是怎么解决跨域的，nignx代理解决跨域做过没有？
5.登录验证是怎么做的？数据怎么保存的？
6.本地缓存有哪些？有没有使用过cooike？刷新的时候数据丢失怎么解决？
7.es6中暂时性死区是什么？
8.function fn(name){var name=3;console.log(name)===>fn(1)，最终那么输出什么？3，因为参数name，实质是var name=undefine
9.css的flex布局了解吗？（虽然我用了很多特性都知道，但是没有组织好自己的语言嘿嘿，记得看一下）
10.css中为什么不用float浮动了，是有什么缺点吗？
11.如果浮动，怎么清除浮动？
12.var、let、const之间的区别
13.有了解过vue3吗，知道其和vue2的区别吗？
14.Vue组件生命周期，还有父子组件生命周期的执行过程？
15.Vue中的$nextTick有什么作用？
16.Vue项目中有封装过axios吗？主要是封装哪方面的
17.new操作符具体干了什么？
18.你对事件循环的理解
19.什么是防抖和节流？有什么区别？如何实现？
G公司（初面+终面都已过）
- 2022.3.27面试的，2022.4.16才想起来整理记录，可想而知，我是没有记住问的什么了...
