La tarea es calcular el producto cartesiano de 2 arrays de JavaScript con la ayuda de JavaScript. Aquí hay algunas técnicas discutidas.
Enfoque 1:
- Crear una nueva array.
- Atraviese la primera array por el bucle exterior y la segunda array por el bucle interior.
- En el ciclo interno, concatene el primer elemento de la array con el segundo elemento de la array y empújelo en una nueva array.
Ejemplo 1: Este ejemplo utiliza el enfoque como se discutió anteriormente.
<!DOCTYPE HTML>
<html>
<head>
<title>
cartesian product of 2 arrays using JavaScript
</title>
</head>
<body style="text-align:center;"
id="body">
<h1 style="color:green;"
id="h1">
GeeksForGeeks
</h1>
<p id="GFG_UP"
style="font-size: 15px;
font-weight: bold;">
</p>
<button onclick="GFG_Fun()">
click here
</button>
<p id="GFG_DOWN"
style="color:green;
font-size: 20px;
font-weight: bold;">
</p>
<script>
var up = document.getElementById('GFG_UP');
var down = document.getElementById('GFG_DOWN');
var arr1 = [
[13, 'G'],
[16, 'C']
];
var arr2 = [
[8, 'F'],
[36, 'P']
];
up.innerHTML = "Click on the button to compute the "+
"Cartesian Product of 2 arrays.<br>Array1-";
var res = "";
for (var i = 0; i < arr1.length; i++) {
res = res + "[" + arr1[i] + "]";
}
up.innerHTML = up.innerHTML + res + "<br>Array2-";
res = "";
for (var i = 0; i < arr2.length; i++) {
res = res + "[" + arr2[i] + "]";
}
up.innerHTML = up.innerHTML + res;
function GFG_Fun() {
var ans = [];
for (var i = 0; i < arr1.length; i++) {
for (var l = 0; l < arr2.length; l++) {
ans.push(arr1[i].concat(arr2[l]));
}
}
res = "";
for (var i = 0; i < ans.length; i++) {
res = res + "[" + ans[i] + "]<br>";
}
down.innerHTML = res;
}
</script>
</body>
</html>
Producción:
- Antes de hacer clic en el botón:
- Después de hacer clic en el botón:
Enfoque 2:
- Crear una nueva array.
- Aquí se sigue el mismo enfoque, para cada elemento de la primera array, cada elemento de la segunda array se concatena y se envía a la nueva array con la ayuda de los métodos .apply() y .map() .
Ejemplo 2: Este ejemplo usa el enfoque como se discutió anteriormente.
<!DOCTYPE HTML>
<html>
<head>
<title>
cartesian product of 2 arrays using JavaScript
</title>
</head>
<body style="text-align:center;" id="body">
<h1 style="color:green;" id="h1">
GeeksForGeeks
</h1>
<p id="GFG_UP"
style="font-size: 15px;
font-weight: bold;">
</p>
<button onclick="GFG_Fun()">
click here
</button>
<p id="GFG_DOWN"
style="color:green;
font-size: 20px;
font-weight: bold;">
</p>
<script>
var up = document.getElementById('GFG_UP');
var down = document.getElementById('GFG_DOWN');
var arr1 = [
[13, 'G'],
[16, 'C']
];
var arr2 = [
[8, 'F'],
[36, 'P']
];
up.innerHTML = "Click on the button to compute"+
" the Cartesian Product of 2 arrays.<br>Array1-";
var res = "";
for (var i = 0; i < arr1.length; i++) {
res = res + "[" + arr1[i] + "]";
}
up.innerHTML = up.innerHTML + res + "<br>Array2-";
res = "";
for (var i = 0; i < arr2.length; i++) {
res = res + "[" + arr2[i] + "]";
}
up.innerHTML = up.innerHTML + res;
function GFG_Fun() {
var ans = [].concat.apply([], arr1.map(
arr1 => (arr2.map(arr2 => arr1.concat(arr2)))));
res = "";
for (var i = 0; i < ans.length; i++) {
res = res + "[" + ans[i] + "]<br>";
}
down.innerHTML = res;
}
</script>
</body>
</html>
Producción:
- Antes de hacer clic en el botón:
- Después de hacer clic en el botón:
Publicación traducida automáticamente
Artículo escrito por PranchalKatiyar y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA