JQuery的一些兼容性问题
① 在IE8里，对一些自闭合标签，使用非自闭和input、img，用JQ选择器无法获取到node节点;
② 在IE8里，对一些id、class命名为大小写不区分的名字，用JQ选择器无法获取到node节点;
③ 在IE8及以下的浏览器，ajax不能使用ip，应该采用域名的方式。
Webpack和Gulp的区别?
Gulp、Grunt：在一个配置文件中指明某些文件需要自动地进行编译、组合、压缩;
Gulp的4个常用的方法：
① src( )：获取流
② dest( ): 写文件
③ task( ): 用来定义任务
④ watch( ): 用来监听事件
Webpack：在Webpack.config.js文件中，entry指定入口文件。会从入口文件开始，找出所有依赖的文件，然后用对应的loaders去处理它们，最后打包成为一个浏览器可识别的js文件;
Webpack的打包指令：
进入到项目的根目录下，执行：node_modules/.bin/webpack 入口文件.js 打包后的文件.js
做啥Node相关的?
① 快速搭建开发环境;
② npm包管理工具
什么是Koa
Koa是使用了ES6规范的generator和异步编程的一款前端框架，它不捆绑任何中间件，拓展性更强，所以它可以让中间件的开发变得更加有趣。
什么是中间件?
所谓的“中间件”，也就是中间过程中可以变的步骤 例如“把大象放进冰箱”，分为三个步骤： ① 打开冰箱门 ② 放大象进去 ③ 关闭冰箱门 其中② 是可变的步骤，成为中间件
js如何实现异步编程?
① 回调函数
② 事件监听
③ 发布/订阅
④ Promise对象
Nodejs的事件机制
Node.js使用事件驱动模型(事件源、监听器、事件处理程序) events是Node.js最重要的模块，它只提供一个对象EventEmitter。 EventEmitter的核心是事件发射和事件监听; 与Dom树上的事件不同，因为它不存在事件冒泡、捕获行为。
EventEmitter有以下方法：
① on(“事件名”, 监听的变量即回调函数)
② emit(“事件名”, 所传参数)
③ once(“事件名”, 监听);//一次性监听，触发完解除
④ removeListener(“事件名”，监听的变量);//移除某一指定事件名的监听
⑤ removeAllListeners();//移除所有事件的所有监听
⑥ listeners(“事件名”);//返回一个数组，这个数组是这个事件的所有监听集合
⑦ setMaxListeners(15);//设定一个事件最多可以设置多少个监听数(太多会造成内存泄漏)
v-if和v-show的区别
v-if：是真正的条件渲染，因为它会确保在 切换过程中，条件块里的事件监听器、子组件能够是当地被摧毁或重建;而且也是惰性的，直到第一次为true的时候，才会开始渲染。
v-show：不管初始条件是什么，元素总是会被渲染，并且只是简单地基于CSS进行切换
组件化 和 模块化
组件：
① 强调的是复用;
② 侧重于UI;
③ 像一个黑盒子(样式、结构、逻辑不用管)，要用的时候直接拿，就可以盖房子
模块：
① 强调的是规则;
② 侧重于功能的实现和数据的封装;
③ 由一个或多个组件构成的，具有一定功能的房子、床
模块化开发AMD、CMD和Common.js
相同： 都是js模块化开发的规范
① 【针对对象】
AMD、CMD：客户端;
Common.js：服务端;
② 【加载方式】
AMD、CMD：异步加载
Common.js：同步加载
③【预加载、懒加载】
虽然AMD、CMD都是异步加载，但是都需要一个预处理：提前将所需的模块文件并行加载好。
AMD：属于预加载。它会在并行加载JS文件的同时，还会并行解析执行该模块。
CMD：属于懒加载。虽然会一开始并行加载JS文件，但是不会执行，而是在需要的时候才去解析执行
④【优缺点】
AMD：
优点：加载快速，尤其是遇到多个大文件。因为并行解析，所以能在同一时间段里解析多个文件;
缺点：并行加载，异步处理，加载顺序不一定。
CMD：
优点：只有使用的时候才加载，所以顺序可控
缺点：因为是同步解析执行，所以时间比较长
⑤【引入方式】
AMD：用
<script>
引入Require.js
CMD：用<script>引入Sea.js
Common.js：用node就行了
SVG、Canvas、CSS3
SVG：基于XML，它的代码结构和兼容性都很好；（一般用于展示数据）
Canvas：和JS紧密结合，它的逻辑操作很方便，渲染效率也很高（一般用于应用、游戏、图表）；
CSS3：更多是扩展样式的表现
优点：① 可以像SVG一样结合DOM节点；
② 渲染效率、旋转一些功能比Canvas更好；
缺点：① 在Dom节点很多的情况下，渲染速率会大大下降；
JSX是什么？
JSX是一种JavaScript的语法扩展。
它允许在javascript代码里出现HTML、CSS语法，它们终将被转换成原生的javascript，去创建DOM
React是什么？
React是一套可以用简洁的语法 去 高效绘制DOM的框架。
“高效”：
① 因为React拥有Virtual Dom机制。Virtual Dom是一个存在于内存中的javascript对象，它与Dom是一一对应的关系，也就是说只要有Virtual Dom，我们就能渲染出DOM；
② 当页面发生变化时，得益于高效的DOM diff算法，我们能够知道Virtual Dom的变化，从而高效的改动DOM，避免重新绘制DOM。
React Native是什么？
一个基于javascript，具备动态配置能力的移动端开发框架。
Native版本的React
Node.js是什么？
① javascript是一门编程语言；Node.js是一款基于javascript和GoogleV8 引擎的开源Web服务器项目；
② Node.js借助了javascript的事件驱动机制、V8的高性能引擎
（javascript是单线程执行，根本不能同步IO操作）
② javascript需要浏览器的解释器去解释执行；Node.js是对Google V8引擎进行封装了的运行环境；
npm
npm是Node.js的包管理工具
① 【直接用】大家都把自己开发的模块打包好后，放到npm官网。直接通过npm安装就可以直接用；
② 【依赖关系】npm可以根据依赖关系，把所有依赖的包都下载。
手写事件委托
//事件委托，利用的是事件冒泡的原理。
//利用事件委托，只需在DOM树中尽量最高的层次上添加一个事件处理程序。
var oBox = document.getElementById("box");
oBox.onclick = function(ev){
var ev = ev || window.event;//为了火狐的兼容性。因为IE都支持window.event，但火狐只能够使用传递的事件对象；
//上面那句相当于： var ev = ev ? ev:window.event;//ev为false时，即undefined
var target = ev.target || ev.srcElement;//火狐只支持ev.target，而IE只支持ev.srcElement；
//这个target，就是鼠标所点击的那个Node节点了。
}
性能优化（图片）
可以使用CSS Sprite进行图片的压缩与合并，减少请求数。
但是也要考虑！多图合成一张图然后压缩过后，图片大小，清晰度的问题
问题一：图片的压缩
图片的分辨率单位是：位/像素
① 图片压缩的原理就是，降低每个像素的位数；
② 对图片的压缩，图片的质量降低在所难免；
③ 但是有个非常重要的原则：在保持图片能够正常显示的情况下，尽可能压缩分辨率，从而降低图片的体积
问题二：图片的格式
当图片的颜色较复杂，用JPG；
当图片的颜色较单一，用GIF；
问题三：图片的切割
对大尺寸的图片进行切割；
浏览器缓存的优点
对于客户端：极大地提高网页性能，优化用户体验；
对于服务器：减少接收的请求次数，缓解服务端的压力；
强缓存和协商缓存
首先， 在第一次请求成功后，再次请求同一个网页：
① 浏览器会获取该资源第一次请求成功后缓存下来的Header信息，查看Expires（绝对时间）、Cache-control（相对时间，并且优先考虑）这两个属性；
若命中强缓存，则直接从本地磁盘获取资源（本次请求不会与服务端进行通信）；（200）
若不命中强缓存，则进行②：
② 浏览器会拿着该资源第一次请求成功后缓存下来的Header信息，查看Last-Modified、ETag，将它作为请求头向服务器发送请求。由服务器来判断是否命中协商缓存：
若命中协商缓存，浏览器会响应新的Header信息给客户端，但是不会返回资源内容，会告诉浏览器直接从自己本地获取就行；（304）
若没命中协商缓存，则会响应全新的资源内容给客户端
本地存储
WebStorage 和 Cookie。
和浏览器缓存的区别：本地缓存可不联网，浏览器缓存不行
WebSocket
Socket：英文意思是孔、插座。是套接字
在JAVA里面，客户端创建连接套接字，发送请求给服务器端；
服务器端监听Socket，监听到了，则建立双向连接，发送数据；
关闭时，用close；
WebSocket也一样，
有2个方法：
send（）：向远程服务器发送数据
close（）：关闭该websocket链接
有4个属性：
onopen：当网络连接建立时，触发该事件
onerror：当网络出现错误时，触发该事件
onmessage：当websocket接受到服务器发来的消息时触发的事件，也是通信中最重要的一个监听事件
onclose：当websocket被关闭时，触发该事件
还有readyState属性，返回websocket所处的状态
源码">Ajax（源码）
① 创建xhr对象
② 通过xhr对象发送请求
③ 接受响应
//创建xhr对象
var xhr;
if(window.XMLHttpRequest){
xhr = new XMLHttpRequest();
} else {
xhr = new ActiveXObject('Microsoft.XMLHTTP');
}
//通过xhr对象发送请求
xhr.open('get',url,true);
xhr.send();
//处理响应
if(xhr.readyState == 4){
if(xhr.status == 200){
//对DOM的实际操作
}
}
Ajax（JQuery）
$.ajax({
type: "GET",//请求方式
url: "https://dev.contoso.corp.com/123",//请求url
dataType: ,//规定预期的，服务器响应的数据类型：“xml”、“html”、“script”、“json”、“jsonp”、“text”
})
JSONP
首先，Ajax直接请求普通文件存在跨域权限的访问问题；
然后，聪明的程序猿发现，拥有“src”的标签可以从外部域名下载js文件；
之后，有一种简洁的数据交换格式——JSON，可以被原生js支持，所以客户端可以随心所欲地处理这种格式；
后来，客户端可以通过和“调用脚本”一模一样的方式，来调用跨域服务器上动态生成的js文件（一般以JSON为后缀），获得自己所需的数据；
最后，为了更方便客户端使用数据，逐渐形成了一种非正式传输协议——JSONP。客户端可以传递一个callback参数给服务端来自定义回调函数的名字。（JQ通过定义jsonpCallback参数）
