Modularno programiranje sa ES6

Karakteristike ES6 modula

es6 modul

Sa novom verzijom JavaScript-a ES6 dolazi integrisana podrška za modularno programiranje.

  • Podržava module koji se smeštaju u datoteke – jedan modul po datoteci
  • Moduli su jedinstveni primerci, svaki modul se izvršava samo jednom (singleton model).
  • ES6 moduli mogu da rade i sinhrono i asihrono.
  • Podržava “cyclic dependencies”.
  • Sintaksa je još kompaktnija od CommonJS
  • ES moduli imaju statičku strukturu. Pošto je struktura modula nepromenjiva, često je dovoljno da se pregleda kod i shvati šta se gde importuje. Ovo nije slučaj kod dinamičke strukture, gde je često potrebno da se kod izvrši da bi se videlo šta se importuje. Eventualne greške mogu da se nadju i u vreme kompajliranja (sa modul bundler-om), jer se sve radnje vezane za import i export modula odredjuju u tom trenutku.
  • Svi uvezeni elementi su nepromenjivi iz modula koji importuje. Svaka operacija dodeljivanja vrednosti uveženom elementu bi prouzrokovala grešku (TypeError).
  • ES6 se ne pravi kopiju svojstva već deli vezu na to svojstvo. Ovo važi čak i za deljenje primitivnih svojstava (“broj” ili “string”). U narednom primeru vidimo da ukoliko matični modul promeni vrednost deljenog svojstva (promena je izvršena metodom iz matičnog modula!), modul koji je importovao to svojsto “vidi” tu promenu.
    PRIMER
    proracun.js

    main.js

    Importujemo sve elemente koji su eksportovani iz modula “proracun.js”

    Ako bi se sada koristila promenjiva “brojač” u nekom “trećem” modulu imala bi vrednost 2.

Continue reading…


Modularno programiranje – eksterna sintaksa (AMD & CommonJS)

Uvod

Externe sintakse nisu JavaScript biblioteke, već odgovarajuće specifikacije i konvencije za definisanje modula. Eksterna sintaksa može da se koristi jedino uz pomoć modul loader-a koji joj “udahnu život”. Ako modul loader podržava sintaksu to znači da unutar sebe sadrži ugradjene metode koje su prethodno zamišljene da se koriste kroz odredjenu sintaksu.
Prednost korišćenja ovih eksternih sintaksi u odnosu na native ES5 modul patern je ta što ne zagadjuje globalni domen nazivima modula i što je omogućen rad dependencies menadžera.

  • Asynchronous Module Definition (AMD) kao što mu i samo ime kaže, podržava asihrono učitavanje modula što je pogodno za rad sa modulima u browser-u.
  • CommonJS učitava module sinhrono i zbog toga se najčešće koristi za rad sa modulima na serverskoj strani u okruženju node.js. Iako nije planiran za rad u browser-u, uz pomoć “modul bundler-a” je moguće da prilagoditi CommonJS radu u browser-u.
  • Universal module definition (UMD) je kompatibilan i sa AMD i sa CommonJS definicijom i koristi se uglavnom ukoliko ima potrebe da se isti modul učitava na serveru i u browser-u.

OBJAŠNJENJE:
CommonJS, AMD ili UMD nisu JavaScript biblioteke. To su organizacije za standardizaciju, kao što je ECMA (definiše specifikaciju jezika za JavaScript) ili W3C (definiše JavaScript web API, kao što su DOM ili DOM događaji). Cilj CommonJS ili AMD sintaksi je definisanje API-ja za rad sa modulima.

Continue reading…


Modularno programiranje sa ES5

Uvod

es5

ES5 verzija JavaScript-a nema podršku za module, ali bez obzira na to je moguće držeći se odredjenih principa napraviti aplikacije u maniru modularnog programiranja. Module sa svojim enkapsuliranim kodom kreiramo koristeći “Immediately-Invoked Function Expressions” ili sa konstruktor funkcijom. API modula koji treba da bude javan jednostavno vratimo unutar funkcije sa rezervisanom reči return. Ovo je jednostavan šablon i može se primeniti bilo gde bez dodatnih biblioteka. U okviru jednog fajla je moguće definisati više modula.

Pored navedenih prednosti ovaj pristup ipak ima i svojih mana:

  • “zagadjivanje” globalnog domena nazivima modula, mada je body modula skriven korišćenjem funkcija (IIFE) u lokalni domen.
  • “ručno” odredjivanje redosleda učitavanja modula a redosled učitavanja modula može biti prilično komplikovan kod velikih i kompleksnih aplikacija.
  • nije moguće asihrono učitavanje

Ovi šabloni nisu savršeni i imaju svoje mane ali bez obzira na mane, kod je razumljiviji jer je bolje organizovan.

Continue reading…


Uvod u modularno programiranje

Karakteristike modularnog programiranja

modularno programiranje kocka

Modularni koncept programiranja je trenutno jedan od najzastupljenijih koncepata u modernom programiranju sa Javascript-om. Zasniva se na razbijanju jedne velike aplikacije na manje, enkapsulirane, nezavisne delove koda – module. Cilj modularnosti jeste da se smanji kompleksnost prema principu “podeli pa vladaj”. Najznačajnije prednosti modularnog programiranja su:

  • preglednija i razumljivija aplikacija
  • lakše kontrolisanje domena promenjivih
  • sprečeno “zagadjenje globalnog domena”
  • ponovna upotrebljivost koda
  • mogućnost rada na istom projektu više različitih timova ili programera koji rade odvojene manje zadatke.
  • lakše debagovanje

Continue reading…