一些閑話：在18-19-1學(xué)期的項(xiàng)目中髓需，由于想嘗試一點(diǎn)沒(méi)用過(guò)的東西曲聂，開始大力踩坑，特別感謝身在鵝廠的學(xué)長(zhǎng)的遠(yuǎn)程強(qiáng)力支援（敬禮Ｏ跖　）

正文

先簡(jiǎn)單描述一下我遇到的問(wèn)題

修改前的代碼片

問(wèn)題原因

由于在myTypeNav的創(chuàng)建過(guò)程中有發(fā)ajax請(qǐng)求這樣的異步操作璃谨，所以實(shí)際上在resolve([myTypeNav.subTypes, myTypeNav.allGoods])沙庐，這兩個(gè)數(shù)據(jù)還是null，構(gòu)建mySubNav的時(shí)候自然會(huì)由于缺少參數(shù)失去效果佳吞，自然而然影響到了后面的then

解決方案

一拱雏、等待（這個(gè)方案已經(jīng)廢棄）

這個(gè)是在向?qū)W長(zhǎng)請(qǐng)教之前寫的代碼，強(qiáng)行等待異步操作完成底扳，通過(guò)多次試驗(yàn)估計(jì)一下大概要多長(zhǎng)時(shí)間可以完成請(qǐng)求铸抑，然后setTimeout
大概是這個(gè)樣子

setTimeout(() => {
    if (myTypeNav.subTypes && myTypeNav.allGoods) {
        resolve([myTypeNav.subTypes, myTypeNav.allGoods])
    }
}, 100);

致命缺點(diǎn)：時(shí)間長(zhǎng)了會(huì)影響頁(yè)面生成的速度,時(shí)間短了可能會(huì)因?yàn)榫W(wǎng)絡(luò)因素仍然得不到數(shù)據(jù)

二、放棄異步請(qǐng)求（喪失尊嚴(yán)的寫法）

ajax請(qǐng)求的過(guò)程不管是自己寫的函數(shù)還是別人造的輪子（比如jquery.ajax）都會(huì)提供參數(shù)衷模，允許設(shè)置為同步請(qǐng)求鹊汛。這樣就可以在myTypeNav完全創(chuàng)建之后再進(jìn)行下步操作蒲赂。
但是這個(gè)不是學(xué)習(xí)的重點(diǎn)，不過(guò)多贅述刁憋。

三滥嘴、將myTypeNav中用到的promise暴露出來(lái)（目前使用的方案）

既然myTypeNav是一個(gè)類，那么我們就可以給他設(shè)置屬性至耻。比如我們可以將請(qǐng)求封裝到一個(gè)promise中若皱，然后將這個(gè)promise作為一個(gè)屬性進(jìn)一步調(diào)用。

// myTypeNav.js
class TypeNav {
  // 構(gòu)造函數(shù)尘颓，option包括ele(容器),所有種類的tid和名字
  constructor(option) {
   // 忽略掉的代碼
    this.promise = this.getAll(this.current_id)
  }
getAll(tid){
    // 返回ajax請(qǐng)求的promise對(duì)象
    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
// 構(gòu)建一個(gè)含有 promise 的一級(jí)分類列表
myTypeNav = new TypeNav({
    ele: typenavEle,
    data: types,
    url: localStorage.getItem('lexian-user-typeAPI')
})
// 一級(jí)列表點(diǎn)擊走触，頁(yè)面重構(gòu)
myTypeNav.promise
    .then((value) => {
    // 由第一個(gè)傳過(guò)來(lái)二級(jí)分類參數(shù)和一級(jí)下所有商品信息      
    // 構(gòu)建二級(jí)分類列表
    mySubNav = new SubNav({
        ele: subNavEle,
        data: value[1],
        index: 0
    });
    goodDatas = value[2];
    // 默認(rèn)按照收藏量排序
       goodDatas.sort(sortBylike);
    // 二級(jí)列表點(diǎn)擊，商品刷新
    mySubNav.ele.addEventListener('click', () => {
        goodsEle.innerHTML = '';
        buildGoods(goodsEle, mySubNav.current_sub, goodDatas);
    })
    return [mySubNav.current_sub, value[2]]
    })