一些闲话：在18-19-1学期的项目中，由于想尝试一点没用过的东西，开始大力踩坑，特别感谢身在鹅厂的学长的远程强力支援（敬礼！）
正文
先简单描述一下我遇到的问题
修改前的代码片
这一段的目的是创建一个
myTypeNav，然后利用它的数据构架另外一个mySubNav但是在这里会发现数据并没有传入，这是为什么呢？
问题原因
由于在myTypeNav的创建过程中有发ajax请求这样的异步操作，所以实际上在resolve([myTypeNav.subTypes, myTypeNav.allGoods])，这两个数据还是null，构建mySubNav的时候自然会由于缺少参数失去效果，自然而然影响到了后面的then
解决方案
一、等待（这个方案已经废弃）
这个是在向学长请教之前写的代码，强行等待异步操作完成，通过多次试验估计一下大概要多长时间可以完成请求，然后setTimeout
大概是这个样子
setTimeout(() => {
if (myTypeNav.subTypes && myTypeNav.allGoods) {
resolve([myTypeNav.subTypes, myTypeNav.allGoods])
}
}, 100);
致命缺点：时间长了会影响页面生成的速度,时间短了可能会因为网络因素仍然得不到数据
二、放弃异步请求（丧失尊严的写法）
ajax请求的过程不管是自己写的函数还是别人造的轮子（比如jquery.ajax）都会提供参数，允许设置为同步请求。这样就可以在myTypeNav完全创建之后再进行下步操作。
但是这个不是学习的重点，不过多赘述。
三、将myTypeNav中用到的promise暴露出来（目前使用的方案）
既然myTypeNav是一个类，那么我们就可以给他设置属性。比如我们可以将请求封装到一个promise中，然后将这个promise作为一个属性进一步调用。
// myTypeNav.js
class TypeNav {
// 构造函数，option包括ele(容器),所有种类的tid和名字
constructor(option) {
// 忽略掉的代码
this.promise = this.getAll(this.current_id)
}
getAll(tid){
// 返回ajax请求的promise对象
return ($.ajax({
type: "GET",
url: this.url,
data: {
t_id: tid
}
}).then((data) => {
data = JSON.parse(data)
this.allGoods = data.goodsList;
this.subTypes = data.subTypeList;
return [this.current_id,this.subTypes,this.allGoods]
}))
}
}
// goodList.js
// 构建一个含有 promise 的一级分类列表
myTypeNav = new TypeNav({
ele: typenavEle,
data: types,
url: localStorage.getItem('lexian-user-typeAPI')
})
// 一级列表点击，页面重构
myTypeNav.promise
.then((value) => {
// 由第一个传过来二级分类参数和一级下所有商品信息
// 构建二级分类列表
mySubNav = new SubNav({
ele: subNavEle,
data: value[1],
index: 0
});
goodDatas = value[2];
// 默认按照收藏量排序
goodDatas.sort(sortBylike);
// 二级列表点击，商品刷新
mySubNav.ele.addEventListener('click', () => {
goodsEle.innerHTML = '';
buildGoods(goodsEle, mySubNav.current_sub, goodDatas);
})
return [mySubNav.current_sub, value[2]]
})
