Soy nuevo en JavaScript. Por favor, perdone mi falta de vocabulario JS.
Tengo tres archivos:
índice.html
<body> <h1>JavaScript Testing Zone</h1> <script src="/main.js" type="module"></script> </body>principal.js
import { sitesMod } from "/sites.js"; sitesMod(); console.log(sites);sitios.js
function sitesMod() { var sites = [ 'https://site1.org/', 'https://site2.org/', 'site3.org/' ]; } export { sitesMod };index.html ejecutará el archivo main.js.
main.js importará y ejecutará la función sitesMod() desde sites.js
console.log(sites); debe generar https://site1.org/,https://site2.org/,https://site3.org/
en su lugar, console.log(sites); sites is not defined
Me doy cuenta de que necesito declarar algo como var sites = X en main.js , pero no estoy seguro de cómo transferir el contenido de los var sites en sites.js a los var sites en main.js
Hasta ahora, el uso de los módulos de importación y exportación parece estar llevándome en la dirección correcta. Necesito salvar el paso final de transferir los datos de la variable de un archivo a otro.
Espero haber podido describir mi problema de una manera inteligible. Por favor, hágamelo saber si puedo aclarar la pregunta. Gracias.
Hay dos problemas aquí. sitesMod es una función sin valor de retorno, por lo que cuando lo llama en main.js no sucede nada. Cambia la función a:
function sitesMod() { var sites = [ 'https://site1.org/', 'https://site2.org/', 'site3.org/' ]; return sites; } El segundo problema es con la forma en que está usando la función. Simplemente llamar a la función no declara una variable ( sites ) fuera del cuerpo de la función. Para acceder a la variable de sites puedes hacer esto:
import { sitesMod } from "/sites.js"; console.log(sitesMod());No probé el código.
function sitesMod() no return nada y ejecutarla no crea una variable global llamada sites
Una solución es
sitios.js
function sitesMod() { var sites = [ 'https://site1.org/', 'https://site2.org/', 'site3.org/' ]; return sites; }principal.js
import { sitesMod } from "/sites.js"; const sites = sitesMod(); console.log(sites);Sin embargo, debido a la naturaleza trivial de sites.js, estaría más inclinado a simplificar el código como
sitios.js
const sites = [ 'https://site1.org/', 'https://site2.org/', 'site3.org/' ]; export { sites };principal.js
import { sites } from "/sites.js"; console.log(sites);Hermano, he notado dos errores en tu código:
.js y .html , está apuntando a la carpeta raíz del sistema (por ejemplo, type="/main.js" , import { sitesMod } from "/sites.js"; ). Para señalar la carpeta real donde está su carpeta, use ./main.js por ejemplo y no solo / , o simplemente elimínelo, es lo mismo; import { sitesMod } from "/sites.js"; sitesMod(); console.log(sites);Estan equivocados. En cambio, hay dos formas:
site.js : function sitesMod() { var sites = [ 'https://site1.org/', 'https://site2.org/', 'site3.org/' ]; return sites; } En main.js :
import { sitesMod } from "./sites.js"; console.log(sitesMod());console.log() directamente dentro de la función; el primero es mejor ;): function sitesMod() { var sites = [ 'https://site1.org/', 'https://site2.org/', 'site3.org/' ]; console.log(sites); } export { sitesMod }; Consejo : vea más sobre el alcance y la diferencia entre var , let y const y también más sobre Linux (comprenderá / y ./ ) y mucho más.
Espero haberte ayudado, buenos estudios XD
Mi inglés apesta, así que perdóname por algo...