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

前言

这几天公司出的题目,之前项目中写过一个类似的,但是写的很猥琐(一些表现是通过频繁操作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框架页面表现会更加简单)

总结

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

(0)

相关推荐

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

    前言 这几天公司出的题目,之前项目中写过一个类似的,但是写的很猥琐(一些表现是通过频繁操作DOM实现的),借着有奖励的机会重写了一下. sku: SKU=Stock Keeping Unit(库存量单位).即库存进出计量的基本单元,可以是以件,盒,托盘等为单位.SKU这是对于大型连锁超市DC(配送中心)物流管理的一个必要的方法.现在已经被引申为产品统一编号的简称,每种产品均对应有唯一的SKU号.单品:对一种商品而言,当其品牌.型号.配置.等级.花色.包装容量.单位.生产日期.保质期.用途.价格.

  • IDEA教程之Activiti插件图文详解

    本文作者:Spring_ZYL 文章来源:https://blog.csdn.net/gozhuyinglong 版权声明:本文版权归作者所有,转载请注明出处 一.安装Activiti插件 1.搜索插件 点击菜单[File]-->[Settings...]打开[Settings]窗口. 点击左侧[Plugins]按钮,在右侧输出"actiBPM",点击下面的[Search in repositories]链接会打开[Browse Repositories]窗口. 2.开始安装 进入[Browse

  • Angular4学习教程之DOM属性绑定详解

    前言 DOM 元素触发的一些事件通过 DOM 层级结构传播,事件首先由最内层的元素开始,然后传播到外部元素,直到它们到根元素,这种传播过程称为事件冒泡.本文主要介绍了关于Angular4 DOM属性绑定的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧. 简介 使用插值表达式将一个表达式的值显示在模版上 <img src="{{imgUrl}}" alt=""> <h1>{{productTitle}}</h1&

  • Zend Framework入门教程之Zend_Session会话操作详解

    本文实例讲述了Zend Framework入门教程之Zend_Session会话操作.分享给大家供大家参考,具体如下: 会话命名空间 实现会话 代码: <?php require_once "Zend/Session/Namespace.php"; $myNamespace = new Zend_Session_Namespace('Myspace'); if(isset($myNamespace->numberOfPageRequests)) { $myNamespace

  • Zend Framework教程之Zend_Layout布局助手详解

    本文实例讲述了Zend Framework教程之Zend_Layout布局助手.分享给大家供大家参考,具体如下: 一.作用 布局的作用和模版的作用类似.可以认为是把网站通用.公共的部分拿出来作为通用的页面框架.例如一个基本的web页面,可能页面的头和尾都是一样,不一样的可能只是内容body部分不一样,可以把公共的部分做成模版.不仅可以提高开发效率,也为后期的维护带来方便. 二.使用 这里举一个简单的例子. 首先用zend studio创建一个基本的zend framework项目:layout_

  • Zend Framework教程之Application用法实例详解

    本文实例讲述了Zend Framework教程之Application用法.分享给大家供大家参考,具体如下: Zend_Application是Zend Framework的核心组件.Zend_Application为Zend Framework应用程序提供基本功能,是程序的入口点.它的主要功能有两个:装载配置PHP环境(包括自动加载),并引导应用程序. 通常情况下,通过配置选项配置Zend_Application构造器,但也可以完全使用自定义方法配置.以下是两个使用用例. Zend_Appli

  • Zend Framework教程之Zend_Controller_Plugin插件用法详解

    本文实例讲述了Zend Framework教程之Zend_Controller_Plugin插件用法.分享给大家供大家参考,具体如下: 通过Zend_Controller_Plugin可以向前端控制器增加附加的功能.便于w一些特殊功能.以下是Zend_Controller_Plugin的简单介绍. Zend_Controller_Plugin的基本实现 ├── Plugin │   ├── Abstract.php │   ├── ActionStack.php │   ├── Broker.p

  • Python基础教程之tcp socket编程详解及简单实例

    Python tcp socket编程详解 初学脚本语言Python,测试可用的tcp通讯程序: 服务器: #!/usr/bin/env python # -*- coding: utf-8 -*- import socket import threading import time def tcplink(sock, addr): print('Accept new connection from %s:%s...' % addr); sock.send(b'Welcome!!!'); whi

  • Angular2学习教程之TemplateRef和ViewContainerRef详解

    TemplateRef 在介绍 TemplateRef 前,我们先来了解一下 HTML 模板元素 - <template> .模板元素是一种机制,允许包含加载页面时不渲染,但又可以随后通过 JavaScript 进行实例化的客户端内容.我们可以将模板视作为存储在页面上稍后使用的一小段内容. 在 HTML5 标准引入 template 模板元素之前,我们都是使用 <script> 标签进行客户端模板的定义,具体如下: <script id="tpl-mock"

  • SpringMVC教程之json交互使用详解

    json数据交互 1.1 @RequestBody 作用:@RequestBody注解用于读取http请求的内容(字符串),通过springmvc提供的HttpMessageConverter接口将读到的内容转换为json.xml等格式的数据并绑定到controller方法的参数上. 本例子应用:@RequestBody注解实现接收http请求的json数据,将json数据转换为Java对象 1.2 @ResponseBody 作用:该注解用于将Controller的方法返回的对象,通过Http

随机推荐