JS: Objektid ja meetodid

Objekt -?

Meetod -?

Millised funktsioonid on kasutusel -?

//objekti loomine
let auto = {
    mark: "Porsche",
    mudel: "911",
    aasta: 2023,
    varv: "hall",
    lisavarustus: ["kliimaseade", "elektriaknad", "navigatsioonisüsteem"]
};

//Väljastamiseks trüki välja kogu objekt:
//F12 brauseris, et näidata konsooli

    console.log(auto);

Console vaade:

Objekti meetodid ja this kasutamine

let auto = {
    //omadused
    mark: "Ford",
    mudel: "Mustang",
    aasta: 2022,
    varv: "punane",
    omadused: ["kliimaseade", "elektriaknad", "navigatsioonisüsteem"],

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

console.log(auto.taisnimi());


let auto = {
    //omadused
    mark: "Dodge",
    mudel: "Charger",
    aasta: 2022,
    varv: "must",
    omadused: ["kliimaseade", "elektriaknad", "navigatsioonisüsteem"],

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

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

auto.kuvaOmadused();

Objektide massiivi loomine ja kuvamine

let autod = [
    { mark: 'Audi', mudel: 'A6', aasta: 2016 },
    { mark: 'Honda', mudel: 'Civic', aasta: 2012 },
    { mark: 'Tesla', mudel: 'Model 3', 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)

let autod = [
    { mark: 'Audi', mudel: 'A6', aasta: 2016 },
    { mark: 'Honda', mudel: 'Civic', aasta: 2012 },
    { mark: 'Tesla', mudel: 'Model 3', aasta: 2019 }
];

console.log(autod[0]);

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

let autod = [
    { mark: 'Toyota', mudel: 'Corolla', aasta: 2007 },
    { mark: 'Honda', mudel: 'Civic', aasta: 2012 },
    { mark: 'Tesla', mudel: 'Model 3', aasta: 2019 }
];


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

Objekti massiivi meetodid

let autod = [
    { mark: 'Audi', mudel: 'A6', aasta: 2016 },
    { mark: 'Honda', mudel: 'Civic', aasta: 2012 },
    { mark: 'Tesla', mudel: 'Model 3', aasta: 2019 }
];

//Lisab uue objekti massiivi lõppu
autod.push({ mark: 'BMW', mudel: '320i', aasta: 2015 });
autod.unshift({ mark: 'Ford', mudel: 'Mustang', aasta: 2020 });


console.log(autod);

Meetod splice ühaegselt kustutab ja lisab.

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

Massiivist otsimine

//Otsimine
let otsing = autod.find(auto=>auto.aasta > 2009);
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 === "Tesla");
console.log(otsing);

Massiivi filtreerimine

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

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

Autode puhul saame pöörduda näiteks auto.aasta poole ja filtreerida need, mis on uuemad kui 2018

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

Massiivi sorteerimine

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

Raamatud/Raamatukogu

let raamat = {
    pealkiri: "Sipsik",
    autor: "Eno Raud",
    aasta: "1962",

    kirjeldus: function() {
        return this.pealkiri + " ," + this.autor + " ," + this.aasta;
    },

    valjaAndeAasta : function (){
      this.aasta = "1999"
        return this.pealkiri + " ," + this.autor + " ," + this.aasta;
    }
};

let vastus = document.getElementById("vastus");
let vastus1 = document.getElementById("vastus1");
let vastus2 = document.getElementById("vastus2");
let vastus3 = document.getElementById("vastus3");


console.log(raamat.kirjeldus());
vastus.innerHTML = raamat.kirjeldus();

console.log(raamat.valjaAndeAasta());
vastus1.innerHTML = raamat.valjaAndeAasta();

let raamatukogu = [
    { pealkiri: "Sipsik", autor: "Eno Raud", aasta: "1962" },
    { pealkiri: "Kaka ja kevad", autor: "Andrus Kivirähk", aasta: "2009" },
    { pealkiri: "Harry Potter ja tarkade kivi", autor: "J. K. Rowling", aasta: "1997" }
];

raamatukogu.forEach((raamat2) => {
    console.log(`
    pealkiri: ${raamat2.pealkiri},
    autor: ${raamat2.autor},
    Aasta: ${raamat2.aasta}
    `);
});
let tulemus = "";
raamatukogu.forEach((raamat1) => {
    tulemus += `<br>
    pealkiri: ${raamat1.pealkiri},
    autor: ${raamat1.autor},
    Aasta: ${raamat1.aasta}
   `;

});

vastus2.innerHTML = tulemus;


raamatukogu.splice(1, 0, { pealkiri: "Cristiano Ronaldo elulugu", autor: "Guillem Balague", aasta: "2016" });


raamatukogu.forEach((raamat3) => {
    console.log(`
    pealkiri: ${raamat3.pealkiri},
    autor: ${raamat3.autor},
    Aasta: ${raamat3.aasta}
    `);
});


let otsing = raamatukogu.find(raamat5=>raamat5.aasta > 2000);
console.log(otsing);
vastus3.innerHTML ="Ilmunud peale 2000: " +otsing.pealkiri;