需求
动态添加商品规格,并给规格设置若干属性
最后根据添加的规格属性,匹配出商品的所有规格属性
规格及其对应的规格属性数据
var data = [
{
name: '颜色',
specs: ['白色', '黑色']
},
{
name: '尺寸',
specs: ['L', 'M', 'S']
},
{
name: '口味',
specs: ['咸', '甜']
}
]
最终数据格式
代码
1、使用for循环
// 两个数组相乘,把两个数组中的每一项和另一个数组的每一项相匹配
function arrayMultiply(arr1, arr2) {
var arr = []
for (var i = 0; i < arr1.length; i++) {
for (var j = 0; j < arr2.length; j++) {
if (Array.isArray(arr2[j])) {
arr.push([arr1[i], ...arr2[j]])
} else {
arr.push([arr1[i], arr2[j]])
}
}
}
return arr;
}
// 组合数据,把规格属性互相匹配
function combinationData(data) {
var arrData = []
for (var i = data.length - 1; i > 0; i--) {
// 循环调用arrayMultiply方法
if (i === data.length - 1) {
arrData = arrayMultiply(data[i - 1].specs, data[i].specs)
} else {
arrData = arrayMultiply(data[i - 1].specs, arrData)
}
}
return arrData;
}
var resultList = arrangeData(data);
// 如果需要是对象的话,转一下对象
var objArr = []
for (var i = 0; i < resultList.length; i++) {
objArr.push({
...resultList[i]
})
}
console.log(objArr);
2、笛卡尔积
function getCombination(array) {
let resultArry = []
array.forEach((arrItem) => {
if (resultArry.length === 0) {
resultArry = arrItem.specs;
} else {
const emptyArray = [];
resultArry.forEach((item) => {
arrItem.specs.forEach((value) => {
if (Array.isArray(item)) {
emptyArray.push([...item, value])
} else {
emptyArray.push([item, value])
}
})
})
resultArry = emptyArray
}
})
return resultArry
}
var resultList = getCombination(data)
console.log(resultList)
3、使用map函数生成笛卡尔积
扫描二维码关注公众号,回复:
16433463 查看本文章
function combine(arr){
let result = [
[]
]
arr.map(x => {
var res = []
result.map(y => {
x.specs.map(z => {
res.push([...y, z])
})
})
result = res
})
return result;
}
var resultList = combination(data);
console.log(resultList)
4、递归
function combination(arr) {
var r = [];
(function f(t, a, n) {
if (n == 0) return r.push(t);
for (var i = 0; i < a[n - 1].specs.length; i++) {
f(t.concat(a[n - 1].specs[i]), a, n - 1);
}
})([], arr, arr.length);
return r;
}
var resultList = combination(data);
console.log(resultList)