JavaScript & ES6 - Modul


Šta je modul u ES6?

Prije ES6, nije postojala izvorna podrška za module u JavaScript. Sve unutar JavaScript aplikacije, na primjer varijable u različitim JavaScript datotekama, dijelile su isti opseg. ES6 uvodi modul zasnovan na datoteci, u kojem je svaki modul predstavljen zasebnom .js datotekom. Sada izjavu za izvoz ili uvoz u modulu možete koristiti za izvoz ili uvoz varijabli, funkcija, klasa ili bilo kog drugog entiteta u i iz drugih modula ili datoteka. Kreirajmo modul tj. JavaScript fajl "main.js" i u njega smjestimo sljedeći kod:

let greet = "Hello World!";
const PI = 3.14; 

function multiplyNumbers(a, b) {
    return a * b;
}

// Izvoz varijabli i funkcija
export { greet, PI, multiplyNumbers };

Sada kreirajte drugi JavaScript fajl "app.js" sa sljedećim kodom:

import { greet, PI, multiplyNumbers } from './main.js';

alert(greet); // Hello World!
alert(PI); // 3.14
alert(multiplyNumbers(6, 15)); // 90

Na kraju kreirajte HTML fajl "test.html" sa sljedećim kodom i otvorite ovu HTML datoteku u svom pretraživaču pomoću HTTP protokola (ili koristite localhost). Takođe primijetite type="module" na oznaci skripte.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>ES6 Moduli</title>
</head>
<body>
    <script type="module" src="app.js"></script>
</body>
</html>