2020面试题汇总（1）

最近一个星期参加了几场面试，大概简单总结了一下，后续再慢慢完善。
1.var a=7,b=7;如何不借助第三方的情况下，倒换两个的值
答:解构赋值
2.Vue侧边栏四级五级菜单？答案猜测可能用递归
3.对象的深拷贝:
1、JSON.parse（）与JSON.stringify（）深拷贝
//纯数据json对象的深度克隆
function deepClone(obj) {
return JSON.parse(JSON.stringify(obj));
}
2、对象遍历
4.type of null ==>结果是object
5.判断数组是不是数组
es6中 Array.isArray
6.Vue菜单与权限 https://www.jianshu.com/p/aede33e897a5
7.如何阻拦一个没有权限的普通用户进入某个页面
9对象
获取对象的属性（获取原型的几种方式）
10.export default 和export 有啥区别
11.获取数组第一个目标值的元素
12.谷歌浏览器字体小于12px，可以用CSS3中的-webkit-transform：scale来实现
13.element树形结构，如何将数据动态添加一个属性
14.树形结构，如何只选择其中的一个，也就是单选而非多选
15.清除浮动
1） 加高法：
浮动的元素，只能被有高度的盒子关住。 也就是说，如果盒子内部有浮动，这个盒子有高，那么妥妥的，浮动不会互相影响。但是，工作上，我们绝对不会给所有的盒子加高度，这是因为麻烦，并且不能适应页面的快速变化。
2）clear:both;法
最简单的清除浮动的方法，就是给盒子增加clear:both；表示自己的内部元素，不受其他盒子的影响。
3）隔墙法：
在两部分浮动元素中间，建一个墙。隔开两部分浮动，让后面的浮动元素，不去追前面的浮动元素。
墙用自己的身体当做了间隙。
4）overflow:hidden;

16.js数据类型
基本类型：String、Number、Boolean、Symbol、Undefined、Null
引用类型：Object，Function 、Array、RegExp、Date

17.判断js数据类型的几种方式
1、typeof
2.instanceof
instanceof 是用来判断 A 是否为 B 的实例，表达式为：A instanceof B，如果 A 是 B 的实例，则返回 true,否则返回 false
3、constructor
4、toString
toString() 是 Object 的原型方法，调用该方法，默认返回当前对象的 [[Class]] 。这是一个内部属性，其格式为 [object Xxx] ，其中 Xxx 就是对象的类型。

对于 Object 对象，直接调用 toString() 就能返回 [object Object] 。而对于其他对象，则需要通过 call / apply 来调用才能返回正确的类型信息。

18.watch（如数组中某个属性变化，但是视图不变怎么办）
deep.true 深度监听数组

19.原型与原型连

所谓原型，是其他OO语言中类和继承的JS自家解决方案。JS以引用类型数据特性为基础，通过为构造函数自动创建prototype对象属性，实现类和继承，这个自动创建的prototype就是原型，也叫原型对象。所以要想搞清楚原型这个概念，首先要掌握引用类型、类、继承这几个概念。JS不像其他编程语言，如Java，类、构造方法、方法等概念之间有明确的界限，它用于模仿类和继承的原型对象本质是引用类型数据（Object），同样的，构造方法和成员方法也是。原型是JS引入的一个概念，用于解决实现类和继承，接下来看看是原型这个概念如何引入的。

20.子组件能接收到从父组件created中的异步请求值吗？
不能，可以通过监听watch

21.数组去除并排序

22.var,let,const
23.自定义指令
24.按钮控制权限和路由的情况遇到过吗？怎么处理？
用到自定义指令
25.多个组件之间有相同逻辑如何做？
用mixin
26.computed和watch的区别
27.倒计时在手机上锁屏或者黑屏时，停止了，该怎么解决？
28.setTimeout中嵌套promise，先运行哪个？
29.Vue中用js给某个节点设置样式
30.内存泄漏的几种情况也就是原因？如定时器，闭包
31.深度监听
32.路由
33.Vue组件传值
34.cookie，localStorage和sessionStorage
35.vuex
36.set的用法
37.为什么会产生跨域？如何解决
38.WEB前端性能优化常见方法

1. 内容优化
   (1)减少HTTP请求数:这条策略是最重要最有效的，因为一个完整的请求要经过DNS寻址，与服务器建立连接，发送数据，等待服务器响应，接收数据这样一个消耗时间成本和资源成本的复杂的过程。
   　　　　常见方法：合并多个CSS文件和js文件，利用CSS Sprites整合图像，Inline Images(使用 data：URL scheme在实际的页面嵌入图像数据 )，合理设置HTTP缓存等。
   (2)减少DNS查找
   (3)避免重定向
   (4)使用Ajax缓存
   (5)延迟加载组件,预加载组件
   (6)减少DOM元素数量:页面中存在大量DOM元素,会导致javascript遍历DOM的效率变慢。
   (7)最小化iframe的数量：iframes 提供了一个简单的方式把一个网站的内容嵌入到另一个网站中。但其创建速度比其他包括JavaScript和CSS的DOM元素的创建慢了1-2个数量级。
   (8)避免404：HTTP请求时间消耗是很大的，因此使用HTTP请求来获得一个没有用处的响应（例如404没有找到页面）是完全没有必要的，它只会降低用户体验而不会有一点好处。
   2.图像优化
   (1)优化图片大小
   (2)通过CSS Sprites优化图片
   (3)不要在HTML中使用缩放图片
   (4)favicon.ico要小而且可缓存
2. CSS优化
   (1)将CSS代码放在HTML页面的顶部
   (2)避免使用CSS表达式
   (3)使用来代替@import
   (4)避免使用Filters
   4.javascript优化
   (1)将JavaScript脚本放在页面的底部。
   (2)将JavaScript和CSS作为外部文件来引用：在实际应用中使用外部文件可以提高页面速度，因为JavaScript和CSS文件都能在浏览器中产生缓存。
   (3)缩小JavaScript和CSS
   (4)删除重复的脚本
   (5)最小化DOM的访问：使用JavaScript访问DOM元素比较慢。
   (6)开发智能的事件处理程序
   (7)javascript代码注意：谨慎使用with,避免使用eval Function函数,减少作用域链查找。
   5.Cookie优化
   (1)减小Cookie大小
   (2)针对Web组件使用域名无关的Cookie
3. 服务器优化
   (1)使用内容分发网络（CDN）：把网站内容分散到多个、处于不同地域位置的服务器上可以加快下载速度。
   (2)GZIP压缩
   (3)设置ETag：ETags（Entity tags，实体标签）是web服务器和浏览器用于判断浏览器缓存中的内容和服务器中的原始内容是否匹配的一种机制。
   (4)提前刷新缓冲区
   (5)对Ajax请求使用GET方法
   (6)避免空的图像src

39.webpack了解过吗？使用过或者配置过吗？
40.Vue页面跳转的方法
41.js异步处理机制的几种方式
一、回调函数（callback）
二、事件监听：
监听函数有：on，bind，listen，addEventListener，observe
三、发布/订阅
我们假定，存在一个"信号中心"，某个任务执行完成，就向信号中心"发布"（publish）一个信号，其他任务可以向信号中心"订阅"（subscribe）这个信号，从而知道什么时候自己可以开始执行。这就叫做"发布/订阅模式"（publish-subscribe pattern），又称"观察者模式"（observer pattern）。
四、promise对象（promise 模式）
五、优雅的async/await

详细：https://blog.csdn.net/hotnet522/article/details/83413238

42.es6项目中用到的
43.vue3.0了解过吗？
44.ajax发送的数据格式 除了formdata还有其他的吗
45.proxy代理原理
46.事件委托？优点？
47.浏览器渲染的重排和重绘
48.设计模式