[[oktatas:web:javascript|< JavaScript]]

====== JavaScript Objektum Orientáltan ======

  * **Szerző:** Sallai András
  * Copyright (c) 2014, Sallai András
  * Szerkesztve: 2014, 2022, 2023
  * Licenc: [[https://creativecommons.org/licenses/by-sa/4.0/|CC Attribution-Share Alike 4.0 International]]
  * Web: https://szit.hu

===== Objektum létrehozása =====

A JavaScriptben tulajdonképpen minden objektum.
Saját objektumot az Object konstruktorral hozhatunk létre, vagy
egyszerű literális jelöléssel.  

==== new operátor ====


<code javascript>
let szemely = new Object();
szemely.vNev="Nagy";
szemely.kNev="József";
szemely.kor=50;
szemely.szemSzin="kék";
</code>

==== Literális jelölés ====

<code javascript>

let Dolgozo = {
  nev : 'Nagy József',
  kor : 32,
  udvozlet : function(){
    console.info("Üdv", this.nev);
  },
  lekerKor : function(){
    console.info(this.kor);
  }

};


Dolgozo.udvozlet();
Dolgozo.lekerKor();
</code>




===== Osztály =====

A JavaScript, alapvetően egy osztályok nélküli nyelv volt 2015-ig. Azonban függvényekkel addig is szimulálhatók voltak az osztályok:

<code javascript>
function Jarmu(model) {
    this.model = model;
    this.szin = 'piros';
    this.evjarat = '2008';
    this.getInfo = function() {
        return this.model + ' ' + this.evjarat
    }
}
</code>

Példányosítás:
<code javascript>
let kocsim = new Jarmu('opel');
kocsim.evjarat = '2009';
console.log(kocsim.getInfo());
</code>



===== Konstruktor =====
<code javascript>
var Dolgozo = function(nev, kor){
  this.nev = nev;
  this.kor = kor;
};

var joska = new Dolgozo("Nagy József", 38);

document.getElementsByTagName("body")[0].innerHTML = joska.nev;
</code>

===== Konstruktor és metódus =====

<code javascript>

var Dolgozo = function(nev, kor){
  this.nev = nev;
  this.kor = kor;
  this.info = function(){
    return this.nev + ":" + this.kor; 
  }
};

var joska = new Dolgozo("Nagy József", 38);

document.getElementsByTagName("body")[0].innerHTML = joska.info();

</code>

===== Kivételkezelés =====

<code javascript>
try {
    
    sessionStorage.setItem("user", "joska");
}catch(e){
    console.log("Hiba a tárolás során");
}
</code>

==== Összetett ====

<code javascript>



function checkSides(a, b, c) {
    if (a<1 || b<1 || c<1) {
        throw 'Hiba! Paraméter nem megfelelő!';
    }
}

function tryCalcPerimeter(a, b, c) {
    return a+b+c;
}

function calcPerimater(a, b, c) {
    try {
        checkSides(a, b, c);
        return tryCalcPerimeter(a, b, c);
    }catch(e) {
        console.error(e);
    }
}

console.log(calcPerimater(30, 35, -40));

</code>

===== Object.create() =====

<code javascript>
const dolgozo = {
    ember: false,
    kiir: function() {
        console.log(`A név: ${this.name}`);
    }
};

const janos = Object.create(dolgozo);
janos.name = 'Nagy János';
janos.ember = true;
janos.kiir();
</code>

===== Object.keys() =====

<code javascript>
const pali = {
    name: 'Török Pál',
    age: 30,
    city: 'Szeged'
}

const paliKeys = Object.keys(pali)

paliKeys.forEach( key => {
    console.log(key)
})
</code>

===== Linkek =====

  * http://www.javascriptkit.com/javatutors/oopjs.shtml
  * http://net.tutsplus.com/tutorials/javascript-ajax/the-basics-of-object-oriented-javascript/
  * http://www.codeproject.com/Articles/5608/Writing-Object-Oriented-JavaScript-Part-1
  * http://weblabor.hu/cikkek/oojsafelszinalatt
  * http://www.sitepoint.com/oriented-programming-1/