一.你对于vuex了解多少？

 1.vuex有几个重要的函数

store:数据源

action：动作方法集中地，所有改变数据的动作都需要经过action 派发（dispach）出去，但是不能直接改变数据

mutation:所有数据的改变都需要经过mutaion，他里面保存着改变数据状态的回调函数

getter：将getters属性理解为所有组件的computed属性, 也就是计算属性. vuex的官方文档也是说到可以将getter理解为store的计算属性, getters的返回值会根据它的依赖被缓存起来，且只有当它的依赖值发生了改变才会被重新计算

module:模块化，将store分成不同的模块，每个模块都有自己的state，mutation，getter，action

二.vue项目中如何处理缓存问题的？

1.keep-alive实现页面数据的缓存，但是需要条件判断，判断的条件在路由配置的实现设置，然后用vue路由钩子函数设置条件

2.可以使用路由，this.$router.push({})，将数据携带过去，

三.vue项目中的页面数据如何缓存（比如从列表页进入详情页然后再返回列表页，保存页面数据）

1.keep-alive实现页面数据的缓存，但是需要条件判断，判断的条件在路由配置的实现设置，然后用vue路由钩子函数设置条件

四.对于vue的路由导航了解多少？

beforeEach :全局前置守卫

组件内守卫：beforeRouterEnter、beforeRouterUpdate、beforeRouterLeave,都有是三个参数; 

to:将要跳转去的路由地址

from：离开的路由地址

next：回调函数，一定要执行该方法来resolve这个钩子函数

注意：在beforeRouterEnter这个钩子函数调用的时候，不可以调用this，这个时候组件还没有被创建。

五.微信的用户信息验证如何实现？

1.小程序调用wx.login() 获取 临时登录凭证code ，并回传到开发者服务器。

2.开发者服务器以code与后台换取 用户唯一标识openid 和 会话密钥sessionid

六.微信的支付如何实现?

小程序支付的配置：

申请小程序账号（公司模式）

申请认证

申请支付对公账号（公司提供）

支付通过之后会有商户的id提供给用户

用申请微信支付获得的用户名和密码，登录商户平台(pay.weixin.qq.com)，在账户中心，API安全中下载证书和设置密钥。

密钥是32位，设置以后需要妥善保管，因为无法查看密钥，所有微信支付相关的接口都会使用这个密钥加密。

支付的程序流程

发起支付：调用wx.login返回 code

再通过code，appid,appsecret     获取  openid

再通过openid还有 配置 ，去完成 签名

再通过wx.requestPayment(OBJECT)调用 微信小程序的支付接口

七.弹性布局盒子如何居中？

1.justify-content属性接受五个不同的值：

flex-start（默认值）：项目朝起始行打包

flex-end：物品被打包到终点线

center：项目沿着线居中

space-between：物品均匀分布在线上; 第一项是在起始行，最后一项是在结束行

space-around：项目均匀分布在线条周围，空间相等

space-evenly：分配项目，使得任何两个相邻的对齐对象之间，第一对齐对象之前和最后对齐对象之后的间距相同

2.如果不使用弹性布局

盒子宽度给定，margin:0 auto;或者定位

八.公司经常用到的跨域有哪些？

两种跨域的方式

1.jsonp（非同源策略）跨域：利用 script 标签没有跨域限制的漏洞，网页可以得到从其他来源动态产生的 JSON 数据。JSONP 请求一定需要对方的服务器做支持才可以。

优点：简单兼容性好，可用于解决主流浏览器的跨域数据访问的问题。

缺点：仅支持get方法，具有局限性，不安全，可能随时会遭受到xss攻击

2.cors跨域：设置请求头，服务端设置 Access-Control-Allow-Origin 就可以开启 CORS

九.app打包遇到过哪些问题?

1.首页数据空白：打包时未修改文件的路径,默认是绝对路径,故页面结构都出不来

解决办法: 修改 config.文件夹中的index.js，将路由'/'改为'./'

2. 打开页面背景图片不显示问题 :也是由于背景图路径的问题

解决办法：修改build文件夹下面的 utils.js文件

十.vue中的服务型指令有哪些？

v-if，v-for，v-show,v-model

十一.MVVM的原理？

MVVM (Model-View-ViewModel),双向数据绑定，即MVVM。是指数据层（Model）-视图层（View）-数据视图（ViewModel）的响应式框架。vue.js 则是采用数据劫持结合发布者-订阅者模式的方式，通过Object.defineProperty()来劫持各个属性的setter，getter，在数据变动时发布消息给订阅者，触发相应的监听回调。

十二.v-model的实现原理？

官方说明了v-model是一个语法糖，但是他真正的实现主要还要考：

1.v-bind：绑定响应式数据

2：触发input事件，并且传递数据

十三.页面布局有哪些？

常用的：

1.响应式布局：一个网站能够兼容多个终端——而不是为每个终端做一个特定的版本

2.弹性布局：CSS3引入了一种新的布局模式——Flexbox布局，即伸缩布局盒模型（Flexible Box），用来提供一个更加有效的方式制定、调整和分布一个容器里项目布局，即使它们的大小是未知或者动态的。

十四.组件之间的通讯

1.父传子

props传参：父组件中以标签的形式引入子组件，在子组件props传参，传入数据

2.子传父

父组件绑定一个事件，this.$emit触发事件并传递数据，子组件中通过事件名接受数据并处理。

3.兄弟组件传值

事件eventBus中间键传参

十五.js中的宏任务 （macrotask ）和微任务 （microtask ）

macrotask和microtask表示异步任务的两种分类，在挂起任务时，JS 引擎会将所有任务按照类别分到这两个队列中，首先在 macrotask 的队列（这个队列也被叫做 task queue）中取出第一个任务，执行完毕后取出 microtask 队列中的所有任务顺序执行；之后再取 macrotask 任务，周而复始，直至两个队列的任务都取完。

宏任务：setTimeout  setInterval  setImmediatex  requestAnimationFrame

微任务：process.nextTickx   MutationObserver  Promise.then catch finally

十六. vue项目中data为什么一定要是函数

因为在vue的组件化开发中，我们开发的组件需要不断的复用，但是如果data是一个对象，那么所有的数据都会变成公用的，但如果是一个函数，函数有自己独立的作用域，这样子每个data都是一个独立的，就不会相互影响了

十七.js中的reduce函数

 reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。

十八.awati/async和promise有什么不同吗？

    1.简洁：使用Async/Await明显节约了不少代码。我们不需要写.then，不需要写匿名函数处理Promise的resolve值，也不需要定义多余的data变量，还避免了嵌套代码

    2.错误处理，promise中的错误处理只能通过try catch去抛出，而在await/async中可以同时处理同步和一部错误

    3.循环语句，promise需要嵌套很多，

十九.uni-app中是如何区别小程序和APP的？

   条件编译    https://uniapp.dcloud.io/platform

uni.getSystemInfoSync().platform   判断是在哪个平台上编译的

二十.箭头函数与普通函数的区别

    1.箭头函数是匿名函数，不能作为构造函数，不能使用new

    2.箭头函数不绑定arguments，取而代之用rest参数...解决

    3.箭头函数不绑定this，会捕获其所在的上下文的this值，作为自己的this值

    4.箭头函数通过call()或 apply()方法调用一个函数时，只传入了一个参数，对this并没有影响。

    5.箭头函数的this永远指向其上下文的this，任何方法都改变不了其指向，如call(),bind(),apply()

    6.普通函数的this指向调用它的那个

js相关

1.如何区分数组还是对象

   原型判断： Array.prototype.isPrototypeof(obj)；若返回true，则是数组，否则为对象

2.split() join() 的区别

split()是将字符串切割成数组形式，join()是将数组转换成字符串

3.数组方法： 

        push()尾部添加

        pop()尾部删除

        unshift()头部添加

        shift()头部删除

3.call和apply的区别

①apply()函数有两个参数：第一个参数是上下文，第二个参数是参数组成的数组。如果上下文是null，则使用全局对象代替。

Object.call(this,obj1,obj2,obj3)

②call()的第一个参数是上下文，后续是实例传入的参数序列。

Object.apply(this,arguments)

4.事件委托是什么

利用事件冒泡的原理，让自己的所触发的事件，让他的父元素代替执行！

5.闭包的特新及其优缺点

  特性：

        a.函数嵌套函数。

        b.函数内部可以引用外部的参数和变量。

        c.参数和变量不会被垃圾回收机制回收。

优点：

    a.希望一个变量长期存储在内存中。

    b.避免全局变量的污染。

    c.私有成员的存在。

缺点：

    a.常驻内存，增加内存使用量。

    b.使用不当会很容易造成内存泄露。

闭包垃圾回收机制：内存泄漏出现原因；循环引用：简单来说假如a引用了b,b又引用了a,a和b就构成了循环引用。

回收机制方法：标记清除法，引用计数法

6.对于this的理解

    ①this总是指向函数的直接调用者（而非间接调用者）；

    ②如果有new关键字，this指向new出来的那个对象；

    ③在事件中，this指向触发这个事件的对象，特殊的是，IE中的attachEvent中的this总是指向全局对象Window；

7.form中的input可以设置为readonly和disable，请问2者有什么区别？

        readonly不可编辑，但可以选择和复制；值可以传递到后台

        disabled不能编辑，不能复制，不能选择；值不可以传递到后台

8.请说出三种优化页面加载时间的方法

        1、压缩css、js文件

        2、合并js、css文件，减少http请求

        3、外部js、css文件放在最底下

        4、减少dom操作，尽可能用变量替代不必要的dom操作

9.解释使用js实现AJAX的工作原理

         (1)创建XMLHttpRequest对象,也就是创建一个异步调用对象

         (2)创建一个新的HTTP请求,并指定该HTTP请求的方法、URL及验证信息

         (3)设置响应HTTP请求状态变化的函数

         (4)发送HTTP请求

         (5)获取异步调用返回的数据

         (6)使用JavaScript和DOM实现局部刷新

10.说一说你知道的前端本地存储

        cookies:可以设置访问域；可以设置存储时长，若没有设置时长cookies在浏览器退出时会结束；存储大小有限制，不同的浏览器存放大小不一样，一般为4KB；

        sessionStorage：关闭窗口后，sessionStorage即被销毁，或者在新窗口打开同源的另一个页面，sessionStorage也是没有的。

        localStorage：是永久存储，除非手动删除；

三者区别：

        localStorage只要在相同的协议、相同的主机名、相同的端口下，就能读取/修改到同一份localStorage数据。

        sessionStorage比localStorage更严苛一点，除了协议、主机名、端口外，还要求在同一窗口（也就是浏览器的标签页）下。

        localStorage是永久存储，除非手动删除。

        sessionStorage当会话结束（当前页面关闭的时候，自动销毁）

        cookie的数据会在每一次发送http请求的时候，同时发送给服务器而localStorage、sessionStorage不会。