知识储备常用的鼠标事件
click
dbclick：双击
mouseenter：当鼠标指针首次移动到元素上时触发。不冒泡
mouseleave：当鼠标指针移出元素时触发。不冒泡
mousedown：当元素上按下鼠标按钮时候触发
mouseup：当元素上释放鼠标按钮时触发
mousemove：当鼠标指针在元素内部移动时重复地触发
mouseover：当鼠标指针移动到元素上时触发
mouseout：当鼠标指针移出元素时触发
事件对象当触发某个事件时，会产生一个事件对象，这个对象包含着所有与事件有关的信息。会作为参数传递给函数，IE8以及之前的版本event对象是作为window对象的属性存...
缘起：前段时间面试SXF二面的时候发现自己项目经验有点少，一些组件实现思路也不清晰，决定恶补一波。该项目来源是慕课网上的《Vue全家桶+SSR+Koa2全栈开发美团网》，于近期学习完毕。
基础知识Koa2Koa2是基于Nodejs的web框架对Node.js的http进行了封装（封装了一个服务器），用 Promise + async 实现异步 （Koa1是用Generator，Express是用Promise）ctx是一个全局的信息对象，包含所有信息
使用方法全局安装koa、 koa-generator。用koa2 -e ${项目名} 来初始化项目主配置文件是 /app.js ...
缘起：该项目是 7 月末刚开始学 Vue 的时候，一开始看官方文档，觉得不够扎实，需要一些实战练习，所以在慕课网上看《Vue2.5 开发去哪儿网 App 从零基础入门到实战项目》做了此项目。后来又自己从头到尾把项目敲了一遍。最近复习又把这个项目的实现过了一遍，总结成此博文后来又给这个项目搭了个基于Koa2的服务器，完善登录验证等功能
组件实现首页
header 组件：用 Vuex 获取城市数据
轮播效果是通过 vue-awesome-swiper 实现的
切换城市页
选择城市后会且切换到首页并把城市数据更新到 Vuex 中
搜索框：对 input 做 v-model=’key...
模块化的好处解决命名冲突、提高代码的复用性和可维护性
模块化的实现方式立即执行函数在早期，使用立即执行函数实现模块化是常见的手段，通过函数作用域解决了命名冲突、污染全局作用域的问题。少用了
1234(function(globalVariable){ globalVariable.test = function() {} // ... 声明各种变量、函数都不会污染全局作用域})(globalVariable)
AMD 和 CMD其实这两种实现方式也已经很少见到
CommonJSNode.js，webpack每个文件是一个模块，有自己的作用域...
性能优化概括主要的是：
降低请求量：合并资源，减少 HTTP 请求数，minify / gzip 压缩，webP，lazyLoad。
加快请求速度：预解析DNS，减少域名数，并行加载，CDN 分发。
缓存：HTTP 协议缓存请求，离线缓存 manifest，离线数据缓存localStorage。（HTML 文件每次都向服务器询问是否有更新，JS/CSS/Image资源文件则不请求更新，直接使用本地缓存）
渲染：JS/CSS优化，加载顺序，服务端渲染，pipeline。
加载相关为什么要强调 CSS 要放在 header 里，js 放在尾部构建 ...
JS 的事件循环宿主环境JS 运行的环境称之为宿主环境，eg. 浏览器，服务器，桌面等
执行环境栈放执行环境的地方，栈尾就是活动的执行环境
浏览器内核浏览器内核是多线程的：GUI 渲染线程、JavaScript 引擎线程、定时触发器线程、事件触发线程、异步 http 请求线程
渲染引擎和 JS 引擎是互斥的，所以渲染引擎在解析 DOM 的时候遇到 srcipt 会被暂停，阻塞渲染
主线程依次执行代码时，遇到定时器，会将定时器交给定时器触发线程处理，当计数完毕后，事件触发线程会将计数完毕后的事件加入到任务队列的尾部，等待 JS 引擎线程执行
事件触发线程遇到事件，eg. setTimeo...
Node.js的特性简介Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境（runtime）, 是一个让 JavaScript 运行在服务端的开发平台， 使用了一个事件驱动、非阻塞 I/O 的模型
非阻塞IO以JS为例，JavaScript为一种单线程语言，所以如果有很多任务需要执行，只能等前面的任务执行完了，再执行后面的任务。一旦遇到大量任务或者遇到一个耗时的任务（一个I/O），网页就会被卡住。这种就是阻塞 I/O。而Node.js在I/O时函数立即返回，进程不等待I/O完成，因为有Event Loo...
异步编程，就是通过利用客户端环境的 Event-Loop 机制，去异步地执行某些代码
一些自己之前容易乱的关系异步函数 = 异步操作，异步函数中包含回调函数做参数。回调函数只是一个普通函数。异步函数可以写成Promise形式
以前，异步编程的方法，大概有下面四种。回调函数事件监听Promise 对象
回调函数回调函数，就是把任务的第二段单独写在一个函数里面，等到重新执行这个任务的时候，就直接调用这个函数。英语名为 callback。例如fs的读取文件
1234fs.readFile('/etc/passwd', function (err, data) &#...
前后端数据交互利用 CookieCookie 是一些数据, 存储于电脑上的文本文件中,只要客户端 cookie 开放且有数据，每一次请求都会自动添加到 http 报文中，后台可以实时接收观察获取这些 Cookie 。
Cookie 的作用就是用于解决 “如何记录客户端的用户信息”:
当用户访问 web 页面时，他的名字可以记录在 cookie 中。
在用户下一次访问该页面时，可以在 cookie 中读取用户访问记录。
利用 Session 对象session 对象表示特定会话 session 的用户数据。
客户第一次访问支持 session 的 JSP 网页，服务器会创建一个 ses...
浏览器渲染渲染流程
接收到 HTML 文件，转化为 DOM 树（字节数据=>字符串=>Token（最小单位代码）=>Node=>DOM）当然，在解析 HTML 文件的时候，浏览器还会遇到 CSS 和 JS 文件，这时候浏览器也会去下载并解析这些文件（即遇到 script 标签会暂停 DOM 的构建）
将 CSS 文件转换为 CSSOM 树（字节数据=>字符串=>Token（最小单位代码）=>Node=>CSSOM）在这一过程中，浏览器会确定下每一个节点的样式到底...
XSS定义跨站脚本攻击(Cross Site Scripting)，缩写为XSS（避免和CSS混淆就没缩写成CSS）。恶意攻击者往Web页面里插入恶意Script代码，当用户浏览该页之时，嵌入其中Web里面的Script代码会被执行，从而达到恶意攻击用户的目的
XSS攻击注入点HTML节点内容节点中包含用户输入的内容。例如
123<div>#{content}</div>// content能被输入成包含一段脚本<div><script> </script></div>
HTML属性1234// ...
PS：一般单例模式和观察者模式问的最多。一般能说出5个设计模式就可以
面向对象的JS语言类型静态类型语言在编译时便确定变量的类型，而动态类型语言要到程序运行的时候，待变量被赋予某个值之后，才会有某种类型。JS是典型的动态类型语言。同时JS也是弱类型语言，Java是强类型语言强类型语言是一旦变量的类型被确定，就不能转化的语言。实际上所谓的貌似转化，都是通过中间变量来达到，原本的变量的类型肯定是没有变化的弱类型语言则反之，一个变量的类型是由其应用上下文确定的。比如语言直接支持字符串和整数可以直接用 + 号搞定。当然，在支持运算符重载的强类型语言中也能通过外部实现的方式在形式上做到这一点，不过...
