(最简易版本1)js笛卡尔积生成商品SKU多规格算法

简介: 首先这篇文章得仔细看,上面是我出的第一版本多规格算法可以去看一下思路,最主要的思路还是来源于递归算法

首先这篇文章得仔细看,上面是我出的第一版本多规格算法可以去看一下思路,最主要的思路还是来源于递归算法


算法版本升级


1.使用Reduce函数来对算法进行升级优化


首先了解一下reduce


reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。


原理还是一个递归,但是reduce更简单


1.1概述

let 结果 = 数组.reduct(累加器, 初始化值)
//累加器
(累加结果, 当前值, 当前索引)=>{
  return 处理结果//这里的处理结果会返回给下一次的累加结果
}

1.2累加和

// reduce 案例1:累加和
let arr = [1,2,3,4,5]
let s = arr.reduce( (sum,current,index)=>{
    return sum + current
} , 0)
console.info(s)

2.使用 reduce函数生成笛卡尔积

let arr = [
    ['红色', '黑色', '白色'],
    ['16G', '32G'],
    ['移动版', '联通版'],
]
let result = arr.reduce((a, b, c) => {
    var res = []
    a.map(x => {
        b.map(y => {
            res.push([...x, y])
        })
    })
    return res
}, [[]])
console.log(result)

1024b19218af40c7a8a6290c6186518d.png

3.生成对象形式的笛卡尔积(这种形式常用与elementui)方便简单

let newArr = [{
        name: 'color',
        data: ['红色', '黑色', '白色'],
    },
    {
        name: 'size',
        data: ['16G', '32G'],
    },
    {
        name: 'banben',
        data: ['移动版', '联通版'],
    }
]
let newResult = newArr.reduce((a, b, c) => {
    let res=[]
    a.map(x=>{
        b.data.map(y=>{
            res.push({...x,[b.name]:y})
        })
    })
    return res
},[{}])
console.log(newResult)

1024b19218af40c7a8a6290c6186518d.png

目录
相关文章
|
25天前
|
JavaScript 测试技术 API
跟随通义灵码一步步升级vue2(js)项目到vue3版本
Vue 3 相较于 Vue 2 在性能、特性和开发体验上都有显著提升。本文介绍了如何利用通义灵码逐步将 Vue 2 项目升级到 Vue 3,包括备份项目、了解新特性、选择升级方式、升级依赖、迁移组件和全局 API、调整测试代码等步骤,并提供了注意事项和常见问题的解决方案。
|
2月前
|
算法 JavaScript 前端开发
第一个算法项目 | JS实现并查集迷宫算法Demo学习
本文是关于使用JavaScript实现并查集迷宫算法的中国象棋demo的学习记录,包括项目运行方法、知识点梳理、代码赏析以及相关CSS样式表文件的介绍。
第一个算法项目 | JS实现并查集迷宫算法Demo学习
|
1月前
|
JavaScript 前端开发 索引
JavaScript ES6及后续版本:新增的常用特性与亮点解析
JavaScript ES6及后续版本:新增的常用特性与亮点解析
26 4
|
8天前
|
JavaScript Linux iOS开发
详解如何实现自由切换Node.js版本
不同的项目中需要使用不同版本的 Node.js,有时旧项目需要旧版本,而新项目则可能依赖最新的 Node.js 版本
|
2月前
vite.config.js中vite.defineConfig is not defined以及创建最新版本的vite项目
本文讨论了在配置Vite项目时遇到的`vite.defineConfig is not defined`错误,这通常是由于缺少必要的导入语句导致的。文章还涉及了如何创建最新版本的Vite项目以及如何处理`configEnv is not defined`的问题。
104 3
vite.config.js中vite.defineConfig is not defined以及创建最新版本的vite项目
|
2月前
|
移动开发 前端开发 JavaScript
JS配合canvas实现贪吃蛇小游戏_升级_丝滑版本_支持PC端和移动端
本文介绍了一个使用JavaScript和HTML5 Canvas API实现的贪吃蛇游戏的升级版本,该版本支持PC端和移动端,提供了丝滑的转向效果,并允许玩家通过键盘或触摸屏控制蛇的移动。代码中包含了详细的注释,解释了游戏逻辑、食物生成、得分机制以及如何响应不同的输入设备。
58 1
JS配合canvas实现贪吃蛇小游戏_升级_丝滑版本_支持PC端和移动端
|
3月前
|
JavaScript 算法 前端开发
JS算法必备之String常用操作方法
这篇文章详细介绍了JavaScript中字符串的基本操作,包括创建字符串、访问特定字符、字符串的拼接、位置查找、大小写转换、模式匹配、以及字符串的迭代和格式化等方法。
JS算法必备之String常用操作方法
|
3月前
|
JavaScript 算法 前端开发
JS算法必备之Array常用操作方法
这篇文章详细介绍了JavaScript中数组的创建、检测、转换、排序、操作方法以及迭代方法等,提供了数组操作的全面指南。
JS算法必备之Array常用操作方法
|
2月前
|
JavaScript Linux 开发者
一个用于管理多个 Node.js 版本的安装和切换开源工具
【9月更文挑战第14天】nvm(Node Version Manager)是一个开源工具,用于便捷地管理多个 Node.js 版本。其特点包括:版本安装便捷,支持 LTS 和最新版本;版本切换简单,不影响开发流程;多平台支持,包括 Windows、macOS 和 Linux;社区活跃,持续更新。通过 nvm,开发者可以轻松安装、切换和管理不同项目的 Node.js 版本,提高开发效率。
|
1月前
|
JavaScript 算法 内存技术
如何降低node.js版本(nvm下载安装与使用)
如何降低node.js版本(nvm下载安装与使用)