JavaScript算法教程之sku(庫存量單位)詳解
前言
這幾天公司出的題目,之前項目中寫過一個類似的,但是寫的很猥瑣(一些表現(xiàn)是通過頻繁操作DOM實現(xiàn)的),借著有獎勵的機會重寫了一下。
sku:
SKU=Stock Keeping Unit(庫存量單位)。即庫存進出計量的基本單元,可以是以件,盒,托盤等為單位。SKU這是對于大型連鎖超市DC(配送中心)物流管理的一個必要的方法?,F(xiàn)在已經(jīng)被引申為產(chǎn)品統(tǒng)一編號的簡稱,每種產(chǎn)品均對應有唯一的SKU號。單品:對一種商品而言,當其品牌、型號、配置、等級、花色、包裝容量、單位、生產(chǎn)日期、保質(zhì)期、用途、價格、產(chǎn)地等屬性與其他商品存在不同時,可稱為一個單品。
以上摘自百度百科
思路:
通過字典鍵值對(在JavaScript中即是Object數(shù)據(jù)類型)的方式來查找對應可選屬性。
難點:
在于所確定屬性的同級可選屬性。
實現(xiàn)步驟:
- 將拿到的數(shù)據(jù)重新組織成需要展示的數(shù)據(jù)格式、計算使用的字典數(shù)據(jù)格式、以及計算過程中需要的一些輔助數(shù)據(jù)。
- 獲取頁面的所選的屬性。
- 根據(jù)所選屬性組成查找key來查找結(jié)果。
- 將結(jié)果緩存,方便下次加速查找。
- 表現(xiàn)到頁面。
- 確定商品。
核心代碼:
/**
* 得到結(jié)果
* @param {string} key 查找關鍵字以;分割
* @return {array} 所有可選屬性數(shù)組
*/
getResult(key, isRealFind = true) {
// 如緩存中存在,則直接返回結(jié)果
if (this.cacheData[key] && isRealFind) {
this.result = this.cacheData[key];
this.resultID = this.goodsDict[key] ? this.goodsDict[key] : '';
console.log(this.resultID);
return this.result;
}
// 繼續(xù)查找
let result = '';
for (let _key in this.goodsDict) {
let keyArr = key.split(';');
let _keyArr = _key.split(';');
let arr = keyArr.concat(_keyArr);
arr = Array.from(new Set(arr));
if (arr.length === _keyArr.length) {
result += _key;
}
}
if (isRealFind) {
// 所有可選屬性
this.result = result.split(';');
let _keyArr = key.split(';');
if (_keyArr[_keyArr.length - 1] === '') {
_keyArr.pop();
}
for (let i = 0; i < _keyArr.length; i++) {
let _arr = key.split(';');
let str = _arr.splice(i, 1);
let oldResult = this.getResult(_arr.join(';'), false);
let index = '';
// 獲取該key所在索引
this.allKeys.forEach((item, i) => {
if (item.indexOf(str.join('')) !== -1) {
index = i;
return;
}
});
this.allKeys[index].forEach(item => {
if (oldResult.indexOf(item) !== -1) {
this.result.push(item);
}
});
}
this.result = Array.from(new Set(this.result));
// 緩存數(shù)據(jù)
this.cacheData[key] = this.result;
this.resultID = this.goodsDict[key] ? this.goodsDict[key] : '';
console.log(this.resultID);
return this.result;
} else {
return result;
}
}
github地址 (應該拉下來就能跑,頁面展示用的jQuery,因為當前項目需要,換成mvvm框架頁面表現(xiàn)會更加簡單)
總結(jié)
以上就是這篇文章的全部內(nèi)容了,希望本文的內(nèi)容對大家的學習或者工作能帶來一定的幫助,如果有疑問大家可以留言交流,謝謝大家對腳本之家的支持。
相關文章
微信小程序web-view不支持打開非業(yè)務域名https?//XXXX?請重新配置的解決辦法
小程序現(xiàn)在日漸成熟,功能也越來越強大,我們今天來一起看看小程序跳轉(zhuǎn)H5頁面的問題,下面這篇文章主要給大家介紹了關于微信小程序web-view不支持打開非業(yè)務域名https?//XXXX?請重新配置的解決辦法,需要的朋友可以參考下2022-08-08
JS實現(xiàn)自動輪播圖效果(自適應屏幕寬度+手機觸屏滑動)
這篇文章主要介紹了JS實現(xiàn)自動輪播圖效果(自適應屏幕寬度+手機觸屏滑動),需要的朋友可以參考下2017-06-06
G6?TreeGraph樹圖節(jié)點懶加載使用場景示例
這篇文章主要為大家介紹了G6?TreeGraph樹圖節(jié)點懶加載使用場景示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-10-10
JavaScript創(chuàng)建對象的七種方式(推薦)
JavaScript創(chuàng)建對象的方式有很多,通過Object構造函數(shù)或?qū)ο笞置媪康姆绞揭部梢詣?chuàng)建單個對象,顯然這兩種方式會產(chǎn)生大量的重復代碼,并不適合量產(chǎn)。接下來介紹七種非常經(jīng)典的創(chuàng)建對象的方式,他們也各有優(yōu)缺點2017-06-06
javascript中Date對象應用之簡易日歷實現(xiàn)
這篇文章主要為大家詳細介紹了javascript中Date對象應用之簡易日歷實現(xiàn),具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-07-07

