Javascripti programmides on võimalik vajaduse korral luua ise kohandatud objekte, samuti kasutada sisseehitatud objekte, mis on Javascripti enda poolt pakutavad objektid. Mõned sisseehitatud on näiteks:

1. Math sisaldab matemaatilisi funktsioone ja konstante. Seda kasutatakse nagu ümardamine, ruutjuur, trigonomeetria funktsioonid jne.
2. Date võimaldab töötada kuupäevade ja kellaaegadega (nagu päev, kuu, aasta).
3. Array on sisseehitatud objekt, mida kasutatakse massiivide loomiseks ja manipuleerimiseks. See sisaldab mitmeid meetodeid, nagu: elemendi lisamine, eemaldamine, sorteerimine, filtreerimine jne.
4. String sisaldab meetodeid, mis võimaldavad töötada sõnedega. Näiteks:
   • length (pikkuse saamine)
   • toUpperCase (suurte tähtede kasutamine)
   • substring (alamstringi võtmine)
   • jne.
5. Object on JavaScripti alusobjekt, mida kasutatakse kõikide objektide baasina (objektide kopeerimiseks jne.)

Objekti loomine

Objekti süntaks koosneb võtme-väärtuse paari paaridest, kus võti on sõne ja väärtus võib olla mis tahes Javascripti andmetüüp. Selles näites on loodud objekt nimega “auto”, millel on järgmised omadused (properties):

let auto = {
    mark: "Audi",
    mudel: "A8",
    aasta: 2020,
    varv: "must",
    lisavarustus: ["kliimaseade", "elektriaknad", "navigatsioonisüsteem"]
};

Väljastamiseks trüki välja kogu objekt:

console.log(auto);

Iga objekti omadustele saab juurde pääseda, kasutades punktisüntaksit.

console.log(auto.mark); //output "Audi"
console.log(auto.mudel); //output "A8"
console.log(auto.aasta); //output 2020
console.log(auto.varv); //output "must"
console.log(auto.lisavarustus); //output ["kliimaseade", "elektriaknad", "navigatsioonisüsteem"]

Objekti meetodid ja this kasutamine

Objektid Javascriptis võivad sisaldada mitte ainult omadusi, vaid ka meetodeid. Meetodid on objekti funktsioonid, mis võivad manipuleerida objekti omadustega või teostada muid toiminguid objekti kontekstis. Selleks, et meetod saaks kasutada sama objekti omadusi, siis tuleb kasutada this võtmesõna.

let auto = {
    //omadused
    mark: "Audi",
    mudel: "Q8",
    aasta: 2022,
    varv: "Valge",
    omadused: ["kliimaseade", "elektriaknad", "navigatsioonisüsteem"],

    //meetodid
    taisnimi: function() {
        return this.mark + " " + this.mudel;
    }
};

console.log(auto.taisnimi());

Meetodi lühendamine

Uus Javascript ES6 lubab nüüd meetodi panna kirja ka lühemalt.

  //meetodid
  taisnimi() {
    return this.mark + " " + this.mudel;
  }

Kui omadused on massiivis, siis kasuta for või forEach tsüklit.

let auto = {
    //omadused
    mark: "Toyota",
    mudel: "Camry 40",
    aasta: 2024,
    varv: "Hall",
    omadused: ["kliimaseade", "elektriaknad", "navigatsioonisüsteem"],

    //meetodid
    taisnimi() {
        return this.mark + " " + this.mudel;
    },

    kuvaOmadused() {
        this.omadused.forEach(omadus => console.log(omadus));
    }
};

auto.kuvaOmadused();

Objektide massiivid

Objektide massiiv on JavaScriptis andmete struktuur, mis koosneb mitmest objektist, mis on järjestatud indeksi alusel. Iga objekt on võti-väärtuse paaride kogum, kus võti on unikaalne ja väärtus on võti-väärtuse paari andmed. Objektide massiiv võib sisaldada mitmesuguseid andmetüüpe, sealhulgas teksti (string), numbreid, tõeväärtusi (boolean), funktsioone, muid objekte jne.

Objektide massiivi loomine ja kuvamine

Iga auto on esindatud objektina, mis sisaldab teavet auto margi, mudeli ja tootmisaasta kohta.

let autod = [
    { mark: 'Toyota', mudel: 'Camry 40', aasta: 2024 },
    { mark: 'Audi', mudel: 'A8', aasta: 2022 },
    { mark: 'Alfa Romeo', mudel: 'Stelvio ', aasta: 2019 }
];

console.log(autod);

Kui soovime näha konkreetse auto andmeid, saame viidata auto positsioonile massiivis (pidage meeles, et massiivide indekseerimine algab 0-st)

console.log(autod[2]);

Ja selles objektis saan elemendid kätte “punkti-süntaksiga”, nagu eespool

console.log(autod[1].mark);

Kõikide mudelite nägemiseks kasutame jällegi forEach tsüklit

let autod = [
    { mark: 'Toyota', mudel: 'Camry 40', aasta: 2024 },
    { mark: 'Audi', mudel: 'A8', aasta: 2022 },
    { mark: 'Alfa Romeo', mudel: 'Stelvio ', aasta: 2019 }
];

autod.forEach((auto) => {
    console.log(`
    Mark: ${auto.mark},
    Mudel: ${auto.mudel},
    Aasta: ${auto.aasta}
    `);
});

Objekti massiivi meetodid

JavaScripti massiivide meetodid on kasutatavad nii tavaliste massiivide kui ka objektide massiivide puhul. Sellised meetodid nagu push(), pop(), shift(), unshift(), splice(), slice(), forEach(), map(), filter(), reduce(), sort(), jne.

Uute objektide lisamine objektide massiivi push ja unshift abil.

let autod = [
    { mark: 'Toyota', mudel: 'Camry 40', aasta: 2024 },
    { mark: 'Audi', mudel: 'A8', aasta: 2022 },
    { mark: 'Alfa Romeo', mudel: 'Stelvio ', aasta: 2019 }
];

//Lisab uue objekti massiivi lõppu
autod.push({ mark: 'Acura', mudel: 'MDX', aasta: 2017 });
autod.unshift({ mark: 'Cadillac', mudel: 'CTS', aasta: 2020 });

Meetod splice ühaegselt kustutab ja lisab.

massiiv.splice(
  {start indeks},
  {mitu eemaldada},
  {mida lisada}
);

Näiteks

//Eemaldab esimese objekti
autod.splice(0,1);
//Lisab objekti alates teisest indeksist, ei kustutata midagi
autod.splice(1,0,{ mark: 'Audi', mudel: 'A5', aasta: 2018 });

Massiivist otsimine

Objektide massiivist otsimiseks kasutame find meetodit, mis tahab käivitamiseks funktsiooni. Kasutame noolfunktsiooni, kuna see lühem.

//Otsimine
let otsing = autod.find(auto=>auto.aasta > 2018);
console.log(otsing);

Antud meetod leiab esimese vaste ja tagastab selle. Kui vastust ei leita, siis tuleb undefined. Mitme tingimuse seadmiseks kasuta && märke

//Otsimine
let otsing = autod.find(auto=>auto.aasta > 2018 && auto.mark === "Audi");
console.log(otsing);

Massiivi filtreerimine

Kuna find leiab vaid ühe tulemuse, siis mitme vastuse saamiseks kasuta filter meetodit. Filter loob massiivist uue massiivi ja väljastab tingimustele vastavad elemendid.

Näiteks meil on arvud ja soovime sealt saada paarisarve

let arvud = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

const filtreeritud = arvud.filter(arv => arv % 2 === 0);
console.log(filtreeritud);

//Filtreerimine
let filter = autod.filter(auto=>auto.aasta > 2019);
console.log(filter);

Massiivi sorteerimine

Viimase meetodina vaatame sorteerimist sort. Lihtsalt sorteerimine objektide massivii puhul õigesti ei tööta. Seepärast peame kasutama võrdlusfunktsiooni.

autod.sort((a, b) => a.aasta - b.aasta);
console.log(autod);

Siin on (a, b) => a - b võrdlusfunktsioon, mis ütleb sort()-ile, et järjestada numbrid nende tegelike numbri väärtuste, mitte stringiväärtuste järgi. Funktsioon a - b tagastab negatiivse väärtuse, kui a on väiksem kui b, positiivse väärtuse, kui a on suurem kui b, ja 0, kui a ja b on võrdsed – just see, mida sort() vajab oma elementide õigesti järjestamiseks.

Ülesanne “Raamatu objekt”