1、移动端遇到的兼容问题
（1）安卓浏览器看背景图片，有些设备会模糊：
是devicePixelRatio在作怪；
解决：背景图代替img标签，背景图是原图2倍，background-size:contain
（2）手机中网页放大和缩小：
<metaname="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" />
（3）上下拉动滚动条时卡顿、慢
解决：body {-webkit-overflow-scrolling: touch; overflow-scrolling: touch;}
（4）长时间按住页面出现闪退
解决：element {-webkit-touch-callout:none;}
（5）iphone及ipad下输入框默认内阴影：
解决：element{-webkit-appearance:none;}
（6）ios和android下触摸元素时出现半透明灰色遮罩：
解决：element {-webkit-tap-highlight-color:rgba(255,255,255,0)}
（7）某些Android手机圆角失效：
解决：background-clip: padding-box;
（8）移动端点击300ms延迟：
解决：settimeout（）
2、http和https的区别
概念上：HTTP：是互联网上应用最为广泛的一种网络协议
HTTPS：是以安全为目标的HTTP通道，简单讲是HTTP的安全版
HTTPS和HTTP的区别主要如下：
1、https协议需要到ca申请证书，一般免费证书较少，因而需要一定费用。
2、http是超文本传输协议，信息是明文传输，https则是具有安全性的ssl加密传输协议。
3、http和https使用的是完全不同的连接方式，用的端口也不一样，前者是80，后者是443。
4、http的连接很简单，是无状态的；HTTPS协议是由SSL+HTTP协议构建的可进行加密传输、身份认证的网络协议，比http协议安全。
3、如何提高网页性能
（1）减少http请求次数
（2）减少DNS查找
（3）避免跳转
（4）缓存Ajax
（7）图片预加载，将样式表放在顶部，将脚本放在底部 加上时间戳。
（8）避免在页面的主体布局中使用table，table要等其中的内容完全下载之后才会显示出来，显示比div+css布局慢。
（9）减少DOM元素数量
（10）用域名划分页面
（11）减小iframe的大小
4、移动端的适配怎么做
（1）<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
（2）引入rem.js （innerWidth clientWidth）
5、什么是闭包？在开发项目时什么地方用闭包？
闭包是指有权访问另一个函数作用域中的变量的函数，创建闭包的最常见的方式就是在一个函数内创建另一个函数，通过另一个函数访问这个函数的局部变量；使用闭包主要是为了设计私有的方法和变量。闭包的优点是可以避免全局变量的污染，缺点是闭包会常驻内存，会增大内存使用量，使用不当很容易造成内存泄露。
闭包有三个特性：1.函数嵌套函数；2.函数内部可以引用外部的参数和变量；3.参数和变量不会被垃圾回收机制回收
闭包的用途
闭包可以用在许多地方。它的最大用处有两个，一个是前面提到的可以读取函数内部的变量，另一个就是让这些变量的值始终保持在内存中，不会在f1调用后被自动清除。
6、继承
1、原型链继承
2、构造继承
3、实例继承
4、拷贝继承
5、组合继承
6、寄生组合继承
7、jquery的优点
1、轻量级
2、强大的选择器
3、出色的DOM操作的封装
4、可靠的事件处理机制
5、完善的Ajax
6、不污染顶级变量
7、出色的浏览器兼容性
8、链式操作方式
9、隐式迭代
10、行为层与结构层的分离
11、丰富的插件支持
12、完善的文档
13、开源
8、调试是怎么做的
Weinre移动调试
DOM 断点
debugger断点
native方法hook
远程映射本地调试
Phostman runapi
9、本地存储localStore与sessionStorage的区别，都在什么地方使用？
localStorage的生命周期是永久性的。假若使用localStorage存储数据，即使关闭浏览器，也不会让数据消失，除非主动的去删除数据，使用的方法如上所示。localStorage有length属性，可以查看其有多少条记录的数据。
sessionStorage 的生命周期是在浏览器关闭前，如果关闭了浏览器数据就会消失
10、订单支付的实现
1.调取支付接口
2.后台参数封装，并进行签名
3.Map转XML
11、DOM执行事件流程
1.捕获阶段：先由文档的根节点document往事件触发对象，从外向内捕获事件对象；
2.目标阶段：到达目标事件位置（事发地），触发事件；
3.冒泡阶段：再从目标事件位置往文档的根节点方向回溯，从内向外冒泡事件对象。
12、scss和sass，less区别
1.编译环境不一样
2.变量符不一样，Less是@，而Scss是$，而且变量的作用域也不一样。
3.输出设置，Less没有输出设置，Sass提供4中输出选项：nested, compact, compressed 和 expanded。
4.Sass支持条件语句，可以使用if{}else{},for{}循环等等。而Less不支持。
5. 引用外部CSS文件
6.Sass和Less的工具库不同
13、伪类和伪元素的区别
伪类：用于向某些选择器添加特殊的效果
伪元素：用于将特殊的效果添加到某些选择器
区别：
伪类的效果可以通过添加一个实际的类来达到，而伪元素的效果则需要通过添加一个实际的元素才能达到
伪类用一个冒号来表示，而伪元素则用两个冒号来表示。
14、多维数组如何实现扁平化处理
1. Reduce
2. toString & split
3. join & split
4. 递归
5. 扩展运算符
16、JSONP原理
ajax请求受同源策略影响，不允许进行跨域请求，而script标签src属性中的链接却可以访问跨域的js脚本，利用这个特性，服务端不再返回JSON格式的数据，而是返回一段调用某个函数的js代码，在src中进行了调用，这样实现了跨域。
17、什么样的网站适合作响应式
1希望节省建站成本
2、希望网站能兼容新设备
3、看重网络营销
4、产品定位尚未明确
18、当git遇到冲突的解决方法
尽量选用id选择器和元素选择器:因为遇到这些选择器的时候,jquery会自动调用浏览器的原生方法比如(document.getElementById()),所以他们的执行速度快.
尽量不要使用 ".live()" 方法
这是jquery1.3.1版本之后新增加的方法,这个方法的功能就是为新增DOM元素绑定事件.但对于效率来说,这个方法比较占用资源
使用data()
尽量使用data()方法储存变量,因为这是jquery的内部函数 data()来存储状态.
19、前段工作流程
编写代码->单元测试->检查语法->整合代码->生成文档->压缩代码->部署测试环境->测试->发布。
20、tap事件的原理
tap事件的原理其实是源于触摸touch事件,在移动触摸事件就是在同个点触发,及touchmove的距离距离touchstar的距离为0,并且点击的时间不超过某个设定的时间值,超过该时间值的话,就属于长按了
21、懒加载原理
原理：先将img标签中的src链接设为同一张图片（空白图片），将其真正的图片地址存储再img标签的自定义属性中（比如data-src）。当js监听到该图片元素进入可视窗口时，即将自定义属性中的地址存储到src属性中，达到懒加载的效果。
这样做能防止页面一次性向服务器响应大量请求导致服务器响应慢，页面卡顿或崩溃等问题。
22、移动端的fastclick怎么实际使用
一般情况下，如果没有经过特殊处理，移动端浏览器在派发点击事件的时候，通常会出现300ms左右的延迟。也就是说，当我们点击页面的时候移动端浏览器并不是立即作出反应，而是会等上一小会儿才会出现点击的效果。在移动WEB兴起的初期，用户对300ms的延迟感觉不明显。但是，随着用户对交互体验的要求越来越高，现今，移动端300ms的点击延迟逐渐变得明显而无法忍受。
23、原生ajax的步骤
1、创建一个Ajax对象
2、连接到服务器
3、发送请求
4、接收返回值
5、接受服务器返回的数据
25、GET和POST的区别？
1.GET（从服务器获取）
2.POST（向服务器发送请求数据）
3.GET被浏览器强制支持（POST是可选的，不过一般都支持）
4.GET是幂等的，POST非幂等
5.GET可以被浏览器缓存，POST不可以
6.GET请求是『不安全』的，POST安全
7.POST相对来说比GET要『安全』一些
8.参数大小（理想和现实）
26、可以改变this指向的方法
1.通过对象的方法来定义一个函数（谁绑定了我，我就指向谁）
2.函数被new了一下，创建了新的对象，this指向新的对象（谁new了我，我就指向谁）
3.通过call,apply改变this指向
27、盒子居中的方法
1、正常：margin{margin:0px auto}
2、绝对定位：position:absolute;top:150px;left:50%;margin-left:-xxx px;xxx是div的宽度数值。
3、fixed定位同绝对定位一样，只不过将position的absolute换成fixed。
4、absolute，和fixed的居中定位一般实现对于屏幕正中央来说，如果是div深层次的居中要视情况来编写居中样式
28、vue-router的原理？catch方法的实现原理？
1.Hash: 通过改变hash值
2.History: 利用history对象新特性
29、git和svn的区别
1) 最核心的区别Git是分布式的，而Svn不是分布的。
2)Git把内容按元数据方式存储，而SVN是按文件
3) Git没有一个全局版本号，而SVN有
4) Git的内容的完整性要优于SVN
5) Git下载下来后，在OffLine状态下可以看到所有的Log,SVN不可以。
6) 刚开始用时很狗血的一点，SVN必须先Update才能Commit,忘记了合并时就会出现一些错误，git还是比较少的出现这种情况。
7) 克隆一份全新的目录以同样拥有五个分支来说，SVN是同时复製5个版本的文件,也就是说重复五次同样的动作
8) 版本库（repository):SVN只能有一个指定中央版本库。
9)分支（Branch）在SVN，分支是一个完整的目录。
10)提交（Commit）在SVN，当你提交你的完成品时，它将直接记录到中央版本库。
30、vue计算属性和watch的区别
计算属性：用于简单场合，比如计算，合并字符串等；
watch属性：用于耗时的，可以异步的获取远程服务上的数据这样的操作。
31：Vue的优势？
简单：将Vue添加到现有的Web项目相对简单，只要您熟悉HTML和JavaScript，就可以熟练的操作起来，这对于快速开发团队来说是一个很大的优势。
灵活：使用Vue，您可以快速编写应用程序并直接从浏览器运行应用程序，或者如果需要，可以使用ES6，JSX，组件，路由，捆绑等构建复杂的应用程序。
这是一个稳定的渐进式框架
易于学习和理解
简单而灵活使用MVVM架构
提供全面的文档关注组织/项目架构可用于简单和复杂的应用程序
国家管理简单直观提供了多种使用过渡效果的方法
与React或Angular相比，它是一个轻量级框架（大小约20-30kb）
为什么要使用Vue？
我们把HTML中的DOM就可以与其他的部分独立开来划分出一个层次，这个层次就叫做视图层
Vue 的核心库只关注视图层
32：MVVM是什么？
MVVM 模式，顾名思义即 Model-View-ViewModel 模式
一句话总结 Web 前端 MVVM：操作数据，就是操作视图，就是操作 DOM（所以无须操作 DOM ）
开发者在 View 层的视图模板中声明 数据绑定、 事件绑定 后，在 ViewModel 中进行业务逻辑的 数据 处理。事件触发后，ViewModel 中 数据 变更， View 层自动更新。
33：对vuex的理解
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式；集中存储和管理应用的所有组件状态
总结：Vuex就是在一个项目中，提供唯一的管理数据源的仓库。
34：Vue seo优化
首先，可以肯定的是前后端分离不利于SEO，为什么呢？
1. 搜索引擎的基础爬虫的原理就是抓取你的url，然后获取你的html源代码并解析。 而你的页面通常用了vue等js的数据绑定机制来展示页面数据，爬虫获取到的html是你的模型页面而不是最终数据的渲染页面，所以说用js来渲染数据对seo并不友好。
2. seo 本质是一个服务器向另一个服务器发起请求，解析请求内容。但一般来说搜索引擎是不回去执行请求到的js的。也就是说，如果一个单页应用，html在服务器端还没有渲染部分数据数据，在浏览器才渲染出数据，而搜索引擎请求到的html是没有渲染数据的。 这样就很不利于内容被搜索引擎搜索到。 所以服务端渲染就是尽量在服务器发送到浏览器前 页面上就是有数据的。
所以说，即使是像vue这种前后端分离开发的网站，我们还是能够通过其他技术解决seo问题的。
常用的解决方案有三种：
1. 页面预渲染
2. 服务端渲染
3. 路由采用h5 history模式
35：vue服务端渲染
简单说：比如说一个模板，数据是从后台获取的，如果用客户端渲染那么浏览器会先渲染html和css，然后再通过js的ajax去向后台请求数据再更改渲染。就是在前端再用Node建个后台，把首屏数据加载成一个完整的页面在node建的后台渲染好，浏览器拿到的就是一个完整的dom树。根据项目打开地址，路由指到哪个页面就跳到哪。
36 :es6和ea5的区别
· ES6中的let命令，声明变量，用法和var差不多，但是let是为JavaScript新增了块级作用域，ES5中是没有块级作用域的，并且var有变量提升的概念，但是在let中，使用的变量一定要进行声明；
· ES6中变量的结构赋值，比如：var [a,b,c] = [0,1,2];
· ES6中不再像ES5一样使用原型链实现继承，而是引入Class这个概念，听起来和Java中的面向对象编程的语法有些像，但是二者是不一样的。
· ES6中的函数定义也不再使用关键字function，而是利用了=>来进行定义；
· ES6中可以设置默认函数参数，如function A（x,y=9）{};
总之，ES6还有许多新的标准出现，但是像jQuery一样，对js的一些内容好像进行了封装一样，所以即使ES6将会更火，ES5中的标准和一些基础还是需要学习，标准的不断更新也是因为开发过程中，开发者们逐渐追求简单快捷的开发，就像是框架的兴起，同样是为了解决开发速率的迟缓，但是在基础的学习中，掌握原理是十分必要的，只有基础掌握的足够扎实，框架用起来也才能更加顺手。
37：webpack按需加载
默认使用 require('echarts') 得到的是已经加载了所有图表和组件的 ECharts 包，因此体积会比较大，如果在项目中对体积要求比较苛刻，也可以只按需引入需要的模块。
例如上面示例代码中只用到了柱状图，提示框和标题组件，因此在引入的时候也只需要引入这些模块，可以有效的将打包后的体积从 400 多 KB 减小到 170 多 KB。
38：常用的loader浏览器
css-loader : 解析css文件中代码
style-loader : 将css模块作为样式导出到DOM中
less-loader : 加载和转义less文件
sass-loader : 加载和转义sass/scss文件
babel-loader : 加载ES6+ 代码后使用Babel转义为ES5后浏览器才能解析
vue-loader : 加载和转义vue组件
39：promise（语法糖）
对象状态不受外界的影响，有三种状态：Pending, Resolved, Rejected. 异步操作的结果决定当前是哪一种状态，其他操作无法改变这个状态
一旦状态改变就不会再变。Promise对象的状态改变只有两种：从Pending变为Resloved 和 从Pending变为Rejected
40如何实现异步编程
1.回调函数
2.事件监听
3.Promises对象
4.发布/订阅(观察者模式)
41.vue组件有多少个生命周期
1、beforeCreate
在实例初始化之后，数据观测和event/watcher时间配置之前被调用。
2、created
实例已经创建完成之后被调用。
3、beforeMount
在挂载开始之前被调用
4、mounted
该钩子在服务端渲染期间不被调用。
5、beforeUpdate
数据更新时调用。
6、updated
由于数据更改导致的虚拟DOM重新渲染和打补丁，在这之后会调用该钩子。
7、activated
keep-alive组件激活时调用。
8、deactivated
keep-alive组件停用时调用。
9、beforeDestroy
实例销毁之间调用。
10、destroyed
Vue实例销毁后调用。
42：vue组件之间传递数据怎么实现？
在 Vue 中，可以使用 props 向子组件传递数据。
父传子
父组件：通过绑定callback属性，将方法传给子组件
子组件：通过props获取父组件传过来的callback方法
子传父 子组件中用$emit事件触发 父组件中用$on接收
非父子： 用$emit触发 $on监听 需要建立bus.js作为数据的中转站，否则数据将无法进行传输
42:vue双向数据绑定的实现原理
vue是通过数据劫持的方式来做数据绑定的,其中最核心的方法便是通过Object.defineProperty()来实现对属性的劫持.
vue.js的双向数据绑定就是通过Object.defineProperty方法实现的，俗称属性拦截器。
43：渐进增强和优雅降级
答：渐进增强（Progressive Enhancement）：一开始就针对低版本浏览器进行构建页面，完成基本的功能，然后再针对高级浏览器进行效果、交互、追加功能达到更好的体验。
优雅降级（Graceful Degradation）：一开始就构建站点的完整功能，然后针对浏览器测试和修复。比如一开始使用 CSS3 的特性构建了一个应用，然后逐步针对各大浏览器进行 hack 使其可以在低版本浏览器上正常浏览。
44：事件代理的原理
答：委托到底是一个什么原理：
有三个同事预计会在周一收到快递。为签收快递，有两种办法：一是三个人在公司门口等快递；二是委托给前台MM代为签收。现实当中，我们大都采用委托的方案（公司也不会容忍那么多员工站在门口就为了等快递）。前台MM收到快递后，她会判断收件人是谁，然后按照收件人的要求签收，甚至代为付款。这种方案还有一个优势，那就是即使公司里来了新员工（不管多少），前台MM也会在收到寄给新员工的快递后核实并代为签收。
这里其实还有2层意思的：
第一，现在委托前台的同事是可以代为签收的，即程序中的现有的dom节点是有事件的；
第二，新员工也是可以被前台MM代为签收的，即程序中新添加的dom节点也是有事件的。
答：事件委托原理：事件冒泡机制。
优点：1.可以大量节省内存占用，减少事件注册。比如ul上代理所有li的click事件就很不错。
2.可以实现当新增子对象时，无需再对其进行事件绑定，对于动态内容部分尤为合适
缺点：事件代理的常用应用应该仅限于上述需求，如果把所有事件都用事件代理，可能会出现事件误判。即本不该被触发的事件被绑定上了事件