JavaScript算法教程之sku(库存量单位)详解


Posted in Javascript onJune 29, 2017

前言

这几天公司出的题目,之前项目中写过一个类似的,但是写的很猥琐(一些表现是通过频繁操作DOM实现的),借着有奖励的机会重写了一下。

sku:

SKU=Stock Keeping Unit(库存量单位)。即库存进出计量的基本单元,可以是以件,盒,托盘等为单位。SKU这是对于大型连锁超市DC(配送中心)物流管理的一个必要的方法。现在已经被引申为产品统一编号的简称,每种产品均对应有唯一的SKU号。单品:对一种商品而言,当其品牌、型号、配置、等级、花色、包装容量、单位、生产日期、保质期、用途、价格、产地等属性与其他商品存在不同时,可称为一个单品。

以上摘自百度百科

思路:

通过字典键值对(在JavaScript中即是Object数据类型)的方式来查找对应可选属性。

难点:

在于所确定属性的同级可选属性。

实现步骤:

  1. 将拿到的数据重新组织成需要展示的数据格式、计算使用的字典数据格式、以及计算过程中需要的一些辅助数据。
  2. 获取页面的所选的属性。
  3. 根据所选属性组成查找key来查找结果。
  4. 将结果缓存,方便下次加速查找。
  5. 表现到页面。
  6. 确定商品。

核心代码:

/**
 * 得到结果
 * @param {string} key 查找关键字以;分割
 * @return {array} 所有可选属性数组
*/
getResult(key, isRealFind = true) {
 // 如缓存中存在,则直接返回结果
 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;
 }
 // 继续查找
 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));
 // 缓存数据
 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框架页面表现会更加简单)

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
JavaScript 中的replace方法说明
Apr 13 Javascript
网页上的Javascript编辑器和代码格式化
Apr 25 Javascript
javascript 异步页面查询实现代码(asp.net)
May 26 Javascript
原生javascript兼容性测试实例
Jul 01 Javascript
jquery使用animate方法实现控制元素移动
Mar 27 Javascript
JS中处理时间之setUTCMinutes()方法的使用
Jun 12 Javascript
基于jQuery实现音乐播放试听列表
Apr 14 Javascript
jQuery中的基本选择器用法学习教程
Apr 14 Javascript
JavaScript与ActionScript3两者的同性与差异性
Sep 22 Javascript
js实现弹窗居中的简单实例
Oct 09 Javascript
Vue v-for循环之@click点击事件获取元素示例
Nov 09 Javascript
Vue 数据响应式相关总结
Jan 28 Vue.js
详解webpack自动生成html页面
Jun 29 #Javascript
JS判断Android、iOS或浏览器的多种方法(四种方法)
Jun 29 #Javascript
详解webpack分包及异步加载套路
Jun 29 #Javascript
JavaScript之map reduce_动力节点Java学院整理
Jun 29 #Javascript
Angular 2 ngForm中的ngModel、[ngModel]和[(ngModel)]的写法
Jun 29 #Javascript
JavaScript之iterable_动力节点Java学院整理
Jun 29 #Javascript
JavaScript之Map和Set_动力节点Java学院整理
Jun 29 #Javascript
You might like
php常用的安全过滤函数集锦
2014/10/09 PHP
php准确获取文件MIME类型的方法
2015/06/17 PHP
PHP按指定键值对二维数组进行排序的方法
2015/12/22 PHP
通过源码解析Laravel的依赖注入
2018/01/22 PHP
javascript instanceof 与typeof使用说明
2010/01/11 Javascript
jqgrid 简单学习笔记
2011/05/03 Javascript
js constructor的实际作用分析
2011/11/15 Javascript
jquery 提示信息显示后自动消失的具体实现
2013/12/18 Javascript
总结JavaScript设计模式编程中的享元模式使用
2016/05/21 Javascript
js实现添加可信站点、修改activex安全设置,禁用弹出窗口阻止程序
2016/08/17 Javascript
vue 2.0组件与v-model详解
2017/03/27 Javascript
浅谈vue,angular,react数据双向绑定原理分析
2017/11/28 Javascript
深入浅析vue组件间事件传递
2017/12/29 Javascript
Express之托管静态文件的方法
2018/06/01 Javascript
[02:36]DOTA2亚洲邀请赛小组赛精彩集锦:EE凭借法力虚空拿下4杀
2017/03/30 DOTA
python opencv之分水岭算法示例
2018/02/24 Python
对django中render()与render_to_response()的区别详解
2018/10/16 Python
对python xlrd读取datetime类型数据的方法详解
2018/12/26 Python
Django中在xadmin中集成DjangoUeditor过程详解
2019/07/24 Python
python中doctest库实例用法
2020/12/31 Python
html5 canvas合成海报所遇问题及解决方案总结
2017/08/03 HTML / CSS
html5.2 dialog简介详解
2018/02/27 HTML / CSS
日本土著品牌,综合型购物网站:Cecile
2016/08/23 全球购物
美国礼品卡商城: Gift Card Mall
2017/08/25 全球购物
6PM官网:折扣鞋、服装及配饰
2018/08/03 全球购物
伯克斯奥特莱斯:Burkes Outlet
2019/03/30 全球购物
Mamaearth官方网站:印度母婴护理产品公司
2019/10/06 全球购物
总经理秘书工作职责
2013/12/26 职场文书
消防器材管理制度
2014/01/28 职场文书
开办大学饮食联盟创业计划书
2014/01/29 职场文书
生产厂长岗位职责
2014/02/21 职场文书
班级读书活动总结
2014/06/30 职场文书
新学期标语
2014/06/30 职场文书
群众路线教育实践活动实施方案
2014/10/31 职场文书
2015年客房服务员工作总结
2015/05/15 职场文书
Python数据结构之队列详解
2022/03/21 Python