79 TS – Moduli

Un modulo è un file di javascript il cui contenuto è isolato, non si contamina con l’ambiente globale del linguaggio.

Vediamo un esempio, creiamo il file book.ts che contiene la seguente classe

class Book {
    title : string
    author : string
    content : string
    year : number
}

creando un nuovo file, per esempio stories.ts, importiamo il file book.ts al suo interno con il comando import from in modo da implementare il contenuto di tutto il file book.ts dentro a stories.ts

import from './book'

La prima cosa da notare è che con TypeScript non è necessario specificare l’estensione del file.

Se stories.ts si fosse trovato all’interno di una cartella avrei dovuto specificare il percorso

import from './modules/book'

Con il comando import abbiamo detto da quale file caricare, ma per importare ogni oggetto presente nel modulo, dobbiamo specificarlo tra parentesi graffe prima del comando from

import { Book } from './book'

Ancora non è finita, per importare un oggetto dal modulo, da questo dobbiamo anche esportarlo, con il comando export

export class Book {
    title : string
    author : string
    content : string
    year : number
}

Se ora creiamo l’oggetto in stories.ts sulla classe Book, non abbiamo alcun problema

import { Book } from './book';

let book = new Book();

book.year = 2018;

console.log(book);

Quindi, più in generale, quando vogliamo importare degli elementi da un modulo, dopo il comando import dobbiamo elencarli separati da una virgola tra parentesi graffe. Nel modulo dobbiamo esportare quegli elementi che vogliamo importare nell’altro file.

Aggiungiamo un altro elemento in book.ts:

export const Categories = [
    'Storie brevi',
    'sci',
    'gialli',
    'romanzi'
]

export class Book {
    title : string
    author : string
    content : string
    year : number
}

ed ecco stories.ts

import { Book, Categories } from './book';

let book = new Book();

book.year = 2018;

console.log(book);

console.log(Categories);

Importare tutto il contenuto di un modulo

Vediamo invece la procedura per importare tutti gli elementi presenti in un file.

Dopo l’import dobbiamo aggiungere asterisco seguito dalla keyord as e il nome della variabile che conterrà ogni elemento del modulo, infine from e il percorso

import * as books from './book';

se lanciamo un console di books vedremo che conterrà tutti gli oggetti del modulo

console.log(books);

abbiamo accesso a tutti gli elementi esportati nel moidulo, possiamo anche selezionarne solo uno

console.log(books.Categories);

abbiamo sostanzialmente 2 modi o dopo l’import specifichiamo solo l’oggetto che vogliamo importare, oppure importiamo tutto con * assegnando l’output ad una variabile con as. Anche nel primo modo posso assegnare ogni oggetto ad un alias con as

import { Book as MyBook, Categories as MyCategories } from './book';

posso accedere direttamente con l’alias

console.log(MyCategories);

Esportare un elemento predefinito

Se voglio esportare un elemento predefinito che se non viene specificato nessun elemento particolare, comunque questo viene importato, devo utilizzare la keyword default

export default class Book {
    title : string
    author : string
    content : string
    year : number
}

a questo punto assegno un nome per l’alias dopo l’import, senza specificare niente

import MyBookClass from './book';

a questo punto avrò accesso alla classe Book impostata come oggetto esportato di default, tramite l’alias MyBookClass.

Questa sintassi funziona tramite node, se vogliamo includere la stessa sintassi anche nel browser, bisogna includere un gestore di moduli come requirejs, includendone la libreria in un file js, qui la documentazione.