1、html有哪些标签？

html分行级元素和块级元素，行级元素可在同一行显示，块级元素独占一行显示。
行级常见元素： span、a、input、label、img、i
块级常见元素：div、p、ul、table、form、dl、ol

答题要点：对标签进行分类，简要说一下它们的作用，然后讲些常用的标签即可（回想你写过的标签），不要全部都讲出来（没有必要）

2、html5有哪些新特性？

答：

1.新增了css3，包括圆角、弹性盒子、动画还有丰富的选择器
2.新增了布局标签 <header> <footer> <nav> <section><article><aside>等
3.新增了音频和视频标签 <audeo> <video>
4.提供了<canvas>画布标签，可以绘制丰富的图形，<svg>绘制矢量图
5.新增了本地存储 localStorage、sessionStorage
6.新增了web Worker实现多线程处理
7.新增了web Socket可以实时通信

技巧：内容比较多，你可以从css3、html标签、js处理能力 三方面去归纳总结

3、请描述一下css样式的盒子模型是怎样的？

听到盒子模型这四个字，就知道他问什么了！

答：
盒子模型分IE和W3C两种盒子模型
IE盒子模型的宽度=width
W3C盒子模型的宽度=width+padding+border 组成

补充回答以下一点
在css3中，可以使用box-sizing来设定，通常我们要设定 box-sizing:border-box;指定盒子模型为IE盒子模型，方便布局。

补充知识更有说服力，面试官会给你比较深刻的印象。

4、请说一下css的定位方式

在面试上无论对方采用什么提问方式，只要提到定位就立即反应做出以下回答

答：
默认定位是static，从左到右，从上到下布局。
固定定位：相对于窗体定位，可通过top、right、bottom、left设置固定的位置
绝对定位：相对最近父级元素非static定位的元素定位，如果都找不到，就以根节点html定位。
相对定位：相对当前的位置定位

固定定位和绝对定位都会脱离文档元素，通过z-index设置层叠顺序，使用top、right、bottom、left定位。

5、css样式的优先级是怎么样的？

答：
css样式的优先级是这样的
!import优先级最高，其次就是行内样式，再次是权重值，权重值高的优先应用。
权重值计算是这样的，ID为100 class为10 标签为1，对于复合选择器，将这些权重值相加得到。

对于优先级的级别相同的情况，后面的样式会覆盖前面的样式。

注意：面试必须言简意赅，不要讲过多的废话，每句话都要说到要点上。

6、如何清除元素浮动

答：
在浮动元素的父节点上，添加一个伪类元素::after。设置伪类元素为块级元素，content:'' ; clear:both 。
这是我们现在比较常用的做法。

建议：这样的问题，你平时是怎么做的，你就这么说就好了。

7、怎样添加、移除、移动、复制、创建和查找节点?

答：

1、创建节
createElement('节点名称') 创建节点对象
createTextNode(''); 创建文本节点
2、移除元素 
parentNode.removeChild(childNode)
3、替换元素
parentNode.replaceChild(newChild,oldChild);//替换元素
4、插入元素
parentNode.insertBefore(newChild,refChild) //在refChild前插入节点
5、追加元素
parentNode.appendChild(childNode)
6、查找
parentNode.getElementsByTagName(tagName) 获取所在父节点下的指定标签名节点·祷豀TMLCollection类型
document.getElementsByClassName(className) //根据类名获取节点，返回HTMLCollection
document.EletemtBenyId(id) //通过元素Id，唯一性
document.querySelector('选择器') 查询符合条件的第一个元素
document.querySelectorAll('选择器') 查询符合条件的所有元素

8、你对原型链了解吗？

提示：无论提问者以什么方式提问，只要提到“原型链” 就知道是什么问题了。

答：原型链的作用是建立对象之前的关系，我们也经常通过原型链prototype来扩展一个对象的方法。通过prototype指向父级对象，直到根对象Object为止。

9、什么是闭包（closure），为什么要用它？

答：

闭包的主要作用就是封装，将使用的变量封装在一个封闭的作用域，这个作用域叫做“闭包域”，这样就不会污染全局变量的使用了。
通过闭包形成一个私有的通过，通常通过return返回一个函数，来调用内容的实现。
闭包需要特别注意的是，变量需要手动的释放资源，否则容易占用资源，导致内存泄露。

早期通常使用即时函数来实现，在es5、es6，可以使用CommonJS、AMD、UMD的方式来实现模块化开发，一个JS文件就是一个模块也就是一个单独的作用域。

10、Ajax 是什么? 如何创建一个Ajax？

提示：关于ajax的提问方式非常多，比方说ajax的原理，其实都是一个意思。

答：
ajax是使用js同步或异步请求服务器资源的一种方式。
实现的步骤如下：
1.创建Ajax核心对象XMLHttpRequest
var xmlhttp;
if (window.XMLHttpRequest)
 {// 兼容 IE7+, Firefox, Chrome, Opera, Safari
 xmlhttp=new XMLHttpRequest();
 }
else
 {// 兼容 IE6, IE5
 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
 }
2. 向服务器发送请求
xmlhttp. open(method,url,async);
send(string)
注意：open 的参数要牢记，很多面试官爱问这样的细节
method：请求的类型；GET 或 POST
url：文件在服务器上的位置
async：true（异步）或 false（同步）
 send(string)方法用于post请求才使用字符串参数，否则不用带参数。
请求方式为post，数据通过send( )发送时，要设置请求头的格式内容
xmlhttp.open("POST","ajax_test.html",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("fname=Henry&lname=Ford");
3.服务器响应处理
responseText 获得字符串形式的响应数据。
responseXML  获得 XML 形式的响应数据。
  3.1 同步处理
  xmlhttp.open("GET","ajax_info.txt",false);
xmlhttp.send();
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
直接在send()后面使用
3.2 异步处理
异步处理相对比较麻烦，要读取状态事件，状态码
xmlhttp.onreadystatechange=function()
 {
 if (xmlhttp.readyState==4 && xmlhttp.status==200)
  {
  document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
  }
 }
  在onreadystatechange事件做处理，一共5中请求状态，从 0 到 4 发生变化。
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成，且响应已就绪
xmlhttp.status响应状态码，这个也是面试比较爱问的，这个必须知道4个以上，比较常见的有：
200: "OK" 
403  （禁止） 服务器拒绝请求。 
404  （未找到） 服务器找不到请求的网页。
408  （请求超时） 服务器等候请求时发生超时。
500  （服务器内部错误） 服务器遇到错误，无法完成请求。

11、谈谈this对象的理解。

答：

在全局作用域下，this指向的是window对象。
在方法内部指向是的调用该方法的对象，但可以通过call或apply以及bind方法改变this的指向。
在箭头函数中，this指向的是定义箭头函数所在的上下文（即定义的位置）中的this；

提示：this的知识还非常多，在面试中，只讲常用的，对于不常用的不用讲，否则容易捡起石头砸自己的脚。

12、call() 和 apply() bind()的区别？

答：

call和apply都是用来调用一个函数，并且通过第一个参数来改变this的指向。
主要的区别是第二个参数不同，call采用的是reset风格，apply采用数组的方式想函数的参数传值。

bind() 就是将某个函数绑定到某个对象上。使用的方式与call相同，但不会立即执行函数，而是返回要执行函数的引用。如下面代码（为了让你理解）
var func=show.bind(person,"不明");
func();

13、jQuery中有哪几种类型的选择器？

答：

JQuery的选择器和css3的选择差不多，有基本选择器、后代选择器，并集、交集、相邻、兄弟、属性这些选择器。
除了这些还有表单选择器，和可见性元素选择器。

14、Jquery绑定事件有哪些？

答：
我们在开发中经常使用on方法来绑定事件，提供4个参数：
第1个是事件类型；第2个是选择器；第3个是事件需要的数据，第4个事件处理函数。

在往后的版本已经去除了bind、live这些绑定事件的方法了。

可以使用trigger来触发一个自定义的事件。

15、前端有哪些跨域的方式？

提示：这种问题我还是建议根据实际经营来回答，按照以下的方式回答，会更能体现出你的表达力和理解能力

答：跨域的方式非常多
第一种方式使用代理方式跨域，不过这种只能用户开发环境，上线后就不行了。
第二种方式 使用jsonp，其原理是通过<script>访问脚本是可以跨域访问的。
第三种方式 设置请求头，指定允许跨域的站点，我们开发使用的是这种方式。后端同事在Response Header
上添加了 Access-Control-Allow-Credentials: true 和 Access-Control-Allow-Origin: http://admin.zxwyit.com
Access-Control-Allow-Credentials 是否允许cookie发送到服务器
Access-Control-Allow-Origin 可访问的地址

16、如何加快页面打开的速度？或是提问，优化方案有哪些？

答：

我的优化方案是这样的
1.减少渲染堵塞：将js 放到body结束标签前，头部引入的css文件内容尽量少，如果多的话，10~20K的样式就放入到内部样式表里。无论js还是css上线后都要做压缩处理。我们在项目里是通过webpack来打包处理的。
  对于第三方框架，我们使用信任的cdn加速器来加载。
2.图片加载优化
   使用媒体查询，根据不同的分辨率加载对应大小比例的图片。另外使用图片延迟加载，将图片的路径先放到自定义属性data-src，使用滚动监听的方式来加载。多个相同尺寸的图标使用图片精灵，放到一张图片，然后背景图片移位显示。
3.缓存策略，在web服务器上配置一些缓存策略，例如cache-control，last-modified
4.其它的优化方案：代码优化，减少cpu和内存的开销还有域名与解析等。

提示：这里涉及到一些专业术语，可以去弄清楚这些概念，把它熟记然后脱口而出，一定能够达到很好的效果。

17、Promise了解过吗？追问：链式调用的原理的原理是什么？

提示：只要面试官提到Promise这个关键字，就按照下面回答！问的方式不一样，但实际上是同一个意思。比如：
1.你了解过Promise吗？
2.你是怎么理解Promise的？
3.Promise是干什么用的？
等等，都可以按照项目的方式去回答：

答：
Promise是ES6提供的一种异步编程方案。使用new和它的构造函数创建Promise对象，构造函数传一个处理函数，有两个参数，为resolve 和 reject 两个函数。
通过new Promise(function (resolve, reject) {

   }
)
resolve函数是异步成功返回的结果，reject是异步失败返回的结果。成功的结果使用then来处理，错误的结果使用catch来处理。
Promise的优点就是可以链式调用，这样就可以用同步的编程方式处理异步的结果，异步获取数据和业务处理分开。提示：为了便于理解，你需要看看下面这段代码，面试的时候可以不用说这段代码。

// 第一部分 异步获取数据阶段
var getUserName = function(){
return new Promise(function(resolve,reject){
$.get('xxx.com/getUserName',function(data){
resolve(data);
});
};
var getMobile = function(userName){
return new Promise(function(resolve,reject){
$.get('xxx.com/getUserMobile?user='+userName,function(data){
resolve(data);
});
});
}
// 第二部分 业务逻辑部分，以同步编程的方式处理异步结果。
getUserName().then(function(userName){
//这里可以处理第一个异步返回的结果
return getMobile(userName);
}).then(function(mobile){
//这里可以处理第二个异步返回的结果
});
 
有了Promise后，可以按照顺序来处理异步执行的结果变得更加的方便。提示：这句总结性的话必须说出来，表示个人的理解。

追问：链式调用的原理是什么？
答：then和catch函数都会返回一个新的Promise对象，可以不断的调用下去，这样就形成了链式调用。

18、px、em和rem的区别？

px：是像素，根据屏幕的分辨率来显示的
em：相对长度单位，相对父节点font-size大小的倍数关系。
rem：是根据根节点<html>的font-size大小的倍数关系，用来为整个页面做自适应调整。

19、Ajax的封装

说明：提问的方式很多，但回答的套路都是相同的
1.有没有做ajax的封装
2.ajax的原理是什么

答：
1.创建XHR(XmlHttpRequest的缩写)对象，IE通过ActiveXObject对象创建，其它的通过XmlHttpRequest对象创建。
2.使用open()方法建立连接，有三个参数，第一个参数是请求类型，通过是get或post请求，第二个是请求的地址，第三个是否为异步请求，true表示异步，false表示同步。
3.使用send()发送请求，接一个参数，需要发送的的信息，以URL参数的形式拼接，如果没有为null
4.数据响应，这个阶段涉及到的API主要有responseText，responseXML，status（状态码），对于异步请求还会涉及到readyState和状态改变事件onreadystatechange。但读取状态改变时会触发这个事件。读取状态有五个阶段
 0：未初始化，还没有调用open方法
 1：启动，调用了open方法，但还没有调用send方法
 2：发送，调用了send方法，但还没有响应
 3：接收，收到了部分响应的数据
 4：完成，收到全部响应的数据
  status表示http的状态码，表示读取的信息是否正确，200表示成功，500表示服务器错误，304表示资源没有改变，使用缓存的数据。

为了方便使用和重用，我们会创建一个对象，然后创建一个ajax的方法，传递一个对象参数，参数包括请求的地址、请求的方式、请求的数据，同步或异步，请求头等信息，成功请求的处理函数，错误请求的处理函数，为了方便在单独创建get和post两个常用的请求方式。

提醒：这个问题对方还是希望你能够弄清楚ajax的原理，然后在来回答封装。很多面试者是被封装误导了，也吓倒了！

20、vuex状态管理

答：在组件中需要共享的数据我们就会用到状态管理，状态管理的好处数据是共享的，并且没有大小限制，而且是响应式的。用户信息、token、购物车信息，都可以用状态管理存储。
状态管理有5个核心概念
State 状态数据，类似vue 对象的data属性，是响应式的
Getter 类似计算属性，缓存依赖状态数据的变化
 Mutation 采用同步的方式操作状态管理,使用commit()调用函数
Action 采用异步的方式操作状态管理,使用dispatch()来调用
Module 状态管理数据较多时，通过模块来划分，避免代码臃肿。

21、拦截器（请求与响应）

提示：如果是请求或响应的拦截器通过指axios框架
答：我们项目上使用请求拦截器在请求头上添加token信息，在响应拦截器中做401未授权的处理，重新刷新令牌信息，并且重新做上一次的请求来提升用户体验。
经验：通过项目的实战技术来讲给面试官听，更具有说服力。

22、用什么打包，用什么上线

答：我们的项目是基于webpack来打包的，使用npm run build打包成最终要上线的代码，为了提升性能，我们的项目还做了分包处理，每个路由的组件单独打包一个独立的js、css文件来加载。打包完成后，将文件上传到iis服务的对应站点目录。

提示：很有可能面试官会访问：”是这样吗？“，千万别怀疑自己。你要坚定回答：我们的项目是这样的，请问：你们是怎样的了？这个时候可以趁机交流一下。

23、宽高不定的div怎么水平垂直居中

答：
第一种方式：弹性盒子模型，现在用的比较多
父元素： display:flex;
子元素：margin:auto;

第二种方式：单元格
父元素： display: table-cell;text-align: center;vertical-align: middle;
子元素：display: inline-block;

第三种方式：使用绝对定位
父元素 position:relative。
子元素position:absolute;left:50%;top:50%;
transform:translate(-50%,-50%)  /*向左向上移动子元素的width和高度的一半*/

24、Css中sprite

答：Css中的sprite是指图片精灵,将网站上用到的图片放到一张图片上,然后通过移位显示对应的图片,这样做的好处就是减少请求的次数;缺点就是需要精细化的制作图片,控制需要精确的控制,维护比较麻烦。

25、前端存储

答： 
cookie存储数据比较常用，也是早期的前端存储方式，cookie信息往返浏览器与服务器之间，cookie的信息会提交到服务器，服务器也可以写cookie信息，存储大小为4KB左右，可以设置过期的时间。
sessionStorage是html5新增的，用于存储临时的会话数据，页面关闭就销毁
localStoreage 也是html5新增的，用于永久存储客户端数据 
	  sessionStorage和localStoreage存储的数据都要比cookie大，约为5MB。

离线缓存（application cache）：HTML5引入了应用程序缓存器，可对web进行缓存，在没有网络形况下使用，通过创建cache manifest文件,创建应用缓存。
优点：减少服务器负载，提高加载速度；离线浏览，用户可以在应用离线时使用。
缺点：版本更新后，必须刷新一次才会启动新版本；进入离线存储的页面，如果不更新版本，是会将其当成静态页面不请求；无法进行灰度发布等策略。

26、代码检查工具

答：在我们的项目中使用ESLint插件作为代码检查工具，可以检查JavaScript代码错误和代码风格错误，辅助我们规划编码，提高项目代码质量。

27、浏览器兼容性问题

答：
在我们的项目是采用优雅降级的方式来解决兼容性问题。
第一个版本我们采用html5技术来设计网站，然后在调试中去兼容低版本的浏览器兼容性。兼容主要css和js上的差异。js体现在api的差异，css体现在样式属性和值的差异。找出差异进行修正。

一、常见的兼容性问题
1.常见的兼容性问题:不同浏览器的默认margin和padding 值不同,一般都初始化样式.
2.图片默认有间距,可以使用浮动图片或设置图片行块级元素解决.
3.透明度一般浏览器都使用opacity,IE使用滤镜filter来设置.

二、针对IE不同版本的浏览器 
css hack主要是针对IE浏览器的不同版本这是样式。大致分为三种形式的hack
第一种：属性级Hack：比如IE6能识别下划线”_”和星号” * “，IE7能识别星号” * “，但不能识别下划线”_”，而firefox两个都不能认识。
第二种：选择符级Hack：比如IE6能识别*html .class{}，IE7能识别*+html .class{}或者*:first-child+html .class{}。
第三种：IE条件注释Hack，通常用于判断浏览器的版本。
例如针对所有IE：<!–[if IE]><!–您的代码–><![endif]–>
针对IE6及以下版本：<!–[if lt IE 7]><!–您的代码–><![endif]–>

三、PC端兼容性的处理:
1.Normalize.css
不同浏览器的默认样式存在差异，可以使用 Normalize.css 抹平这些差异。
2.html5shiv.js
解决 ie9 以下浏览器对 html5 新增标签不识别的问题。
3.respond.js
解决 ie9 以下浏览器不支持 CSS3 Media Query 的问题。
4.picturefill.js
解决 IE 9 10 11 等浏览器不支持 <picture> 标签的问题

四、项目中遇到兼容性的问题:
1、firefox中的a标签点击后，周围有一圈虚线框。去掉方式是：
 		a:focus{outline:none}
2、input:password 设置required之后，输入框周围有一圈红框，解决办法是把required去掉，该用js验证
3、ie8并不支持rgba来设置透明度，解决方案如下：
	background: #000000;
	filter: alpha(opacity=50) !important;
	opacity: .5 !important;

28、怎么统一代码风格

答：首先我们开发团队会定义项目开发规范文档，然后在通过ESLint插件辅助检查代码规范。除了工具以外也会开展代码质量讨论会，相互学习，相互促进。

29、FrozenUI框架

答：这个是一个移动端UI框架，里面提供了丰富的组件，我之前项目使用的是ElementUI框架，根据我的经验和理解，UI框架比较容易上手，主要提供了丰富的组件，组件一般都会有属性、事件、方法这些内容。虽然FrozenUI框架在开发中没有用过，但这个不会妨碍我在项目中的开发，可以做到现学现用。

30、React前端框架

答：React和Vue框架差不多，我之前的项目都是使用Vue.js开发的，以数据驱动视图，可以组件化开发，都有模板，个人认为Vue模板更胜一筹，简洁明了，编写方便，React采用的是JSX语法，当然Vue也支持这个语法，模板都是需要编译。虽然没有使用React开发过项目，但是根据我对Vue的经验和理解，使用React开发项目也没有问题，因为开发思想都是相通的。（要给予面试官信心，同时表现出真诚）

31、vue的生命周期

vue的生命周期是指从创建到结束，进过了八个钩子函数：创建前/后, 载入前/后,更新前/后,销毁前/销毁后。通常我们会在created 发起异步请求接口，在mounted获取DOM节点，nextTicket数据更新完成后立即操作DOM。 

32、自适应和响应式区别

答：自适应是根据屏幕的大小调整图片文字的大小，页面结构不做改变，可以使用百分比和rem这些技术实现；
响应式根据不同的屏幕调整页面的布局，可以使用媒体查询或弹性盒子模型来实现。

提示：这个问题的答案尽量不要参考网上的，而是要根据自己的理解来回答比较好，这个会有说服力。

33、懒加载

答：即是延迟加载。
懒加载的原理就是先在页面中把所有的图片统一使用一张占位图进行占位，把正真的路径存在元素的“data-url”（这个名字起个自己认识好记的就行）属性里，要用的时候就取出来，再设置。
实现步骤：首先，不要将图片地址放到src属性中，而是放到其它属性(data-original)中；页面加载完成后，根据scrollTop判断图片是否在用户的视野内，如果在，则将data-original属性中的值取出存放到src属性中；在滚动事件中重复判断图片是否进入视野，如果进入，则将data-original属性中的值取出存放到src属性中。
优点：页面加载速度快、可以减轻服务器压力、节约了流量，用户体验好。

34、加密解密

答：这个在我们的项目中有使用过base64进行加密和解密。我们项目规定敏感数据存储在前端的需要加密，要用的时候在解密回来，特别是记住用户和密码的信息我们就是这么干的。

35、怎么提高代码性能

这个问题对于想拿10k以上的同学来讲必会
答：性能优化主要是围绕执行速度来做的。通常的做法是这样的
1.使用图片精灵，将多个图标放在一个图片上，然后通过背景图片定位来显示图标
2.有些图标使用使用阿里字体的，使用他们自带的云加速器下载字体文件
3.在首次加载的时候，将所需要的数据都放在一个接口上返回，减少请求的数量，经过测试这个效果还是挺明显的。
4.在编码上，我们通过会将this对象存储到临时变量，减少this查找的时间。
5.对于频繁使用的数据，会将数据缓存起来，减少多次请求接口。
6.使用压缩工具，对html、css、js文件，进行合并压缩处理，减少文件的体积。
7.对于数据较大的加载，通常采用分页加载或是按需加载或是延迟加载来处理。
这是我们比较常见的优化手段。

36、vue的全家桶指的是哪几个

全家桶是大家不熟悉的术语，简单说就是vue项目常用的东西，由vue团队开发维护或是推荐的。
答：
1.项目构建工具（vue-cli）、2.路由（vue-router）、3.状态管理（vuex）、4.http请求工具（axios）。

37、输入一个URL，浏览器做了什么？

答：根据域名查找服务器，下载服务器的文档内容，下载完后浏览器开始解释执行这些html代码，渲染页面，并行下载所需的资源，图片、css、js文件等。

38、你们项目的人员是怎么组成的？

有2个前端，2个后端，其中一个是项目经理，一个测试，一个UI

39、你在之前的项目组里面担任什么角色？如果让你给自己的工作比例做一个评价，你给多少？

答：担任的web前端开发工程师，主要负责前端页面制作，用户体验和功能的实现，工作比你在60%，前端框架和结构都是我来搭建的，项目开发的规范文档制作，项目中的一些重要技术也需要攻破，关键算法，和性能优化方案都有参与。

40、介绍一下项目的亮点/让你技能得到提升的是哪个部分

答：最近的这个项目从整体设计到开发我都有参与，掌握前端项目开发的流程和项目结构的搭建，这次项目主要的亮点就是用户体验的提升，在令牌过期时，我们会重新刷新令牌，并且再次发送上一次请求，就不用跳回到登录页面了，这样大大的提升了用户体验，让我对axios的拦截器和Promise有了更深的理解。

41、v-model的原理

答：v-model用于<input>、<textarea> 及 <select>双向绑定数据，方便获取用户输入的内容，其实是一个语法糖。使用value或checked属性绑定要渲染的值，使用input事件或change获取用户的输入的值给绑定的变量。
对于text和textarea使用value属性和input事件，
对于radio和checkbox使用checked属性和change事件。
对于select使用value属性和change事件。

42、事件循环

答：JavaScript是单线程程序，由js主线程同步执行，遇到异步操作，为了执行效率，会将异步任务交给对应的异步进程处理，主线程继续执行后面的代码。
异步进程的任务完成后，将任务推入到任务队列，队列是先进先出的，主线空闲后，从队列依次获取任务，在js主线程执行，执行中遇到异步操作会重复上面的步骤，这样就形成了一个循环，称之为事件循环。

43、vue中data的属性为什么具有响应式？

答：vue会遍历data的所有属性，使用es5提供的Object.defineProperty，将这些属性转化为getter/setter函数，getter获取数据时调用，setter就是给属性赋值时调用。每个组件都会有一个watcher监视器，需要在组件渲染的属性都会记录在watcher，当属性的内容发生了变化，就会通知watcher，重新渲染视图。

44、Axios请求参数写在data里面与写在params里面的区别是什么

答：data的数据是在请求体，用于post，params是在url查询参数上，一般用于get请求。

45、使用状态管理与使用存储的方式区别在哪里？

答：状态管理是响应式的，并且大小没有限制，存储方式则没有响应式，大小限制在5MB。状态管理刷新页面就销毁，存储方式这不会。