使用javascript进行3个集合并集

Question

function myFunction1() {
var set1 = document.getElementById("myseta").value;
var set2 = document.getElementById("mysetb").value;
var set3 = document.getElementById("mysetc").value;

// calculate the union
var union = set1.concat(set2, set3).filter(function(element, index, array) {
return array.indexOf(element) === index;
});

// [1, 2, 3,]
// document.getElementById("result").innerHTML = set1;
// document.getElementById("union").innerHTML = set1;
}

我想要得到3个集合的并集然后在结果中显示出来，我很困惑实际上我们还需要在Venn中显示结果就说

Answer 1

根据你的问题和你的各种评论，这里有一个"并"one_answers"交集"的解决方案。您可以添加'difference'和'complement':

function analyzeFunction(type) {
let set1 = document.getElementById("mySetA").value.split(/[, ]+/);
let set2 = document.getElementById("mySetB").value.split(/[, ]+/);
let set3 = document.getElementById("mySetC").value.split(/[, ]+/);
let combined = set1.concat(set2).concat(set3);
let result = 'FIXME';
if(type === 'union') {
result = Object.keys(combined.reduce((acc, val) => {
acc[val] = true;
return acc;
}, {})).join(', ');
} else if(type === 'intersection') {
result = combined.reduce((acc, val) => {
if(!acc[val]) {
acc[val] = 0;
}
acc[val] += 1;
return acc;
}, {});
result = Object.keys(result).filter(val => result[val] >= 3).join(', ');
} // etc for 'difference' and 'complement'
console.log(result);
document.getElementById("result").textContent = result;
}

<label>Set A:</label>
<input type="text" id="mySetA" value="1, 2, 3"/><br/>
<label>Set B:</label>
<input type="text" id="mySetB" value="3, 4, 5"/><br/>
<label>Set C:</label>
<input type="text" id="mySetC" value="3, 4, 6"/><br/>
<label>Result:</label>
<span id="result"></span>
<hr/>
<button type="button" onclick="analyzeFunction('union')">Union</button>
<button type="button" onclick="analyzeFunction('intersection')">Intersection</button>
<button type="button" onclick="analyzeFunction('difference')">Complement</button>
<button type="button" onclick="analyzeFunction('complement')">Difference</button>

Answer 2

试试这个

Codepen

使用句号作为值之间的分隔符

<label>Set A</label>
<input type="text" id="myseta" value="1,2,3">
<label>Set B</label>
<input type="text" id="mysetb" value="2,3,5">
<label>Set C</label>
<input type="text" id="mysetc" value="9,2,7" >
<label>Result</label><span id="res"></span> <hr>
<button type="button" onclick="unionFunction()">Union</button>
<button type="button" onclick="intersectionFunction()">Intersection</button>
<button type="button" onclick="differenceFunction()">Complement</button>
<button type="button" onclick="complementFunction()">Difference</button>

功能

function unionFunction(getarray = false) {
// first we get the values
var set1 = document.getElementById("myseta").value;
var set2 = document.getElementById("mysetb").value;
var set3 = document.getElementById("mysetc").value; 
// then we can simply make a new Set
let union = new Set()
// we get 3 arrays of each set by 
let arr1 = set1.split(',')
let arr2 = set2.split(',')
let arr3 = set3.split(',')

// when we push same values in the set they won't work
arr1.forEach((elem) => union.add(elem))
arr2.forEach((elem) => union.add(elem))
arr3.forEach((elem) => union.add(elem))

// we print it
if (getarray) {
return Array.from(union);
} else {
document.getElementById("res").innerHTML =     Array.from(union).join(' , ');
}
}
function intersectionFunction(getarray = false) {
// first we get the values
var set1 = document.getElementById("myseta").value;
var set2 = document.getElementById("mysetb").value;
var set3 = document.getElementById("mysetc").value; 
// we get 3 arrays of each set by 
let arr1 = set1.split(',')
let arr2 = set2.split(',')
let arr3 = set3.split(',')

/* this function will make a new array 
intersection , based on filtering the arr1
by checking if the value exist in array2 */
let intersection = arr1.filter(value => arr2.includes(value));

/* then we can find intersection between our 
result and the arr3 */
intersection = intersection.filter(value => arr3.includes(value));

// we print it
if (getarray) {
return intersection
} else {
document.getElementById("res").innerHTML = intersection.toString();
}
}

function differenceFunction() {
// let do it a different way :D , find the union
let union = unionFunction(true)
// then find the intersection
let intersection = intersectionFunction(true)
// then remove the union from intersection this will be teh difference
let difference = union.filter(value => !intersection.includes(value));

// we print it
document.getElementById("res").innerHTML = difference.toString();
}