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.

Konvertovanje array like objekata u niz

js this

U JavaScript-u se javljaju “array-like” objekti, koji liče na nizove ali nisu nizovi (npr. NodeList). Takvi objekti nemaju sve metode koje ima standardni niz npr. slice, concat, sort, reduce, map, filter… Takodje može da se javi potreba da prebacimo objekat arguments koji čuva u sebi argumente funkcije u niz ili čak da prebacimo string u niz. Konvertovanje “array like” objekata u standardni niz, možemo uraditi na više načina:

“Array-like” objekat možemo lako da konvertujemo u niz sa metodom slice(). Ali metoda slice() nije dostupna, stoga moramo da koristimo metodu call() da bi “pozajmili” metodu slice() od nizova. Pa bi krajnji izraz izgledao ovako:

Ukoliko ima dosta manipulacije sa DOM-om i arrayLike objektima, dobro je napraviti funkciju, i pozivati je kad god je potrebno:

Koristeći funkciju from() koja lako konvertuje sve array-like elemente u standardni niz

  • arrayLike – naziv elementa koji treba da se prebaci u niz
  • nekaMapFunkcija – Opciona Map funkcija koja moze da se pozove za svaki element niza
  • thisArg – vrednost na koju će da ukazuje ključna reč this u okviru map funkcije

Koristeći jQuery.makeArray() funkciju jednostavno prebacujemo array-like
objekte u niz:

Provera promenjive sa “!!” operatorom

Ukoliko se javi potreba da se proveri da li neka promenjiva postoji i da li ima validnu vrednost, najlakši način je koristiti izraz !!variable. Ovaj izraz automatski prebacuje u boolean-ovu vrednost, a ukoliko je vrednost promenjive undefined, “”, 0, null, or NaN vraća FALSE u suprotnom vraća TRUE. Isti efekat se dobija korišćenjem funkcije Boolean(el).

Primer

Sakrivanje slika sa greškom

Targetovanje slika sa greškom je moguće zahvaljujući tome što browser okida error dogadjaj kada ne može da nadje sliku.

Sticky header

See the Pen Lepljivi Naslov by Web programiranje (@chos) on CodePen.

NAPOMENA:
Objekat classList nije podržan kod IE za verzije manje od IE10

Scroll to the top

HTML

JavaScript

Detekcija Browser-a

Efekti: fadeOut & fadeIn

Primer

See the Pen FadeOut/FadeIn efekat by Web programiranje (@chos) on CodePen.

Primer

See the Pen Fadeout/Fadein jQuery by Web programiranje (@chos) on CodePen.


Zamena dela teksta u string-u

Zamena dela teksta u string-u se vrši sa string metodom replace(). Ova metoda vraća novi string sa zamenjenim delovima:

regex je ili literal ili RegExp konstruktor koji kreira regular expression patern. Najčešći flags koji se koriste su:

  • g – globalno nalazi sva poklapanja (ukoliko ga nema pretraga staje kad nadje prvo poklapanje!)
  • i – ignoriše veličinu slova
Primer

Pretraga string-a

Metoda String.prototype.indexOf() vraća index od prvog nadjenog stringa unutar string-a, opcioni drugi atribut definiše index od koga treba započeti pretragu.

Ukoliko ne nedje traženi string metoda vraća vrednost -1. Obratiti pažnju na činjenicu da je ova funkcija case sensitive.. Više o ovoj metodi pogledajte u dokumentaciji na stranici MDN developer.mozilla

Ukoliko se u metodi indexOf() koriste dva atributa onda drugi atribut definiše od kog index-a da se počne pretraga.

Primer

Primer: filtriranje liste

See the Pen Filter list by Web programiranje (@chos) on CodePen.

Zaokruživanje decimalnog broja

JavaScript ima veoma čudan pristup decimalnim brojevima:

Zbog ovakvih neželjenih rezultata je potrebno zaokružiti broj.

Ova funkcija je najsličnija zakruživanju iz škole.

Defaultno ponašanje

Po default-u ova metoda zaokružuje na najbliži ceo broj:

Zakruživanje na decimalu

Ako želimo da zaokružimo na decimale potrebno je da se koristimo trikom:

Unapredjena verzija zaokruživanje na decimale

Za zakoruživanje na decimalu treba koristi narednu funkciju koja prihvata kao argumente broj za zaokruživanje i broj decimala na koje želimo da zaokružimo.

Medjutim i ovaj način ima manu za slučaj:

Ova metoda vraća prvi manji ceo broj od ponudjenog broja

Ova metoda vraća prvi veći ceo broj od ponudjenog broja:

Ova metoda vraća ceo broj tako što ukloni decimale:

Generisanje random broja

Primer

Ispisivanje datuma

a) Format: samo datum

b) Format: datum i vreme

c) Format – datum sa nazivom dana i meseca

Da li je prestupna godina?

Prevencija višestrukog submit-a forme

See the Pen xXyRwZ by Web programiranje (@chos) on CodePen.


Podelite:

Ostavite komentar