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 轻松搞定快捷留言功能 只需一行代码
Apr 01 Javascript
Prototype源码浅析 String部分(二)
Jan 16 Javascript
JavaScript异步编程:异步数据收集的具体方法
Aug 19 Javascript
js中style.display=&quot;&quot;无效的解决方法
Oct 30 Javascript
jquery正则表达式验证(手机号、身份证号、中文名称)
Dec 31 Javascript
js贪吃蛇游戏实现思路和源码
Apr 14 Javascript
javascript表单处理具体实现代码(表单、链接、按钮)
May 07 Javascript
React注册倒计时功能的实现
Sep 06 Javascript
layui-laydate时间日历控件使用方法详解
Nov 15 Javascript
微信小程序发布新版本时自动提示用户更新的方法
Jun 07 Javascript
vue数据响应式原理知识点总结
Feb 16 Javascript
LayUI+Shiro实现动态菜单并记住菜单收展的示例
May 06 Javascript
详解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
丧钟首部独立剧集《丧钟:骑士与龙》北美正式开播,场面血腥
2020/04/09 欧美动漫
MySQL GBK→UTF-8编码转换
2007/05/24 PHP
加强版phplib的DB类
2008/03/31 PHP
php利用header函数实现文件下载时直接提示保存
2009/11/12 PHP
基于HBase Thrift接口的一些使用问题及相关注意事项的详解
2013/06/03 PHP
美图秀秀web开放平台--PHP流式上传和表单上传示例分享
2014/06/22 PHP
PHP生成静态HTML页面最简单方法示例
2015/04/09 PHP
PHP实现即时输出、实时输出内容方法
2015/05/27 PHP
基于php的CMS中展示文章类实例分析
2015/06/18 PHP
最新制作ThinkPHP3.2.3完全开发手册
2015/11/23 PHP
flexigrid 参数说明
2010/11/23 Javascript
Three.js源码阅读笔记(光照部分)
2012/12/27 Javascript
jQuery function的正确书写方法
2013/08/02 Javascript
jquery 页面滚动到指定DIV实现代码
2013/09/25 Javascript
javascript判断数组内是否重复的方法
2015/04/21 Javascript
一步步教大家编写酷炫的导航栏js+css实现
2016/03/14 Javascript
Bootstrap Metronic完全响应式管理模板学习笔记
2016/07/08 Javascript
canvas实现爱心和彩虹雨效果
2017/03/09 Javascript
vue2组件之select2调用的示例代码
2017/10/12 Javascript
微信小程序云开发修改云数据库中的数据方法
2019/05/18 Javascript
vue的$http的get请求要加上params操作
2020/11/12 Javascript
VUE中鼠标滚轮使div左右滚动的方法详解
2020/12/14 Vue.js
[45:56]Ti4正赛第一天 VG vs NEWBEE 3
2014/07/19 DOTA
Django1.7+python 2.78+pycharm配置mysql数据库
2016/10/09 Python
python 读写txt文件 json文件的实现方法
2016/10/22 Python
python僵尸进程产生的原因
2017/07/21 Python
Python基于csv模块实现读取与写入csv数据的方法
2018/01/18 Python
python实现三次样条插值
2018/12/17 Python
详解Matplotlib绘图之属性设置
2019/08/23 Python
Python range与enumerate函数区别解析
2020/02/28 Python
在pycharm中使用matplotlib.pyplot 绘图时报错的解决
2020/06/01 Python
师恩难忘教学反思
2014/04/27 职场文书
反邪教警示教育方案
2014/05/13 职场文书
员工薪酬激励方案
2014/06/13 职场文书
未婚证明范本
2015/06/15 职场文书
2016年第32个教师节红领巾广播稿
2015/12/18 职场文书