Document

[[oktatas:web:javascript|< JavaScript]] ====== JavaScript modulok ====== * **Szerző:** Sallai András * Copyright (c) 2021, Sallai András * Szerkesztve: 2021, 2022 * Licenc: [[https://creativecommons.org/licenses/by-sa/4.0/|CC Attribution-Share Alike 4.0 International]] * Web: https://szit.hu ===== Modulokról ===== Kétféle modult használatos * **ES6** - **böngészők** számára tervezve * **CommonJS** - nem böngészők számára tervezve - **Node.js** Az **ES6** modul böngészőkben is használható modul. Arról ismerhetjük fel, hogy export, import utasításokat használ: * export * import A **CommonJS** szabvány felismerhető a következő utasításokról: * require() * module.exports ===== ES modul ===== Legyen egy modules könyvtár amelyben egy employee.js állományban egy Employee osztályt tartunk:


export class Employee {
    static create(name) {
        return 'hello ' + name;
    }
}

Az app.js fájlban használatba vesszük a modult, az import paranccsal:


import { Employee } from "./modules/employee.js";

const egy = Employee.create('Para Béla'); 

console.log(egy);

==== Futtatás böngészőből ==== Az index.html fájlba ezt írjuk:

Vegyük észre a type attribútumot. ==== Futtatás node paranccsal ==== A futtatáshoz szükség van a package.json fájlban egy type tulajdonságra, module értékkel:


{
    "type": "module",
}

Ezzel megmondjuk, hogy ES6 modulként szeretnénk futtatni. node app A package.json fájl, type tulajdonság lehetőség előtt a fájlok kiterjesztése ES6 modul esetén .mjs volt, így lehetett futtatni Node.js-el is. Node.js modult ezzel szemben .cjs kiterjesztéssel látták el. ===== ES6 elnevezett függvény exportja ===== Nulla vagy több exportált modul.





    
    
    Document


    Karakterlánc


import { egy } from './modul.js';

console.log(egy())


export var egy = () => {
    return 'bármi';
}


{
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "lite-server"
  },
  "devDependencies": {
    "lite-server": "^2.6.1"
  }
}

Az importálás során { } párost kell használni, ebbe kell beírni az importált függvényt nevét. Az importálás módja határozza meg, hogy kell írni { } kapcsos-zárójeleket. ===== ES6 elnevezett osztály exportja ===== Nulla vagy több exportált modul.





    
    
    Document


    Karakterlánc


import { Egy, Ketto} from './modul.js';

console.log(new Egy().ker())
console.log(new Ketto().csinal())



export class Egy {
    ker() {
        return 'valami';
    }
}

export class Ketto {
    csinal() {
        return 'ezaz';
    }
}


{
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "lite-server"
  },
  "devDependencies": {
    "lite-server": "^2.6.1"
  }
}

Az importálás során { } párost kell használni, ebbe kell beírni az importált függvényt nevét. Az importálás módja határozza meg, hogy kell írni { } kapcsoszárójeleket. ===== ES6 default export ===== Egyetlen exportált elem (modul) esetén használjuk.





    
    
    Document


    Karakterlánc

Nem használunk {} az "egy" körül:


import egy from './modul.js';

console.log(egy())

Névtelen függvényt használunk:


export default () => {
    return 'bármi';
}


{
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "lite-server"
  },
  "devDependencies": {
    "lite-server": "^2.6.1"
  }
}

Ahol importáljuk a modult, az elnevezés tetszőleges, mivel a modulnak nincs neve. ===== ES6 default export osztállyal ===== Egyetlen névtelen osztály esetén használjuk.





    
    
    Document


    Karakterlánc

Nem használunk {} az "egy" körül:


import egy from './modul.js';

console.log(new egy().ker())

Névtelen osztályt használunk:


export default class {
    ker() {
        return 'valami';
    }
}


{
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "lite-server"
  },
  "devDependencies": {
    "lite-server": "^2.6.1"
  }  
}

===== Több függvény exportálása ES6 esetén =====



function calcRadius(side, alpha) {
    if(!isValidInput(side)) {
        throw new Error('Hiba! Az oldal érték hibás!')
    }
    if(!isValidInput(alpha)) {
        throw new Error('Hiba! Az szög érték hibás!')
    }
    let rad = alpha * Math.PI / 180
    return 1.0/2.0 * side * Math.sin(rad)
}

function isValidInput(input) {
    let inputStr = String(input)
    if(!inputStr.match(/^[0-9]+$/)) {
        return false
    }
    if(input <= 0) {
        return false
    }
    return true
}

export { calcRadius, isValidInput }

===== Link ===== * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export (2022)