1、JS的数据类型只有浮点型，没有整型。
null,underfined,boolean,number,string,symbol
typeof对于基本数据类型，除了null都能正常表达其类型。
2、隐式类型转换
underfined,null,false,NaN,'',0 为false
其它为true
3、调用new 操作执行哪些步骤：
1.新生成了一个对象，
2.链接到原型
3.绑定this
4.返回新对象
4、实例对象和构造函数之间的关系？
构造函数实例化产生实例
1.实例对象：
实例对象中只有proto属性，所有的实例都指向自己构造函数的原型。proto属性里面有构造器construction和proto。
构造器指向原型所属的构造函数，proto属性指向Object的原型。
2.构造函数：
构造函数里面有俩个属性proto和prototype属性，原型属性prototype本质上该属性就是对象（Object的实例对象）。proto指向Function。
5、如何判断对象是不是这个数据类型
1.通过构造器的方式，实例对象的构造器constructor==构造函数名字
2.instanceof构造函数的名字(instanceof可以正确的判断对象的类型，因为内部机制是通过判断对象的原型链中是不是能找到类型的 prototype)
6、原型的作用：
1.解决数据共享，节省内存空间
2.不需要共享的函数写在构造函数里，需要共享的数据写在原型里(感觉像废话)
7、闭包方面，为什么函数A已经弹栈了，为什么函数B还能引用函数A中的变量？
答：因为函数A中的变量这时候已经存储在堆中，现在JS引擎可以通过逃逸分析辨别出哪些变量需要存储在堆上，哪些需要存储在栈上。
*闭包的常用场景：轮播图、模块就是闭包
8、CommonJS和ES6中的模块化的两者区别：
1.前者支持动态导入，也就是 require(${path}/xx.js)，后者目前不支持，但是已有提案
2.前者是同步导入，因为用于服务端，文件都在本地，同步导入即使卡住主线程影响也不大。而后者是异步导入，因为用于浏览器，需要下载文件，如果也采用导入会对渲染有很大影响
3.前者在导出时都是值拷贝，就算导出的值变了，导入的值也不会改变，所以如果想更新值，必须重新导入一次。但是后者采用实时绑定的方式，导入导出的值都指向同一个内存地址，所以导入值会跟随导出值变化
4.后者会编译成 require/exports 来执行的

9、函数防抖：
1.如果在频繁的事件回调中做复杂计算，很有可能导致页面卡顿，不如将多次计算合并为一次计算，只在一个精确点做操作，可以实现一个按钮的防二次点击操作。
2.函数防抖的实现思路：
一旦我开始一个定时器，只要我定时器还在，不管你怎么点击都不会执行回调函数。一旦定时器结束并设置为 null，就可以再次点击了。
3.函数节流：
防抖动和节流本质是不一样的。防抖动是将多次执行变为最后一次执行，节流是将多次执行变成每隔一段时间执行。
10、call,apply,bind区别：
1.call、apply和bind是Function对象自带的三个方法，都是为了改变函数体内部 this 的指向。
2.apply 、 call 、bind 三者第一个参数都是 this 要指向的对象，也就是想指定的上下文；
3.apply 、 call 、bind 三者都可以利用后续参数传参；
4.bind 是返回对应 函数，便于稍后调用bind() 方法会创建一个 新函数，称为绑定函数，当调用这个绑定函数时，绑定函数会以创建它时传入 bind() 方法的第一个参数 作为 this，传入 bind() 方法的 第二个以及以后的参数加上绑定函数运行时本身的参数按照顺序作为原函数的参数来调用原函数。
5.apply 、call 则是立即调用 。
对于 apply、call 二者而言，作用完全一样，只是接受 参数 的方式不太一样。call 是把参数按顺序传递进去，而 apply 则是把参数放在数组里。
11、V8 下的垃圾回收机制：
1.V8 实现了准确式 GC，GC 算法采用了分代式垃圾回收机制。因此，V8 将内存（堆）分为新生代和老生代两部分。
2.新生代算法：新生代中的对象一般存活时间较短，使用 Scavenge GC 算法。
3.老生代算法：老生代中的对象一般存活时间较长且数量也多，使用了两个算法，分别是标记清除算法和标记压缩算法。
12、跨域：
1.因为浏览器出于安全考虑，有同源策略。也就是说，如果协议、域名或者端口有一个不同就是跨域，Ajax 请求会失败。
2.JSONP：
JSONP 的原理很简单，就是利用 <script> 标签没有跨域限制的漏洞。通过<script> 标签指向一个需要访问的地址并提供一个回调函数来接收数据当需要通讯时。但是只限于 get 请求。
3.CORS：
CORS 需要浏览器和后端同时支持。IE 8 和 9 需要通过 XDomainRequest 来实现。浏览器会自动进行 CORS 通信，实现 CORS 通信的关键是后端。只要后端实现了CORS，就实现了跨域。服务端设置 Access-Control-Allow-Origin 就可以开启CORS。该属性表示哪些域名可以访问资源，如果设置通配符则表示所有网站都可以访问资源。
13、浏览器的渲染机制过程：
1.处理 HTML 并构建 DOM 树。
2.处理 CSS 构建 CSSOM 树。
3.将 DOM 与 CSSOM 合并成一个渲染树。
4.根据渲染树来布局，计算每个节点的位置。
5.调用 GPU 绘制，合成图层，显示在屏幕上
14、重绘和回流：
1.重绘和回流是渲染步骤中的一小节，但是这两个步骤对于性能影响很大；
2.重绘是当节点需要更改外观而不会影响布局的，比如改变 color 就叫称为重绘；
3.回流是布局或者几何属性需要改变就称为回流；
4.回流必定会发生重绘，重绘不一定会引发回流。回流所需的成本比重绘高的多，改变深层次的节点很可能导致父节点的一系列回流；
5.很多人不知道的是，重绘和回流其实和 Event loop 有关；
6.常用优化方式：使用 translate 替代 top;不要使用 table 布局; CSS 选择符从右往左匹配查找，避免 DOM 深度过深
15、缓存
1.通常浏览器缓存策略分为两种：强缓存和协商缓存。
2.在一次js请求中一般会产生cdn缓存、dns缓存、浏览器缓存、服务器缓存
16、存储
cookie，localStorage，sessionStorage，indexDB
*扩展indexedDB
{localstorage就是专门为小数量数据设计的，所以它的api设计为同步的。而IndexedDB很适合存储大量数据，它的API是异步调用的。IndexedDB使用索引存储数据，各种数据库操作放在事务中执行。IndexedDB甚至还支持简单的数据类型。IndexedDB比localstorage强大得多，但它的API也相对复杂。对于简单的数据，你应该继续使用localstorage，但当你希望存储大量数据时，IndexedDB会明显的更适合，IndexedDB能提供你更为复杂的查询数据的方式.}
17、DNS 预解析
预解析的方式预先获得域名所对应的 IP。
<link rel="dns-prefetch" href="//">
18、预加载
预加载其实是声明式的 fetch ，强制浏览器请求资源，并且不会阻塞 onload 事件，可以使用以下代码开启预加载
<link rel="preload" href="http://">
19、预渲染
可以通过预渲染将下载的文件预先在后台渲染，可以开启预渲染
<link rel="prerender" href="http://">
20、懒执行
懒执行就是将某些逻辑延迟到使用时再计算。该技术可以用于首屏优化，对于某些耗时逻辑并不需要在首屏就使用的，就可以使用懒执行。懒执行需要唤醒，一般可以通过定时器或者事件的调用来唤醒。
21、懒加载
懒加载就是将不关键的资源延后加载。
懒加载的原理就是只加载自定义区域（通常是可视区域，但也可以是即将进入可视区域）内需要加载的东西。对于图片来说，先设置图片标签的 src 属性为一张占位图，将真实的图片资源放入一个自定义属性中，当进入自定义区域时，就将自定义属性替换为 src 属性，这样图片就会去下载资源，实现了图片懒加载。懒加载不仅可以用于图片，也可以使用在别的资源上。比如进入可视区域才开始播放视频等等。
22、关系型数据库如Mysql、Oracle等将数据存储在表中，而非关系型数据库如Redis、MongoDB等将数据集作为个体对象存储。
23、图片加载优化
1.小图使用 base64 格式
2.将多个图标文件整合到一张图片(精灵图)
3.WebP 格式
4.小图使用PNG,图标使用svg，照片用jpeg
24、CDN
静态资源尽量使用CDN加载，由于浏览器对于单个域名有并发请求上限，可以考虑使用多个CDN 域名。对于CDN加载静态资源需要注意CDN域名要与主站不同，否则每次请求都会带上主站的Cookie。
25、如何渲染几万条数据并不卡住界面：
可以使用setInterval和setTimeout、requestAnimationFrame来实现定时分批渲染，每16ms刷新一次。
*扩展：requestAnimationFrame
{requestAnimationFrame跟setTimeout/setInterval差不多，不过不需要设置时间间隔，它的时间间隔为最佳刷新频率16.6ms；通过递归调用同一方法来不断更新画面以达到动起来的效果，但它优于setTimeout/setInterval的地方在于它是由浏览器专门为动画提供的API，在运行时浏览器会自动优化方法的调用，并且如果页面不是激活状态下的话，动画会自动暂停，有效节省了CPU开销。}
26、电商网站如何防范跨站请求伪造：
1.Get 请求不对数据进行修改
2.不让第三方网站访问到用户Cookie
3.阻止第三方网站请求接口
4.请求时附带验证信息，比如验证码或者token
27、前端路由的方式：
1.hash模式，当##后面的hash值发生变化时，不会向服务器请求数据，可以通过hashchange事件来监听到URL的变化，从而进行跳转页面。
2.history 模式，History模式是HTML5新推出的功能，没有#号，比之HashURL 更加美观。
28、Virtual—Dom（虚拟DOM）
操作DOM是很耗费性能的一件事情，既然如此，我们可以考虑通过JS对象来模拟DOM对象，毕竟操作JS对象比操作DOM省事的多。
29、（关于算法的面试题应该归于扩展）时间复杂度：O(n)
30、树的递归,如何判断属性的更改。
1.遍历旧的属性列表，查看每个属性是否还存在于新的属性列表中
2.遍历新的属性列表，判断两个列表中都存在的属性的值是否有变化
3.在第二步中同时查看是否有属性不存在与旧的属性列列表中
31、判断列表差异算法实现
1.遍历旧的节点列表，查看每个节点是否还存在于新的节点列表中
2.遍历新的节点列表，判断是否有新的节点
3.在第二步中同时判断节点是否有移
32、遍历子元素打标识
1.判断两个列表差异
2.给节点打上标
33、渲染差异
1.深度遍历树，将需要做变更操作的取出来
2.局部更新DOM
34、Virtual Dom 算法的实现也就是以下三步
1.通过JS来模拟创建DOM对象
2.判断两个对象的差异
3.渲染染差
35、display:none 和 visibility:hidden 的区别？
1.display:none 是彻底的消失 不占文档流 浏览器不会解析 会产生回流
2.visibility:hidden 是视觉上的消失 占文档流 浏览器会解析 不会产生回流(重绘)
36、jq中找到所有与元素的同级元素需要用到: $('.box').sibilings()
37、懒加载:
1.原理:现将img标签中的src链接设置为同一张空白图片，将其真正的图片地址存储在自定义属性中(data-src)
2.JS监听该图片元素进入到可视区域时,将其自定义属性中的值存储到src属性中，达到懒加载的效果
3.好处:防止页面一次性向服务器响应大量请求导致服务器响应慢，页面卡顿等问题
38、状态管理:
概念:它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式管理。
39、什么时候使用vuex?
开发大型单页应用(Flux 架构就像眼镜：您自会知道什么时候需要它)
40、promise模拟计时器？

let start = new Date();
console.log(`start: ${start}`);
setTimeout(()=>{
console.log('This line will be log in 3 seconds?');
console.log(`end : ${new Date()}`);
}
, 3000);
while (true) {
if ((+start + 5000) < +new Date()) {
return;
}
}

41、promise回调并发?
1.回调并发:又叫回调地狱,异步调用一般分为两个阶段,提交请求和处理结果,这两个阶段之间有时间循环的调用,它们属于两个不同的事件循环,彼此没有关联
2.异步调用一般以传入callback的方式来指定异步操作完成后要执行的动作。而异步调用的本体和callback属于不同的时间循环
3.处理方法: try...catch语句只能捕获当前事件循环的异常,对callback无能为力；也就是说,一旦我们在异步调用函数中扔出一个I/O请求,异步调用函数立即返回,此时,这个异步调用的函数和这个异步I/O请求没有任何关系
42、Ajax处理前后台交互?

                function ajax(options){
                    //-1 整理options
                    options=options||{};
                    options.data=options.data||{};
                    options.timeout=options.timeout||0;
                    options.type=options.type||'get';
                    
                    //0 整理data
                    var arr=[];
                    for(var key in options.data){
                        arr.push(key+'='+encodeURIComponent(options.data[key]));    
                    }
                    var str=arr.join('&');
                    
                    //1 创建ajax对象
                    if(window.XMLHttpRequest){
                        var oAjax=new XMLHttpRequest();//[object XMLHttpRequest]
                    }else{
                        var oAjax=new ActiveXObject('Microsoft.XMLHTTP')
                    }
                    
                    if(options.type=='get'){
                        //2.
                        oAjax.open('get',options.url+'?'+str,true);
                        //3.
                        oAjax.send();
                    }else{
                        //2.
                        oAjax.open('post',options.url,true);
                        //设置请求头
                        oAjax.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
                        oAjax.send(str);//身子
                    }
                    //3.5   超时
                    if(options.timeout){
                        var timer=setTimeout(function(){
                            alert('超时了');
                            oAjax.abort();//中断ajax请求    
                        },options.timeout);
                    }
                    //4.
                    oAjax.onreadystatechange=function(){//当准备状态改变时
                        if(oAjax.readyState==4){//成功失败都会有4
                            clearTimeout(timer);
                            if(oAjax.status>=200 && oAjax.status<300 || oAjax.status==304){
                                options.success && options.success(JSON.parse(oAjax.responseText));
                            }else{
                                options.error && options.error(oAjax.status);//http 0
                            }
                        }
                    };
                    
                    
                };
        

43、H5的新增标签? css3的新特性?
H5: <header> <section> <article> <aside> <mask> <canvas> <footer> <nav>
css3: border-shadow border-image border-radius
background-size background-origin(规定背景图片定位区域)
text-shadow
transform:translate()/rotate()
44、闭包
定义:闭包就是能够读取其他函数内部变量的函数,也可以说是一个定义在一个函数内部的函数
本质:链接函数内部与函数外部的桥梁
缺点:1.会使函数内部的变量保存在内存中,内存消耗很大,所以不能滥用
2.闭包会在父函数的外部,改变父函数内部变量的值
45、跨域问题？
含义:同协议,同域名,同端口,有一个不满足都存在跨域问题
解决办法:Jsonp Ajax CORS Nginx反向代理 后台用SpringMVC
46、ES6的新特性?
引入了块级作用域 {}
const命令 用来定义常量
解构赋值 let [a,b,c] = [1,2,3]
箭头函数 ()=>{}
数组的扩展 [...arr1]
Symbol函数 具有唯一性
set/map遍历
Promise---异步
class类
47、箭头函数与普通函数this的指向问题?
普通函数：this总是代表它的直接调用者 obj.fun ---> obj
在默认情况下，没有直接调用者, 指向window
在严格模式下,没有直接调用者,指向undefine
使用call,apply,bind,this指向绑定的对象
箭头函数: 默认指向定义它时,它所处的对象,而不是执行时的对象 定义它的时候，可能环境处于window(即继承父级的this)
48、vuex的双向绑定原理?
采用了数据劫持结合发布者-订阅者模式的方式,通过Object.defineProperty()来劫持各个属性是setter,getter,在数据变动时发布消息给订阅者并触发相应的监听回调
49、在网页中会引用那些常见的静态资源?
JS
.js .jsx .coffee .ts
CSS
.css .scss .less .stylus
Image
.jpg .png .gif .bmp .svg .ttf .webp
字体文件
.svg .btf .eot .woff .woff2
模板文件
.ejs .jade .vue(webpack定义组件的方式)
50、过多的静态资源对页面有什么影响?
问题：页面加载速度过慢, 因为我们会多次发送二次请求
要处理错综复杂的依赖关系
解决方法：合并 压缩 精灵图 图片base64编码 使用webpack
51、节点绑定失效: 那就在事件绑定之前,给该节点的父节点绑定事件
52、生命周期函数:
Vue: 初始化: beforeCreate created(获取数据) beforeMount Mounted(获取节点)
进行中: beforeUpdata upDated
销 毁: beforeDistory Distoryed
React: 初始化: getDefaultProps getInitialState componentWillMount(获取数据) render(渲染虚拟DOM) componentDidMount
进行中: componentWillReceiveProps shouldComponentUpdate componentWillUpdate render componentDidUpdate
卸 载: componentWillUnmount
53、前端性能的优化:
减少http请求的次数
将样式表放在顶部
将脚本放在底部
避免css表达式
使用外部Js以及css
减少DNS查找
精简js
使ajax可缓存
54、本地对象、内置对象、宿主对象?
本地对象: arrary object 等可以new实例化的
内置对象: gload math 等不可以实例化的
宿主对象: window document 等浏览器自带的
55、vue组件之间的信息传递?
父 ---> 子: 父向子传递数据是通过props 父组件绑定属性，子组件props接收
子 ---> 父: 通过绑定方法on 父组件向子组件传递方法,子组件用$emit接收可以直接调用
同级之间的传递: 1.使用一个空的vue实例作为中央事件总线
2. 使用vuex
56、vue修改data数据并且实时显示?
1. 首先定义一个变量
2. 给变量赋值
实时显示: 利用vue.set(data,"改变的属性名",属性值val)

        var acticleVal = null;
        
        articleVal = new Vue({
            el:'app',
            data:{
                article:msg
            }
        })

        var datas = [{id:1,book:"活着"},{id:2,book:'小王子'}]
        articleVal.$data.article = datas
        
        <div v-for = 'v in article' :key='v.id'>{v.book}</div>

57、eval():
主要是计算js字符串,并把它作为脚本来执行
58、node.js的使用场景?
RESTFUL API 实时聊天 以及客户端逻辑强大的单页app
59、call()和apply()的区别?
call:可以接受多个参数,第一个参数是this,后面则是一串参数列表
apply: 最多只能接受两个参数, 第一个是this,第二个是数组,所以传多个参数的话要放在数组里
因此 : apply和call的功能是一样的,只是传入参数的形式不一样
60、ajax是什么? ajax的交互模型? 同异步的区别? ajax解决跨域?
1.ajax:是异步的js和xml。通过在后台与服务器进行少量数据交换,ajax可以使页面实现异步更新。意味着可以不重新加载整个页面,而对页面 某部分进行更新
2.交互流程: 获取XMLHttpRequest对象---> open 开启url通道,设置异步传输 ---> send 发送数据 ---> 服务端接收数据并处理并返回结果 ---> 客户端接收返回数据
3. 同步: 脚本会停留并且等待服务器发送恢复然后在继续
异步: 脚本允许页面继续其进程并处理可能的回复
4.ajax解决跨域:

1. web代理 A网站与B网站需建立紧密协作的关系，A网站服务器负担会增加 并且无法带用户保存session状态
   2. on - Demand方式 通过动态修改script属性完成对跨域页面的调用
   3. iframe方式
   4. 用户本地存储方式
   61、改变浏览器地址，但不发送请求的两种方式:
   1.在地址中加#，用来欺骗浏览器 地址的改变值由于正在进行页内导航
   2.使用h5中window.history功能,使用url的hash来模拟完整的url

62、虚拟Dom?
用js对象的形式来模拟页面上DOM嵌套关系(以js对象的形式存在的)
本质: 用Js对象，来模拟DOM元素和嵌套关系
目的: 为了实现页面中，DOM元素的高效更新
63、DOM和虚拟DOM的区别?
1.DOM: 浏览器中,提供的概念,用JS对象,表示页面上的元素,并提供了操作元素的API
2.虚拟DOM:是框架中的概念,是开发框架的程序员,手动用JS对象模拟DOM元素和嵌套关系
64、MVC与MVVM区别?
1.MVC: 允许在不改变视图的情况下改变视图对用户输入的响应式
2.用户View操作交给了Controller处理,在Controller中响应View的事件调用Model的接口对数据进行操作,一旦model变化相关视图也会跟着更新
3.MVVM:是"数据模型数据双向绑定"的思想为核心,所以view和model之间没有联系，通过ViewModel进行交互
4.区别: mvvm 与mvc 最大的区别是它实现了view和model的自动同步,也就是当model的属性改变时,我们不用再自己手动操作dom元素,来改变view的显示,而是改变属性后该属性对应的View层显示也会跟着变化
65、vue的理解?
1.Vue.js 不是一个框架 它只聚焦视图层,是一个构建数据驱动的Web界面库
2.优点: 1. 轻量 体积小,不依赖其他的基础库
2. 数据绑定
3. 指令 类似angular,可以用一些内置的简单指令
4. 插件化 不包括Router,ajax表单验证,但可方便的加载对应插件
67、框架间的对比?
1.生命周期
2.渲染机制: vue 用的是基于html语法的模板 允许开发者声明式的将Dom绑定到vue的底层实例上
3.核心: Vue.js是一个允许你采用简洁的模板语法来声明式的将数据渲染进Dom系统里
4.react 是将html语法直接写在Js语法中, 不加任何引导, 这就是JSX语法 允许Html与Js混写
5.状态管理机制: vue 是用vuex来进行状态管理的
6.react redux react-redux redux-thunk prop-types
68、双向数据绑定?
基于ES5中的defineProperty来实现的,支持IE9
69、双向数据流?
js内存属性发生改变,影响页面变化
页面的改变影响js内存属性的改变
70、react的理解?
react的三个关键字:
1. just the ui 负责ui层面的表现,它把ui拆分成组件,并且引入了Jsx语法,使它更容易拓展和维护
2. virtual dom 减少真实dom的操作,提高了性能
3. data flow react的数据流是从组件树从上到下单向流动
4. redux
71、作用域链?
1.作用域: 变量所使用的范围称为作用域
2.全局作用域: 定义在函数外的变量会被保存在全局作用域中，且能够能够被其他作用域访问和修改
3.局部作用域: 声明在函数内, 且变量之间彼此不能访问
4.作用域链: 用于解析变量, 当解析一个变量的时候js开始从最内层沿着父级寻找所需的变量或其他资源
5.包含自己执行环境以及所有父级环境中包含的变量
71、json数据格式?
1.是前端数据交互的常用格式，一般是数组格式和对象格式
2.json.parse(转json) json.stringify(转成字符串)
3.eval('('+ data +')')(转成json)
72、动态创建元素绑定不上事件?
1.dom没有跟着渲染出来
73、vuex解决跨域?
1.跨域代理表 proxy
2.找到config文件夹下的index.js配置proxyTable

            proxyTable:{
                '/api':{
                    target:'http://api.xxxxxxxxxx.com',
                    changeOrigin:true,
                    pathRewrite:{
                        '^/api':'/api'
                    }
                }
            }
// 说明配置中target后面的内容为后端人员提供的数据接口
// 原理类似vpn做了一个中转，Node替你去接口请求数据

3. 调用

    this.$http.get('/api/login.json').then((data)=>{
        console.log(data)
    })

74、事件委托?
1.把子元素上的事件放在父元素身上称为事件委托
2.利用事件冒泡原理
75、数组的常用方法?
1.indexOf() 返回数组中可以找到一个给定元素的第一个索引,如果不存在,则返回-1
2.join() 将数组中的所有元素连接到一个字符串中
3.map() 创建一个新数组,其结果是该数组中的每个元素都调用了一个提供的函数的后返回的结果；指"映射",对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组
4.forEach() 对数组进行遍历循环,对数组中的每一项运行给定函数,这个方法没有返回值。
参数都是function类型,默认有传参,参数分别为:遍历的数组内容;第对应的数组索引,数组本身
5.reduce() 累加器
6.some() 测试数组中的某些元素是否通过由提供的函数实现的测试
7.sort() 当地位置对数组元素进行排序,并返回数组
8.slice() 返回一个从开始到结束(不包括结束)选择的数组的一部分浅拷贝到一个新的数组中
9.spice() 可以实现删除插入替换
1.删除任意数量的项,只需指定 2 个参数:要删除的第一项的位置和要删除的项数。
例如,splice(0,2)会删除数组中的前两项
2.可以向指定位置插入任意数量的项，只需提供 3 个参数：起始位置、 0（要删除的项数）和要插入的项。
例如，splice(2,0,4,6)会从当前数组的位置 2 开始插入4和6。
3.可以向指定位置插入任意数量的项，且同时删除任意数量的项，只需指定 3 个参数：起始位置、要删除的项数和要插入的任意数量的项。插入的项数不必与删除的项数相等。
例如，splice (2,1,4,6)会删除当前数组位置 2 的项，然后再从位置 2 开始插入4和6
76、字符串常用的方法?
1.str.substring(start,end) 两个参数都为正数,返回值:[start,end) 也就是说返回从start到end-1的字符
　　 2.str.slice(start,end) 两个参数可正可负,负值代表从右截取,返回值:[start,end) 也就是说返回从start到end-1的字符
3.str.split(separator,limit)参数1指定字符串或正则，参照2指定数组的最大长度
4.str.replace(rgExp/substr,replaceText) 返回替换后的字符串

Explem:
    1.懒加载
        https://github.com/jirengu-inc/jrg-renwu10/blob/master/homework/%E5%AD%99%E7%BA%A2%E7%85%A7/mission29/demo2.html
    2. 无限加载
        https://github.com/jirengu-inc/jrg-renwu10/blob/master/homework/%E5%AD%99%E7%BA%A2%E7%85%A7/mission29/demo3.html
    3. 置顶
        https://github.com/jirengu-inc/jrg-renwu10/blob/master/homework/%E5%AD%99%E7%BA%A2%E7%85%A7/mission29/demo1.html
        

重点

html-css

1、笔试：
jquery/css3的选择器
jquery:
元素选择器:{
("p.intro") 选取所有 class="intro" 的 <p> 元素。
("[href]") 选取所有带有 href 属性的元素。
("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。
='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。
}

css3:{
。。。。
}

2、i++ ++i
简单的理解就是i++是先访问i然后再自增,而++i 则是先自增然后再访问i的值。
表格的事件代理
利用了事件冒泡和目标元素的特性，动态创建表格
3、margin-top失效问题
问题：当两个空的块级元素嵌套时，如果内部的块设置有margin-top属性，而且父元素没有下边解决方法所述的特征，那么内 部块的margin-top属性会绑架父元素（即将margin-top传递凌驾给了父元素）。
就好比一个小兵，看到上级有漏洞，就假传圣旨，利用漏洞扩张自己的权利。只要设置父元素的border（栅栏）或者 padding（隔离墙），就能管住这个调皮的下属

解决： 1、设置父元素或者自身的display:inline-block;
2、设置父元素的border:1px aqua solid;(>0)
3、设置父元素的padding:1px;(>0)
4、给父元素设置overflow:hidden;
5、给父元素或者自身设置position:absolute;
6、设置父元素非空，填充一定的内容。

4、pc 浏览器的兼容问题
解决：html css(css3低版本不兼容 PIE.htc) js(事件对象 组织浏览器的默认行文 事件监听等
移动端
解决：meta标签大全
5、iframe
iframe标签是框架的一种形式，也比较常用到，iframe一般用来包含别的页面，例如我们可以在我们自己 的网站页面加载别人网站或者本站其他页面的内容。iframe标签的最大作用就是让页面变得美观。iframe 标签的用法有很多，主要区别在于对iframe标签定义的形式不同

js

1. this
   this指向： this 指的是当前对象，如果在全局范围内使用this，则指代当前页面window；如果在函数中使用 this，则this指向根据当前函数是在什么对象上调用。我们可以使用call和apply改变函数中 this的具体指向。
2. 闭包？ 你在哪里使用过闭包？
   答案：轮播图，双重嵌套时
3. let var const
   区别：1. let添加了块级作用域；
   2. let约束了变量提升
   3. let有暂时性死区
   4. let禁止重复声明变量
   5. let不会成为全局对象的属性
   6. 以上let所介绍的规则均适用于const命令，不同的是，const声明的变量不能重新赋值，也是由于这个规则，const变量声明时必须初始化，不能留到以后赋值
   4、ajax?
   1.ajax是与服务器交换数据并更新部分网页的艺术，在不重新加载整个页面的情况下。
   2.ajax是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。
   3.ajax是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换。ajax可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。而传统的网页（不使用ajax）如果需要更新内容，必须重载整个网页面。
   4.优点： 1、最大的一点是页面无刷新，用户的体验非常好
   2、使用异步方式与服务器通信，具有更加迅速的响应能力。。
   3、可以把以前一些服务器负担的工作转嫁到客户端，利用客户端闲置的能力来处理，减轻服务器和带宽的负担，节 约空间和宽带租用成本。并且减轻服务器的负担，ajax的原则是“按需取数据”，可以最大程度的减少冗余请求， 和响应对服务器造成的负担
   4、基于标准化的并被广泛支持的技术，不需要下载插件或者小程序。
   5、ajax可使因特网应用程序更小、更快，更友好
   5.缺点： 1、ajax不支持浏览器back按钮。
   2、安全问题 AJAX暴露了与服务器交互的细节。
   3、对搜索引擎的支持比较弱
   4、破坏了程序的异常机制。
   5、不容易调试。
   5、get /post
   1.区别： 最直观的区别就是GET把参数包含在URL中，POST通过request body传递参数。
   2.get：一般用来进行查询操作，url地址有长度限制，请求的参数都暴露在url地址当中，如果传递中文参数， 需要自己进行编码操作，安全性较低，
   3.post：一般用来提交数据，没有数据的长度限制，提交的内容存在于http请求体中，数据不会暴露在url地址 中
   6、http/https
   区别： 1、https协议需要到ca申请证书，一般免费证书较少，因而需要一定费用。
   2、http是超文本传输协议，信息是明文传输，https则是具有安全性的ssl加密传输协议。
   3、http和https使用的是完全不同的连接方式，用的端口也不一样，前者是80，后者是443。
   4、http的连接很简单，是无状态的；HTTPS协议是由SSL+HTTP协议构建的可进行加密传输、身份认证的网络协议，比http协议安全。
   7、本地存储 localStorage 和cookie
   区别： 1. cookie在浏览器和服务器间来回传递。而sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存。
   2. cookie数据还有路径（path）的概念，可以限制cookie只属于某个路径下。存储大小限制也不同，cookie数据不能超过4k，同时因为每次http请求都会携带cookie，所以cookie只适合保存很小的数据，如会话标识。sessionStorage和localStorage 虽然也有存储大小的限制，但比cookie大得多，可以达到5M或更大。
   3. 数据有效期不同，sessionStorage：仅在当前浏览器窗口关闭前有效，自然也就不可能持久保持；localStorage：始终有效，窗口或浏览器关闭也一直保存，因此用作持久数据；cookie只在设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭。
   4. 作用域不同，sessionStorage不在不同的浏览器窗口中共享，即使是同一个页面；localStorage 在所有同源窗口中都是共享的；cookie也是在所有同源窗口中都是共享的。Web Storage 支持事件通知机制，可以将数据更新的通知发送给监听者。Web Storage 的 api 接口使用更方便。
   8、面向对象
   继承 多太 封装 工厂函数
   9、继承有哪些方式?
   1.原型链继承：
   核心： 将父类的实例作为子类的原型
   缺点：父类新增原型方法/原型属性，子类都能访问到，父类一变其它的都变了
   2.构造继承：
   核心：使用父类的构造函数来增强子类实例，等于是复制父类的实例属性给子类（没用到原型）
   缺点：方法都在构造函数中定义， 只能继承父类的实例属性和方法，不能继承原型属性方法，无法实现函数复用，每个子类都有父类实例函数的副本，影响性能
   3.组合继承：
   核心：通过调用父类构造，继承父类的属性并保留传参的优点，然后再通过将父类实例作为子类原型，实现函数复用
   缺点：调用了两次父类构造函数，生成了两份实例（子类实例将子类原型上的那份屏蔽了）
   4.寄生组合继承：
   核心：通过寄生方式，砍掉父类的实例属性，这样，在调用两次父类的构造的时候， 就不会初始化两次实例方法/属性，避免的组合继承的缺点
   缺点：堪称完美，但实现较为复杂
   10、是否使用过php/node.js/java等后台语言
   1.通信 webSocket
   WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议
   WebSocket 使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。
   在 WebSocket API 中，浏览器和服务器只需要做一个握手的动作，然后，浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。
   Ajax 轮询这种传统的模式带来很明显的缺点，即浏览器需要不断的向服务器发出请求，然而HTTP请求可能包含较长的头部，其中真正有效的数据可能只是很小的一部分，显然这样会浪费很多的带宽等资 源。
   HTML5 定义的 WebSocket 协议，能更好的节省服务器资源和带宽，并且能够更实时地进行通讯。
   11、h5新增了那些新的特性
   1.标签
   video：表示一段视频并提供播放的用户界面
   audio： 表示音频
   canvas： 表示位图区域
   source： 为video和audio提供数据源
   track： 为video和audio指定字母
   svg： 定义矢量图
   code： 代码段
   figure： 和文档有关的图例
   figcaption： 图例的说明
   time： 日期和时间值
   mark： 高亮的引用文字
   datalist： 提供给其他控件的预定义选项
   keygen： 秘钥对生成器控件
   output：计算值
   progress： 进度条
   menu： 菜单
   embed： 嵌入的外部资源
   menuitem： 用户可点击的菜单项
   main， template， section， nav， aside， article， footer， header
   2.属性
   contenteditable： 规定是否可编辑元素的内容。
   contextmenu： 指定一个元素的上下文菜单。当用户右击该元素，出现上下文菜单
   data-*： 用于存储页面的自定义数据
   draggable： 指定某个元素是否可以拖动
   dropzone： 指定是否将数据复制，移动，或链接，或删除
   hidden： hidden 属性规定对元素进行隐藏。
   spellcheck：检测元素是否拼写错误
   translate： 指定是否一个元素的值在页面载入时是否需要翻译
   本地存储 localstorage
   Canvas
   HTML5 <canvas> 元素用于图形的绘制，通过脚本 (通常是JavaScript)来完成.
   <canvas> 标签只是图形容器，您必须使用脚本来绘制图形。
   你可以通过多种方法使用 canvas 绘制路径,盒、圆、字符以及添加图像
   12、前端的可视化是否接触过？
   D3.js Echart.js hchart.js
   13、去重的方式
   1.双重的遍历（ IndexOf ）
   indexOf() 方法可返回数组中某个指定的元素位置。
   该方法将从头到尾地检索数组，看它是否含有对应的元素。开始检索的位置在数组 start 处或数组的开头（没有指定 start 参数时）。如果找到一个 item，则返回 item 的第一次出现的位置。开始位置的索引为 0。
   如果在数组中没找到指定元素则返回 -1。
   利用indexOf()方法查询遍历出的数组在新数组中是否出现,如果出现:则继续遍历数组,如未出现:则利用push方法添加到新数组中.
   2. 利用对象的属性唯一性
      14、排序
      快速排序
      冒泡排序
      es6 set
      sort
      15、深拷贝 和 浅拷贝
      值得拷贝和址的传递
      16、json/ xml
      xml：扩展标记语言 (Extensible Markup Language, XML) ，用于标记电子文件使其具有结构性的标记语言，可以用来标记数据、定义数据类型，是一种允许用户对自己的标记语言进行定义的源语言XML使用DTD(document type definition)文档类型定义来组织数据;格式统一，跨平台和语言
      json： JSON(JavaScript Object Notation)一种轻量级的数据交换格式，具有良好的可读和便于快速编写的特性。可在不同平台之间进行数据交换。JSON采用兼容性很高的、完全独立于语言文本格式，同时也具备类似于C语言的习惯(包括C, C++, C#, Java, JavaScript, Perl, Python等)体系的行为。这些特性使JSON成为理想的数据交换语言。

node.js

17、前端的模块化
1.AMD require.js
AMD是"Asynchronous Module Definition"的缩写，意思就是"异步模块定义"。它采用异步方式加载模块，模块的加载不影响它后面语句的运行。所有依赖这个模块的语句，都定义在一个回调函数中，等到加载完成之后，这个回调函数才会运行。
2.CMD sea.js
SeaJS要解决的问题和requireJS一样，只不过在模块定义方式和模块加载（可以说运行、解析）时机上有所不同
3.Common.js
CommonJs规范的出发点：JS没有模块系统、标准库较少、缺乏包管理工具；为了让JS可以在任何地方运行，以达到Java、C#、PHP这些后台语言具备开发大型应用的能力；
为什么要有模块化的概念出现
1.命名空间
多个模块之间的多重依赖关系
代码组织
2.node
内置的模块
第三方的模块
自定义模块
18、前端的五大异步流程工具
一、Promise
从语法上讲，promise是一个对象，从它可以获取异步操作的消息；从本意上讲，它是承诺，承诺它过一段时间会给你一个结果。promise有三种状态：pending(等待态)，fulfiled(成功态)，rejected(失败态)；状态一旦改变，就不会再变。创造promise实例后，它会立即执行。
1.Promise.all：
Promise.all可以将多个Promise实例包装成一个新的Promise实例。同时，成功和失败的返回值是不同的，成功的时候返回的是一个结果数组，而失败的时候则返回最先被reject失败状态的值。
2.Promise.race：
顾名思义，Promse.race就是赛跑的意思，意思就是说，Promise.race([p1, p2, p3])里面哪个结果获得的快，就返回那个结果，不管结果本身是成功状态还是失败状态
二、es6 generator函数
Generator函数是ES6引入的新型函数，用于异步编程，跟Promise对象联合使用的话会极大降低异步编程的编写难度和阅读难度
Generator函数跟普通函数的写法有非常大的区别：
一是，function关键字与函数名之间有一个星号；
二是，函数体内部使用yield语句，定义不同的内部状态（yield在英语里的意思就是“产出”）
三、node/vue nextTick()
nextTick是全局vue的一个函数，在vue系统中，用于处理dom更新的操作。
如果想在DOM状态更新后做点什么，则需要用到nextTick。
四、async 函数中 await
function aa(){console.log('aa')}
const async = () => { await aa() console.log(1)}
五、async.js
async模块是为了解决嵌套金字塔,和异步流程控制而生. async 函数就是 Generator 函数的语法糖。
优点： （1）内置执行器。 Generator 函数的执行必须靠执行器，所以才有了 co 函数库，而 async 函数自带执行器。也就是说，async 函数的执行，与普通函数一模一样，只要一行。
（2）更好的语义。 async 和 await，比起星号和 yield，语义更清楚了。async 表示函数里有异步操作，await表示紧跟在后面的表达式需要等待结果。
（3）更广的适用性。 co 函数库约定，yield 命令后面只能是 Thunk 函数或 Promise 对象，而 async 函数的await 命令后面，可以跟 Promise 对象和原始类型的值（数值、字符串和布尔值，但这时等同于同步操作）。

19、你接触过哪些数据库
一、mysql / mongodb
二、express
Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用，和丰富的 HTTP 工具。使用 Express 可以快速地搭建一个完整功能的网站。
Express 框架核心特性： 可以设置中间件来响应 HTTP 请求。
定义了路由表用于执行不同的 HTTP 请求动作。
可以通过向模板传递参数来动态渲染 HTML 页面。
三、mongoose
Mongoose是在node.js异步环境下对mongodb进行便捷操作的对象模型工具
Mongoose是NodeJS的驱动，不能作为其他语言的驱动。
Mongoose有两个特点：
　　 1、通过关系型数据库的思想来设计非关系型数据库
　　 2、基于mongodb驱动，简化操作
Vue
20、虚拟DOM的引入？
多次真实DOM --》 字符串拼接的方式 --.> 虚拟DOM ( diff算法 )
虚拟的DOM的核心思想是：对复杂的文档DOM结构，提供一种方便的工具，进行最小化地DOM操作
21、三大框架的区别？
不同点：
vue 控制器：无；过滤器 ：无 ；指令：有；渲染指令： 有 ；数据绑定：双向；
React 控制器：无；过滤器 ：无 ；指令：无；渲染指令 ： 无 ；数据绑定：单向；
angular 控制器：有；过滤器 ：有 ；指令：有；渲染指令 ： 有 ；数据绑定：双向；
相同点：
都是操作虚拟DOM（真实的dom，转换js对象树）
React 起源于 Facebook 的内部项目，用来架设 Instagram 的网站， 并于 2013年 5 月开源。React 拥有较高的性能，代码逻辑非常简单
它有以下的特性：
1.声明式设计：React采用声明范式，可以轻松描述应用。
2.高效：React通过对DOM的模拟，最大限度地减少与DOM的交互。
3.灵活：React可以与已知的库或框架很好地配合。
优点：
1. 速度快：在UI渲染过程中，React通过在虚拟DOM中的微操作来实现对实际DOM的局部更新。
2. 跨浏览器兼容：虚拟DOM帮助我们解决了跨浏览器问题，它为我们提供了标准化的API，甚至在IE8中都是没问题的。
3. 模块化：为你程序编写独立的模块化UI组件，这样当某个或某些组件出现问题是，可以方便地进行隔离。
4 . 单向数据流：Flux是一个用于在JavaScript应用中创建单向数据层的架构，它随着React视图库的开发而被Facebook概念化。
5. 同构、纯粹的javascript：因为搜索引擎的爬虫程序依赖的是服务端响应而不是JavaScript的执行，预渲染你的应用有助于搜索引擎优化。
6.兼容性好：比如使用RequireJS来加载和打包，而Browserify和Webpack适用于构建大型应用。它们使得那些艰难的任务不再让人望而生畏。
缺点：
React本身只是一个V而已，并不是一个完整的框架，所以如果是大型项目想要一套完整的框架的话，基本都需要加上ReactRouter和Flux才能写大型应用。
Vue是尤雨溪编写的一个构建数据驱动的Web界面的库，准确来说不是一个框架，它聚焦在V（view）视图层。
它有以下的特性：
1.轻量级的框架
2.双向数据绑定
3.指令
4.插件化
优点：
1. 简单：官方文档很清晰，比 Angular 简单易学。
2. 快速：异步批处理方式更新 DOM。
3. 组合：用解耦的、可复用的组件组合你的应用程序。
4. 紧凑：~18kb min+gzip，且无依赖。
5. 强大：表达式 无需声明依赖的可推导属性 (computed properties)。
6. 对模块友好：可以通过 NPM、Bower 或 Duo 安装，不强迫你所有的代码都遵循 Angular 的各种规定，使用场景更加灵活。
缺点：
1. 新生儿：Vue.js是一个新的项目，没有angular那么成熟。
2. 影响度不是很大：google了一下，有关于Vue.js多样性或者说丰富性少于其他一些有名的库。
3. 不支持IE8

Angular是一款优秀的前端JS框架，

它有以下的特性：
1.良好的应用程序结构
2.双向数据绑定
3.指令
4.HTML模板
5.可嵌入、注入和测试
优点：
1. 模板功能强大丰富，自带了极其丰富的angular指令。
2. 是一个比较完善的前端框架，包含服务，模板，数据双向绑定，模块化，路由，过滤器，依赖注入等所有功能；
3. 自定义指令，自定义指令后可以在项目中多次使用。
4. ng模块化比较大胆的引入了Java的一些东西（依赖注入），能够很容易的写出可复用的代码，对于敏捷开发的团队来说非常有帮助。
5. angularjs是互联网巨人谷歌开发，这也意味着他有一个坚实的基础和社区支持。
缺点：
1. angular 入门很容易 但深入后概念很多, 学习中较难理解.
2. 文档例子非常少, 官方的文档基本只写了api, 一个例子都没有, 很多时候具体怎么用都是google来的, 或直接问misko,angular的作者.
3. 对IE6/7 兼容不算特别好, 就是可以用jQuery自己手写代码解决一些.
4. 指令的应用的最佳实践教程少, angular其实很灵活, 如果不看一些作者的使用原则,很容易写出四不像的代码, 例如js中还是像jQuery的思想有很多dom操作.
5. DI 依赖注入 如果代码压缩需要显示声明.
22、三大框架的使用场景？
angular：
angular功能比较强大，适用在复杂、重大项目中。它有自己的一套规则，写出来的项目结构比较清晰，便于大型项目的维护迭代。
react：
react是一套跨平台的js框架，对比angular，react较轻量，同时，react有一个明显的特点，也是angular的“痛点”——跨平台。就移动端来说吧，angular当时出来的时候并没有把移动端考虑在内，只是后来才意识到移动端庞大的需求，所以出来angular2.0（angular2.0说白了就是angular专门针对移动市场的一种解决方案）。react使用js去调用移动原生控件，性能比传统的hybrid app（webview加载html页面）高很多，体验也更接近于native。
vue：
对比其他两大框架，vue是最轻量的，所以上手比较简单。vue专注于 MVVM 模型的ViewModel层，它主要目的是想让大家可以尽可能简单地达到数据和视图的绑定。如果你的产品需求是轻量级的、开发效率快的，那就选择它吧。
响应式原理
响应式原理 vuejs中的模型(model)和视图(view)是保持同步的，在修改数据的时候会自动更新视图，这其实依赖于Object.defineProperty方法，所以vuejs不支持IE8及以下版本，vuejs通过劫持getter/setter方法来监听数据的变化，通过getter进行依赖收集，在数据变更执行setter的时候通知视图更新。
生命周期
beforeCreate ，这个时候，数据还没有挂载呢，只是一个空壳，无法访问到数据和真实的dom，一般不做操作
created ，一般可以在这里做初始数据的获取
beforeMount ， 一般可以在这里做初始数据的获取
mounted ， 可以在这里操作真实dom等事情...
beforeUpdate ， 一般不做什么事儿
updated ， 可以操作更新后的虚拟dom
beforeDestroy ，一般在这里做一些善后工作，例如清除计时器、清除非指令绑定的事件等等
destroyed ，在这里做善后工作也可以
vuex *********
通过定义和隔离状态管理中的各种概念并强制遵守一定的规则，我们的代码将会变得更结构化且易维护。使用vuex来引入外部状态管理，将业务逻辑切分到组件外，可以避免重复的从服务端抓取数据。
Vue组件接收交互行为，调用dispatch方法触发action相关处理，若页面状态需要改变，则调用commit方法提交mutation修改state，通过getters获取到state新值，重新渲染Vue Components，界面随之更新
vue的全家桶
概括起来就是：、1.项目构建工具、2.路由、3.状态管理、4.http请求工具。
路由原理
通过改变浏览器地址URL，在不重新请求页面的情况下，更新页面视图
有两种方式:
1.一种是# hash在地址中加入#以欺骗浏览器，地址的改变是由于正在进行页内导航
2.一种是h5的history使用URL的Hash来模拟一个完整的URL
23、spa 单页面应用？
SPA不会因为用户的操作而进行页面的重新加载或跳转，而是利用JavaScript动态的变换HTML（采用的是div切换显示和隐藏），从而实现UI与用户的交互。
好处：
1、由于避免了页面的重新加载，SPA可以提供较为流畅的用户体验。得益于Ajax，可以实现无跳转刷新，由于与浏览器的history机制，可以使用hash的b变化从而可以实现推动界面变化。
2、只要使用支持HTML5和CSS3的浏览器就可以执行复杂的SPA,因此，开发人员不必为了写SPA网站而特别学习另一个开发方式，而使用者也不额外安装软件，所以，让开发SPA网页程序的入门和使用门槛降低不少。
缺点：
以SPA方式开发的网站不容易管理也不够安全。
因为没了一页一页的网页给搜索引擎的爬虫来爬，所以，在搜索引擎最佳化（SEO）的工作上，需要花费额外的功夫。
因为没有换页，需要自定义状态来取代传统网页程序以网址来做判断。
前端的版本控制工具
24、git svn
git的操作流程

1. 组长： 创建一个远程的仓库
2. 邀请各个组员，给赋予权限
3. 给每一个组员创建一个分支，创建好公共的分支
4. 克隆仓库到本地，多复制一份出来（这一份作为我们分支的开发目录）， 有的同学直接在仓库代码中开发，代码提交的时候，代码丢失，
5. 首先，当我们开发完之后，在开发目录中先做好测试，然后再去提交远程分支
6. 组长：统管项目
   25、你的项目开发流程
   产品<--> ui <--> 前端 <--> 后台<-->测试<-->上线
   26、你平时是如何和你的ui和后台沟通的
   都可以做的，成本大
   后台接口没有给你（ 跨域 json mock.js ）
   27、前端的工程化（自动化）
   1.webpack
   什么是webpack：webpack是一款模块加载兼打包工具，它可以将js、jsx、coffee、样式sass、less，图片等作为模块来使用和处理。
   优点：
   1、以commonJS的形式来书写脚本，对AMD、CMD的支持也很全面，方便旧项目的迁移
   2、能被模块化的不止是JS了。
   3、能替代部分grunt/gulp的工作，例如打包，压缩混淆，图片转base64等。
   4、扩展性强，插件机制完善，支持React热拔插
   2.gulp
   Glup侧重于前端开发的整个过程的控制管理，我们可以通过给glup配置不同的task来让glup实现不同的功能，从而构建整个前端开发流程。
   3.grunt
   简而言之，就是运行在Node.js上面的任务管理器（task runner），其可以在任何语言和项目中自动化指定的任务

React

28、redux
1.redux-thunk
当我们需要在actionCreator中返回一个函数的时候（异步操作的时候）
2.redux的工作流程
组件想要获取State， 用ActionCreator创建了一个请求交给Store,Store借助Reducer确认了该State的状态，Reducer返回给Store一个结果，Store再把这个State转给组件。
3.生命周期
初始化：
getDefaultProps： 设置默认属性
getInitialState： 设置初始状态， 此时可以访问this.props
componentWillMount ： 即将挂载 ， 此时可以修改state。
render ： 渲染，就是挂载， 此时就不能更改state了。
componentDidMount ： 挂载完成
更新：
compoentwillReceiveProps： 组件初始化时不调用，组件接受新的props时调用。
shouldCompnetUpdate： 是否应该进行更新操作
componentWillUpdate： 即将进行更新操作， 此时可以修改state
render ： 重新渲染
componentDidUpdate： 更新完成， 此时可以获取dom节点。
销毁：
componentWillUnmount： 组件将要卸载时调用，一些事件监听和定时器需要在此时清除。
29、常见的ui组件库/ ui库
sui.js
element ui (vue)
muse ui (vue)
mini ui
framework7 vue
ant desigin （蚂蚁金服ui库）
rem 和弹性盒子
30、请问你使用过哪些 cs吗？
Client Serve 客服端服务器 wamp / xmapp / phpstudy ...
后端测试工具
你在项目中遇到过什么问题？是如何解决的？
vue项目的时候，哪些地方卡住了？
react项目中 ， 项目开发流程（日志文件） 问题 解决方案