INTERAKTIVNO

PROGRAMIRANJE NA WEBU
POLJA I STRINGOVI

Ognjen Staničić, dipl. ing.

ognjen.stanicic@tvz.hr
Sadržaj predavanja

 Polja, svojstva i metode s poljima

 Stringovi, svojstva i metode s stringovima

Polja (Arrays)

 Polje je struktura podataka pomoću koje

pohranjujemo u memoriji više podataka pod istim
imenom

 U jednom polju mogu biti varijable različitih tipova

 Element polja može biti bilo koji podatak pa i novo

polje

 Varijabilna duljina
Polja

 Polje je u JavaScriptu vrsta objekta – ima specijalna svojstva

koja se zovu indeksi

 Elementi u poljima imaju svoje indekse – mjesto u polju:

 Numerički indeksi – 0 do N-1, gdje je N duljina polja

Polja

Načini deklaracije i inicijalizacije:

var polje=[];
var polje=[1, 2, 3, 4];
var polje=new Array(4);

Pristupanje elementima polja

polje[indeks], gdje je indeks=0 … N-1

(N duljina polja)
Polja

 Svako polje ima predefinirana svojstva i metode

 Najbitnije svojstvo je duljina polja:
 Duljina računa broji elemente s numeričkim indeksima polja
 Možemo dodijeliti novu vrijednost duljini polja
 Ako smanjimo ručno duljinu polja izbrisat ćemo neke njene elemente

var polje=[1, 2, 3, 4, 5];

alert(polje.length);

polje.length=3;

alert(polje);
Polja

Neke predefinirane metode nad poljima:

 push() – dodaje novi element na kraj polja
 pop() – miče zadnji element iz polja
 indexOf() – vraća prvo pojavljivanje traženog elementa u
polju
 lastIndexOf() - vraća zadnje pojavljivanje traženog
elementa u polju
 reverse() – promjeni redosljed elemenata u polju
 join() – zalijepi sve elemente polja u jedan string
 concat() – zalijepi dva polja u novo veliko polje
 splice() – briše iz polja n elemenata počevši od određenog
indexa
Polja

var polje=["A", "B", "C", "D"];

alert(polje.indexOf("B"));

var polje1=[1, 2, 3, 4];

var polje2=[5, 6, 7, 8, 9];

var polje3=polje1.concat(polje2);

alert(polje3.length);

document.write(polje3.join(" "));
ForEach

Sintaksa: polje.forEach(funkcija(element, indeks))

Način prolaska kroz cijelo polje
Predana funkcija se za svaki element polja pozove jednom
U svakom pozivu funkcije vrijednost elementa je u prvom
parametru, a pripadni indeks u drugom
var polje=[1,4,2,3];
polje.forEach(
function(element, indeks){
console.log('Element=' + element);
console.log(‘Njegov indeks=' + indeks);
}
);
forEach – for usporedba

 var polje = [1, 2, 3, 4];

 Pomoću for petlje:
for (var i=0; i < polje.length; i++){
console.log("Element je " + polje[i] + ", a
njegov index " + i);
}
 Pomoću forEach metode:
polje.forEach( function(e, i) {
console.log("Element je " + e + ", a njegov index
" + i);
});
 Ili skraćeno:
polje.forEach((e, i)=> console.log("Element je " +
e + ", a njegov index " + i)
});
Sort

Sintaksa: sort(sortfunkcija(prvi, drugi))

Sortira polje pomoću predane sort funkcije
U sort funkciji navedemo na koji način treba uspoređivati elemente
Sort funkcija se primjenjuje na sve parove elemenata: ako element a treba
imati veći indeks od elementa b funkcija mora vratiti pozitivan broj, ako a treba
imati manji indeks od b funkcija mora vratiti negativan broj
Mijenja izvorno polje
var polje=[1,4,2,3];
polje.sort(
function(a, b){
if (a>b) return 1; else
if (a<b) return -1; else
return 0;
} );
alert(polje);
Filter

Sintaksa: filter(funkcija(element, indeks))

Filtrira polje pomoću predane funkcije
Svaki element polja se testira pomoću funkcije, ukoliko
funkcija vrati true, element se pojavljuje u novom poljus
Ne mijenja izvorno polje nego vraća novo polje preko poziva

var polje=[1,2,3,4];
var novopolje = polje.filter(
function(element){
if (element>2) return true;
});

ili skraćeni zapis:

var novopolje = polje.filter(element => element > 2);
Map

Sintaksa: map(funkcija(element, indeks))

Mapira polje pomoću predane funkcije
Svaki element polja je predan funkciji koja vrati novu vrijednost u
novo polje
Ne mijenja izvorno polje nego vraća novo polje preko poziva

var polje=[1,2,3,4];
var novopolje=polje.map(
function(element){
return element*2;
});
ili skraćeni zapis:
var novopolje = polje.map(element => element * 2);
Još neke metode

Postoje još neke korisne metode koje kao argument primaju

funkciju:
 every – vraća true/false ako svi elementi polja zadovoljavaju
uvjet funkcije testiranja
 some - vraća true/false ako barem jedan element polja
zadovoljava uvjet funkcije testiranja
 find - vraća prvi element polja koji zadovoljava uvjet
funkcije testiranja
 findIndex - vraća prvi indeks prvog elementa polja koji
zadovoljava uvjet funkcije testiranja
Stringovi

 Tip podataka za pohranu teksta

 Možemo koristiti jednostruke ili dvostruke navodnike

 Operator spajanja stringova je plus (+)

 Stringovi imaju length svojstvo koje vraća duljinu stringa

Stringovi

var string1 = "Ovo je prvi string. ";

var string2 = "Ovo je drugi string. ";

var a=10;

console.log (string1.length);
var string3 = string1 + a + string2;
console.log(string3.length);
Neke korisne metode sa
stringovima
 charAt(), charCodeAt() – vraća znak odnosno Unicode vrijednost znaka na
traženom mjestu u stringu

 substr(), substring() – stvara podstring od ulaznog stringa

 split() – stvara polje od ulaznog stringa tako tako da ga rastavi na temelju

predanog znaka

 toUpperCase(), toLowerCase() – pretvara mala slova u stringu u velika i

obrnuto

 trim() – uklanja praznine na početku i kraju stringa

 indexOf(), lastIndexOf() – traži mjesto pojavljivanja određenog podstringa

u stringu