2020-08-31

16、 瀑布流原理
瀑布流又称瀑布流式布局，是比较流行的一种网站页面布局方式
视觉表现为参差不齐的多栏布局，最早采用此布局的是网站是 Pinterest， 后逐渐在国内流行即多行等宽元素排列，后面的元素依次添加到其后，等宽不等高，根据图片原比例缩放直至宽度达到我们的要求，依次按照规则放入指定位置。
下面通过图解来分析一下瀑布流的算法。
当第一排排满足够多的等宽图片时（如下图情况），自然而然的考虑到之后
放置的图片会往下面排放。

那么第六张图片，放置在什么位置呢？是下图的位置么？

我们通过瀑布流算法实验得到，后面紧跟的第六张图片的位置应该是这个位置。
因为放置它之前，这一列的高度为所有列中最小，所以会放置在这个地方。所以我们知道了，如果再继续放置下去，第七张图片应该是这个位置

通过瀑布流算法实验得出位置正确。
看懂这个图示应该就能理解了瀑布流的原理算法。

总结瀑布流布局原理：
瀑布流的实现原理就是通过比较每一列的高度，如果这一列高度低的话就在这一列进行添加，如果可视区距离和滚动距离想加的话比你当前页面的高度还要高的时候，页面就开再次加载多个，这个主要也是页面布局，如果你的布局实现的不好的话！也会出现问题，首先每一列的高度，都是需要自适应的，不能设置高通过每一块内容将每一列撑起来，还有一个问题就是，滑动底部，根据每个电脑的不同，所以他每个人,获取的高度是不同而且有的时候，页面的整体高度和页面可视区高度加上滚动高度差 1px这个时候就需要我们提前加载，不然滑动到底部也加载不出来！

17、 已删除

18、 解构赋值
ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring)
解构赋值，左右结构必须一样，使用左边定义的值，快速的取出数据中对应的数据值，而且 定义和赋值必须放到一起，不然的话就会报错，取不出来数据值，而且左边也必须是一个 js 存在数据结构不然的话也会报错，解构赋值的主要作用还是，快速的让我们在数据中抓取出我们想要的数据。
20、 async/await
Async 和 await 是一种同步的写法，但还是异步的操作，两个内容还是必须同时去写才会生效不然的话也是不会好使，而且 await 的话有一个不错的作用就是可以等到你的数据加载过来以后才会去运行下边的 js 内容，而且 await 接收的对象必须还是个 promise 对象，如果是接收数据的时候就可以直接用一句话来接收数据值，所以这个 async await我的主要应用是在数据的接收，和异步问题的处理，主要是还是解决不同执行时机下的异步问题！
21、 es6 有哪些拓展
1.新增了块级作用域(let,const)
2.提供了定义类的语法糖(class)
3.新增了一种基本数据类型(Symbol)
4.新增了变量的解构赋值
5.函数参数允许设置默认值，引入了 rest参数，新增了箭头函数
6.数组新增了一些 API，如 isArray/from/of方法;数组实例新增了
entries()，keys() 和values() 等方法
7.对象和数组新增了扩展运算符
8.ES6新增了模块化(import/export)
9.ES6新增了 Set和 Map数据结构
10.ES6原生提供 Proxy 构造函数，用来生成 Proxy实例
11.ES6新增了生成器(Generator)和遍历器(Iterator)

22、 已删除

23、 请写出在vue 中使用promise 封装项目api 接口的思路？
axios封装了原生的 XHR，让我们发送请求更为简单，但假设在一个成百上千个 vue文件的项目中，我们每一个 vue文件都要写 axios.get()或 axios.post() 岂不是很麻烦？后期的维护也不方便，所以我们要对 axios进行进一步的封装。

1.构赋 vue-cli 项目的目录如上，我们在原有的目录基础上新建 api 与 utils
文件夹，utils 里新建 request.js 文件，request.js 代码如下
在 request.js 中做了三件事
1.创建 axios，设置 baseURL与超时时间
2.拦截请求
3.拦截响应
4.路由拦截