Nove metode za rad sa nizovima

Array.from()

Korišćenjem metode „from()“ možemo od „array-like“ ili „iterable“ napraviti niz:

ES2015

Array.prototype.find()

Ova metoda vraća prvi član niza koji zadovoljava uslov (uslov u okviru callback funkcije). Callback funkciji metoda prosledjuje tri parametra:

  • vrednost člana niza
  • indeks člana niza
  • niz (nad kojim se izvršava metoda)

Pored callback funkcije može (opciono) da se prosledi i argument thisArg, koji definiše na šta će da ukazuje rezervisana reč this u okviru callback funkcije.

Primer

Metoda findIndex() radi sličnu stvar, stim što umesto prvog elementa koji je zadovoljio uslov, vraća njegov index u nizu.

Read more

„Object literal“ poboljšanja

Skraćena notacija za dodeljivanja promenjive Poznato je da je moguće na osnovu promenjive i njene vrednosti, napraviti svojstva nekog objekta, postupak koji se koristio je bio sledeći:

Sada sa novim standardom možemo ovo da skratimo:

Skraćena notacija definisanja metoda Za definisanje metode objekta nije više potrebna ključna reč function i dvotačka. Tako da … Read more

Podrazumevane vrednosti parametara funkcije

Uvod U dosadašnjoj praksi (ES5) se koristio sledeći pristup definisanju podrazumevanih vrednosti parametara funkcje:

Problem se javlja kada se prosledi neka vrednost koju kompajler implicitno konvertuje u logičku vrednost „false“ (npr. nula), pa zbog toga umesto nje uzima podrazumevanu vrednost:

Stoga je potrebno da poboljšamo uslov:

ES2015 sintaksa Uz novi standard je … Read more

let & const

Zajedničke karakteristike Block scope Ključne reči let i const ispred promenjive deklariše promenjivu, koja je dostupna jedino u svom lokalnom domenu tzv. „block scope“. Kada se promenjiva deklariše sa let/const u okviru vitičaste zagrade, onda su vitičaste zagrade ivice njenog domena.

Nema hoistovanja promenjive pri kompajliranju Promenjive deklarisane sa „let/const“ se ne hoist-uju na … Read more

Prikupljanje podataka iz forme sa FormData interfejsom

Uvod

js this

Korišćenje FormData interfejsa prilično olakšava rad sa formama, jer je u stanju da jednostavno pokupi sve vrednosti input-a u formi i sačuva ih u objektu u vidu key/value parova.
Dodatna prednost nad standardnim metodom vezana je za olakšano pisanje serverskog koda. Sa standardnim metodom moramo dodati određeni kod na strani servera koji bi dolazne podatke obradio na specijalizovan način, dok sa FormData to nije potrebno, jer je poslati kod standardizovan i debug-ovan! Treba naglasiti da u formi svi HTML input tag-ovi moraju da imaju atribut ‘name’, jer FormData preko njega ima pristup vrednostima input-a.

Read more

„Async/Await“ sintaksa za bolje „Promise“

Uvod

asyn/await

Korišćenje samo jednog promisa je jasno i jednostavno, medjutim kada se program zakomplikuje asinhronom logikom, rad sa promisima se rapidno otežava. Sa ES2017 standardnom je stigla i nova sintaksa „async/await“, koja olakšava rad sa promisima, i omogućava jednostavnije predstavljanje serije asinhronih promisa. Korišćenje „async/await“ sintakse nam omogućava da višestruke medjusobno zavisne asinhrone radnje, prikažemo čitljivije i tako izbegnemo tzv. „promise hell“. Treba napomenuti da se uz async funcije ne mogu koristiti „obične“ callback funkcije.

„Async/await“ sintaksa ne isključuje promise, nego menja način „konzumacije“ promisa. Async/Await sintaksa nam omogućava da pišemo asinhroni kod prema sekvencijalnom redosledu izvršavanja tako da liči na sinhroni kod.

Chrome DevTools

Uvod

chrome devtools

U ovome članku je napravljen pregled specijalizovanih alata u okviru „Chrome“ browsera, pod nazivom „DevTools“. Chrome DevTools su nezamenjivi set alatki namenjeni web developerima kao pomoć u svakodnevnom radu. Kroz DevTools je omogućen pregled HTML stranice i rad sa DOM elementima, kao i pristup svim CSS svojstvima elemenata.
U ovom paketu alata je naručita pažnja posvećena delu za debagovanje JavaScript koda. Koristeći ovoj alat je omogućeno definisanje raznih načina prekidanja izvršavanja progamskog koda (tzv. breakpoint), što znatno olakšava rad web developerima pri otklanjanju bagova na vebsajtovima. Pri svakom prekidu je omogućen uvid u vrednosti promenjiva kao i njenih oblasti definisanosti.
Pored ovoga postoje sekcije vezane za praćenje performansi web aplikacije, kao i pregled razmene podadaka izmedju klijenta i servera.

Read more

Tipovi podataka u JavaScriptu

Podela tipova podataka

tipovi podataka u javascriptu

U okviru JavaScript-a ima 7 vrsta podataka. Podaci mogu da se podele u dve grupe:
a) Podaci koji čuvaju primitivni tip vrednosti:

  • 1) string
  • 2) number
  • 3) boolean
  • 4) undefined
  • 5) null
  • 6) symbol (ES2015)

b) Podaci koji čuvaju referentni tip vrednosti:

  • 7) objekat
    • array
    • Map (ES2015)
    • WeekMap (ES2015)
    • Set (ES2015)
    • WeekSet (ES2015)

Read more

JS snippets razno (tips & tricks)

Pozajmljivanje metode iz drugog objekta

Metode call, apply i bind se koriste da definišu značenje rezervisane reči this, medjutim to nam takodje omogućava da sa promenom značenja „this“ objekat može da „pozajmi“ metodu drugog objekata, kao u sledećem primeru:

Čest je slučaj da se pozamljuje neka od metoda Array-a koji su ugradjenih u njegov prototype objekat.

Na ovaj način smo pozajmili Array-ovu metodu slice nekom objektu.

Read more

Simbioza JavaScripta i njegovog okruženja

Uvod

asnhorni JS okruzenje

JavaScript je skriptni jezik, stoga je neophodno da se „smesti“ u neki kontejner koji bi mu omogućio rad, taj kontejner se zove JS Runtime Environment (srp. okruženje). Postoje dva tipa okruženja: browser (za rad na klijentu) i node.js (za rad na serveru). Runtime Environment čine :

  1. JS Engine/Runtime
    • Heap
    • Stack
  2. External API
  3. Queue
  4. Event loop

OBJAŠNJENJE:
JavaScript je „single thread“ programski jezik i on sam ne može da izvršava više istovremenih paralelnih radnji. Ipak izvršavanje više paralelnih radnji (tzv. asihrono izvršavanje) je moguće uz medjusobnu saradnju JavaScript-a i njegovog okruženja. Više o ovome prolitajte u članku „Princip rada asinhronog JavaScript-a“.

Read more