Original link: https://paugram.com/coding/my-ecommerce-sku-add-algorithm.html

This is an algorithm for adding and changing the SKU of e-commerce products that took me several days of trial and error. It may not be particularly elegant, but it can be used normally. This article will briefly talk about the idea. I also gave this “algorithm” a name, called “ladder search method”.

These terms are probably needed to read this article, and you can substitute them in combination with any commodity on a treasure.

• Option group : e.g. size, color
• Option values : e.g. small, large, red, yellow
• SKU : For example, small, red is one of them, the above combination (small, large, red, yellow) will have a total of 2 * 2 = 4

scenes to be used

The usage scenario is to create a product page, and I don’t need to generate SKUs at one time based on the preset “option group” and “option value”. Instead, it provides front-end operations to add SKU data step by step.

For example: create a “color” option group, add “red” and “yellow” option values, here are two SKUs generated

红色黄色

Still don’t get it? Take a look at the two pictures I made:

I also mentioned in my previous diary ” E-commerce SKU Problem”, my old friend (giant) @Eric also gave me some ideas, but I still didn’t follow his ideas (create + sort) in the end. , or use the method I first thought of.

There are a total of three scenarios for inserting the option group to change the SKU. Here I call them “magic modification”, “pinning method” and “additional method”, and use different examples to illustrate the specific algorithm steps and the effects that should be achieved.

magic

The first is the magic reform method. The first “option value” of any “option group” will set the attributes of all SKUs corresponding to the “option group” to the first “option value”.

This is the initial data, and the examples below will use this structure to add in various places.

颜色：红色尺寸：小、中

SKUs are roughly:

红色、小红色、中

Example: Insert a group, and provide the first option value

I want to insert a “style” “option group”, and insert a “classic” in it, what should be the steps?

• “Classic” is the first piece of data in the “Style” option group, and all SKUs are “Classic” by default
• No need to insert any new data

红色、小、经典// <- 被修改的红色、中、经典// <- 被修改的

Pin method

As long as it is not the “option group” with the highest level (here is the color), it will be inserted in multiple batches according to each “option value” of the previous “option group”.

This is the initial data, and the examples below will use this structure to add in various places.

颜色：红色尺寸：小、中风格：经典、现代

SKUs are roughly:

红色、小、经典红色、小、现代红色、中、经典红色、中、现代

Example 1: The last group

I want to insert a “future” in the “option group” of the “style” group, what should be the steps?

• The previous data of “Future” in the “Style” option group is “Modern”, extract all “Modern” and copy one out first
• Look at the value of the “Options Group” “Dimensions” on it, there will be two insertion points in total.
• Divide the extracted “Modern” into two sets of data according to the previous “Option Group” “Size”
• According to the position of the two insertion points, insert two sets of data respectively, and you are done.

红色、小、经典红色、小、现代// <- 被复制的红色、小、未来// <- 新增的红色、中、经典红色、中、现代// <- 被复制的红色、中、未来// <- 新增的

Because the current program design does not allow the SKU to be removed directly, and can only be modified to 0 inventory, there is no problem in doing so.

Example 2: A group in the middle

I want to insert a “large” in the “option group” of the “size” group, what should be the steps?

• The last data of “large” in the “size” option group is “medium”, extract all the “medium” and copy one out first
• Look at the value of the “Option Group” “Color” on it, there will be a total of one insertion point.
• Divide the extracted “middle” into a set of data according to the previous “option group” “color”
• According to the position of an insertion point, insert a set of data respectively, and you’re done

Note that the “color” is only red at this time, which seems to be much worse than the result of the previous example. If you don’t observe carefully, it will be easy to be misled. It is also because of this place that I was confused and wrote two processing logics. , in fact only one is enough (found and merged at the time of writing this article), which will be explained in detail later in the article

红色、小、经典红色、小、现代红色、中、经典// <- 被复制的红色、中、现代// <- 被复制的红色、大、经典// <- 新增的红色、大、现代// <- 新增的

If there are two “colors”, 4 new ones should be copied here:

红色、小、经典红色、小、现代红色、中、经典// <- 被复制的红色、中、现代// <- 被复制的红色、大、经典// <- 新增的红色、大、现代// <- 新增的黄色、小、经典黄色、小、现代黄色、中、经典黄色、中、现代黄色、大、经典// <- 新增的黄色、大、现代// <- 新增的

Append method

If it is the top-level SKU (here is the color), it cannot find the previous layer, so it can only copy all the data at one time and put it at the end.

This is the initial data, and the examples below will use this structure to add in various places.

颜色：红色尺寸：小、中风格：经典、现代

SKUs are roughly:

红色、小、经典红色、小、现代红色、中、经典红色、中、现代

Example: The topmost group

I want to insert a “yellow” in the “option group” of the “color” group, what should be the steps?

• The previous data of “Yellow” in the “Color” option group is “Red”, extract all the “Red” and copy one out first
• Since it is the top-most group, an insertion point (usually the last of the entire SKU array) is determined according to the last piece of “red” data.
• Since it is the top-most group, it does not need to be grouped again
• According to the position of an insertion point, insert a set of data respectively, and you’re done

红色、小、经典// <- 被复制的红色、小、现代// <- 被复制的红色、中、经典// <- 被复制的红色、中、现代// <- 被复制的黄色、小、经典// <- 新增的黄色、小、现代// <- 新增的黄色、中、经典// <- 新增的黄色、中、现代// <- 新增的

Known bugs and solutions

If you insert three groups of blank “option groups” at one time, the first group and the third group of “option groups” have an “option value”, while the second group has no “option value”, insert the second item into the third group “Option value”, there will be an exception that the object cannot be found.

颜色：红色尺寸：风格：经典、现代（插入现代就报错）

There are two solutions to this problem, one is to “continue upward” to find the “option group” with “option value” (and possibly hit the first one that has no value) or provide a front-end shielding operation to prohibit inserting more than one at a time. A blank “Option Group”. Given this complexity, I still choose the latter implementation is simpler.

misguided scene

The last set of examples of pin-in method From the results, it is only necessary to copy all the “modern” and insert directly under it. Since it is the last set of “Option Groups”, SKUs that match the “Option Value” of “Modern” will only have “Modern”.

If it is replaced with the middle set of examples, the SKU that matches “Medium” also includes its subordinate “Classic” and “Modern”. You must copy at least two data of “Classic” and “Modern” together. The concept of “copying a group and inserting a group” came into being. When writing this article, I also corrected the redundant logic of the previous code, which was written based on the “last group” judgment condition.

Summarize

This scene is really a brain-burning pit that I have encountered for the first time when I wrote the front end for so long, so it is worth writing a record. It can be seen that properly brushing programming algorithm questions can indeed expand your thinking, but for a math scumbag like me, it is really brain-burning and cell-burning! My mind turned slowly, and the process was really painful, but after I realized it, the feeling was different, and it was quite a sense of accomplishment.

This article is reproduced from: https://paugram.com/coding/my-ecommerce-sku-add-algorithm.html
This site is for inclusion only, and the copyright belongs to the original author.