Objektumok
This commit is contained in:
14
objektumok/index.html
Normal file
14
objektumok/index.html
Normal file
@@ -0,0 +1,14 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="hu">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Objektumok</title>
|
||||||
|
<script defer src="szemely.js"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="root">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
63
objektumok/objektumok.js
Normal file
63
objektumok/objektumok.js
Normal file
@@ -0,0 +1,63 @@
|
|||||||
|
//Objektum: Adatok és metódusok egy egységbe zárva
|
||||||
|
|
||||||
|
//Objektum literál
|
||||||
|
//JSON - Javascript object notation
|
||||||
|
let szemely={
|
||||||
|
"vezeteknev":"Kósa",
|
||||||
|
"keresztnev":"György",
|
||||||
|
"szuletesiev":2003,
|
||||||
|
//Egyszerűbben destruktúrálható
|
||||||
|
get kor(){
|
||||||
|
return new Date().getFullYear()-this.szuletesiev;
|
||||||
|
},
|
||||||
|
lakcim:{
|
||||||
|
"telepules":"Gyula",
|
||||||
|
"utca":"Béke",
|
||||||
|
"hazszam":23
|
||||||
|
},
|
||||||
|
telefon:["+36701112222","+36203451234"]
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log(szemely.keresztnev,szemely.kor);
|
||||||
|
console.log(szemely.lakcim.telepules)
|
||||||
|
|
||||||
|
class Szemely {
|
||||||
|
constructor(vezeteknev,keresztnev,szuletesiev){
|
||||||
|
this.vezeteknev=vezeteknev,
|
||||||
|
this.keresztnev=keresztnev,
|
||||||
|
this.szuletesiev=szuletesiev
|
||||||
|
}
|
||||||
|
kor(){
|
||||||
|
return new Date().getFullYear()-this.szuletesiev;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
let szemely1=new Szemely("Kiss","Endre",2001);
|
||||||
|
let szemely2=new Szemely("Horváth","Ella",1999);
|
||||||
|
|
||||||
|
//objektumok destruktúrálása
|
||||||
|
|
||||||
|
const{vezeteknev,keresztnev}=szemely;
|
||||||
|
|
||||||
|
|
||||||
|
console.log(vezeteknev,keresztnev);
|
||||||
|
|
||||||
|
//Álnevek használata
|
||||||
|
const{vezeteknev:vnev,keresztnev:knev}=szemely1;
|
||||||
|
|
||||||
|
console.log(vnev,knev);
|
||||||
|
|
||||||
|
//Beágyazott objektum destruktúrálása
|
||||||
|
const{lakcim:{telepules,utca,hazszam}}=szemely;
|
||||||
|
|
||||||
|
console.log(telepules,utca,hazszam);
|
||||||
|
|
||||||
|
//Metódus destruktúrálása
|
||||||
|
const{kor}=szemely;
|
||||||
|
|
||||||
|
console.log(kor);
|
||||||
|
//Kötés szükséges az objektum példányhoz
|
||||||
|
//const eletkor=kor.bind(szemely);
|
||||||
|
|
||||||
|
//console.log(eletkor());
|
||||||
47
objektumok/szemely.js
Normal file
47
objektumok/szemely.js
Normal file
@@ -0,0 +1,47 @@
|
|||||||
|
class Szemely {
|
||||||
|
constructor(vezeteknev,keresztnev,szuletesiev){
|
||||||
|
this.vezeteknev=vezeteknev,
|
||||||
|
this.keresztnev=keresztnev,
|
||||||
|
this.szuletesiev=szuletesiev
|
||||||
|
}
|
||||||
|
kor(){
|
||||||
|
return new Date().getFullYear()-this.szuletesiev;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
let szemely1=new Szemely("Kiss","Endre",2001);
|
||||||
|
|
||||||
|
//Hogyan tudnánk a személy adatait egy weblapba beleírni?
|
||||||
|
|
||||||
|
let root=document.getElementById('root');
|
||||||
|
|
||||||
|
let vezeteknev=document.createElement('p');
|
||||||
|
|
||||||
|
let keresztnev=document.createElement('p');
|
||||||
|
|
||||||
|
let szuletesiEv=document.createElement('p');
|
||||||
|
|
||||||
|
const{vezeteknev:vnev,keresztnev:knev,szuletesiev:szulev}=szemely1;
|
||||||
|
|
||||||
|
vezeteknev.textContent=vnev;
|
||||||
|
keresztnev.textContent=knev;
|
||||||
|
szuletesiEv.textContent=szulev;
|
||||||
|
|
||||||
|
root.appendChild(vezeteknev);
|
||||||
|
root.appendChild(keresztnev);
|
||||||
|
root.appendChild(szuletesiEv);
|
||||||
|
|
||||||
|
let nevek=["Béla","Géza","Ella","Janka","Ferenc"];
|
||||||
|
|
||||||
|
//Ezek a nevek egy felsorolásban jelenjenek meg a HTML dokumentumban!
|
||||||
|
//'ul': lista
|
||||||
|
//'li': listaelem
|
||||||
|
let lista=document.createElement('ul');
|
||||||
|
|
||||||
|
for (let i = 0; i < nevek.length; i++) {
|
||||||
|
let listaElem=document.createElement('li');
|
||||||
|
listaElem.textContent=nevek[i];
|
||||||
|
lista.appendChild(listaElem);
|
||||||
|
}
|
||||||
|
|
||||||
|
root.appendChild(lista);
|
||||||
Reference in New Issue
Block a user