为什么要前后端分离
- 后端服务器不需要再渲染页面，减轻了服务器的压力
- 减轻开发人员的工作负担，前端专注页面，后端专注接口，提高工作效率
- 随着前端技术发展，前端知识量与代码量越来越多，越来越复杂，需要由专业的前端人才复制开发
- 前后端分离符合软件开发中解耦、模块化开发理念
vue中router与route
- router对象是全局路由(VueRouter)的实例，有例如push()，go()，replace()等方法
- route对象是当前路由的实例，包含url，参数，query，params对象等
vue中改变this指向
比如vue中调用window相关方法，方法内的this指向的是window对象，而想要在window相关方法中使用vue对象的话，只需要在方法外重新定义一个vue的this对象，然后在window相关方法中使用定义的这个this对象即可
vue中的跨域问题
解决方法：proxyTable
跨域这个行为，浏览器是禁止的，但是服务器不禁止，使用proxyTable其原理就是将域名发送给本地服务器，再由服务器请求
前端的几种缓存技术
- cookie
是客户端-服务器通讯的工具
cookie存放于前端，有安全性问题
存放大小限制4kb - session
是服务端机制，信息是存放在服务器端的，安全
使用session id来识别用户，session id存放于cookie中 - localStorage
持久化的本地储存
是前端在本地储存数据的一种工具，不会和服务器通讯
如果用户在浏览器关闭了cookie，localStorage也将无法使用
只能用过js删除，或是手动清楚浏览器缓存才能删除
存放大小限制5m
常用方法 - sessionStorage
会话级别的储存
关闭浏览器后消失
sessionStorage中的数据 只有在同一个会话中才能访问，并且会话关闭后数据就会消失
方法同localStorage
vue中data为什么是函数形式
js中只有函数(function)能构成作用域，当data是一个函数时，每个组件实例都有自己的作用域，这样每个实例才都是相互独立，互不影响的
如果data不是function，而是Object，每个组件实例的data都指向内存中同一个地址，其中一个组件实例修改了数据，其他组件实例也会相应修改
vue实现双向绑定的原理是什么
数据劫持 + 发布-订阅模式，通过Object.defineProperty()方法劫持各个属性的get()set()方法，在数据发生变动时通知订阅者，触发更新回调函数，重新渲染视图
数据劫持指当我们修改对象的某个属性时，vue会拦截该行为并进行额外操作或是修改返回结果
发布-订阅模式指对象的一种一对多的依赖关系，当对象发生改变时，所有依赖于它的对象都将得到通知，这个行为由发布订阅模式中的事件调度中心完成
发布订阅模式的优点是：
- 发布者与订阅者互补干扰，实现了解耦
- 可以作权限控制、节流处理，比如发布者发布的消息不希望所有的订阅者都接收到，可以在调度中心做处理
h5新增标签举例，为什么要加强语义化标签
表单input新增type属性
required 必填
语义化标签的优点：
- 代码易读易维护，代码结构清晰
- 有利于seo(搜索引擎优化)
- 有利于解析代码
vue减少页面加载时间
- 在打包vue项目时，所有的js、css文件都会被打包进vendor.js，浏览器加载完vendor.js文件后才会显示页面，如果引入的库太多导致vendor.js文件过大，就会造成项目打开缓慢
解决方法：使用cdn或者其他服务器资源引用避免将js、css编译到vendor.js中，浏览器在加载时会异步的加载vendor.js和外部资源，从而节省时间 - 路由懒加载/组件懒加载/全局懒加载
使用懒加载可以避免第一次进入系统时因需要加载的页面过多导致页面打开速度慢
组件懒加载
下面展示了es6和vue两种写法，路由懒加载也是同理，主要是不能使用import引入文件 - 压缩代码
- loading动画