hlorand · March 4, 2023 23:50
diff --git a/promise-javascript.html b/promise-javascript.html
 <body bgcolor="black">
 <script>

 /*
 Tegyük fel, hogy étteremben kaját rendelünk. Ez vagy megjön, vagy nem.
 Attól függően, hogy megjött-e vagy sem különbözőféleképp szeretnénk reagálni.
 A reakciókat két függvény írja le: a siker() és a bukas(). Mindkettő a 
 saját üzenetén kívül képes extra üzenetet fogadni
 */

 function siker(uzenet){
 	console.log("fizetek " + uzenet);
 }

 function bukas(uzenet){
 	console.log("felháborodok " + uzenet);
 }

 /*
 Az éttermi rendelés során a pincér egy ígéretet tesz nekünk. Az ígéret azzal jár, hogy
 valami művelet elindul (a szakács elkezdi a kaját főzni) és majd ennek lesz eredménye,
 a már említett siker, amikor meghozzák a kaját, vagy a bukás, amikor nem.

 Az ígéretet a Javscript-ben egy Promise objektum jelzi. Ennek a konstruktorában
 egy függvényt kell létrehozni. Ez a következőket teszi:

 1. valamit csinál, pl adatbázilekérést (éttermi hasonlat: a kaja főzése megtörténik vagy sem)
 2. ha sikeres ez a művelet, akkor meghívja a sikerül függvényt
 3. ha sikertelen ez a művelet, akkor meghívja a bukás függvényt

 A sikerül és a bukás függvényt a paraméter listájában várja a Promise.
 */

 var igeret = new Promise(function(sikerfv, bukasfv){

 	// a művelet - most a kaja elkészültét egy true/false változóval jelezzük
 	var kaja = true;

 	if( kaja == true  ) sikerfv("1000 ft-ot");
 	else bukasfv("nagyon");
 });

 // megmondjuk, hogy mely függvény hívódjon meg siker és bukás esetén
 igeret.then(siker).catch(bukas);

 /*
 -------------------------------------
 Így működik a háttérben a promise. Felmerülhet a kérdés, hogy mi értelme ezt ilyen formában 
 leírni, hiszen ennek központi része az if-else, az elég lehetne. A válasz: maga a művelet
 lehet, hogy több ideig tart, mert az pl egy API lekérés. Ez esetben a Promise szerkezet
 biztosítja, hogy nincs blokkolva a végrehajtás és siker esetén a siker() bukás esetén a
 bukas() függvény hívódik meg. A Promise-nak 3 állapota van:

 - pending
 - fulfilled
 - rejected

 Életszerűbb példa: A fetch() függvény, amivel API lekéréseket lehet végezni, Promise-t ad vissza.
 A .then() és .catch() által siker és bukás esetén meghívott függvényeket nem kell külön definiálni
 akár ott helyben a nyíl szintaxissal is megtehetjük. A fetch() siker kezelő függvénynek
 olyat vár, aminek van egy paramétere. Az lekérés válaszát adja át neki.
 */

 var letoltes = fetch("data.json");

 letoltes.then( (valasz) => {
 	console.log(valasz);
 }).catch( (hiba) => {
 	console.log(hiba);
 });

 /*
 Egyszerűsítések:
 - nem kell külön változót bevezetni a Promise objektumnak
 - a nyíl szintaxisnál ha csak egy parancsból áll a függvény, elhagyható a { }
 */

 fetch("data.json")
 	.then( (valasz) => console.log(valasz) )
 	.catch( (hiba)  => console.log(hiba) );

 /*
 Ha érkezik válasz, akkor az meg is jelenik a konzolon egy Response objektum képében.
 Viszont mi a szöveges tartalomhoz szeretnénk hozzáférni. Ennek a Response objektumnak
 van egy .json() metódusa, ami ezt hivatott előállítani. Viszont nem közvetlenül egy
 szöveget ad ez vissza, mert a feldolgozás is lehet hosszadalmas, hanem ez is egy 
 Promise-t. Szóval ehhez is tartozik egy .then().catch() részleg, amit ugyanúgy
 method chaining-gel elő tunuk hívni
 */

 fetch("data.json")
 	.then( (valasz) => valasz.json() ) // a valasz-nak inkább előhívjuk a .json() metódusát
 	.then( (szoveg) => console.log(szoveg) ) // ez a .then() a valsz.json() által szolgáltatott Promise reakciója
 	.catch( (hiba)  => console.log(hiba) );

 </script>
	<body bgcolor="black">
	<script>

	/*
	Tegyük fel, hogy étteremben kaját rendelünk. Ez vagy megjön, vagy nem.
	Attól függően, hogy megjött-e vagy sem különbözőféleképp szeretnénk reagálni.
	A reakciókat két függvény írja le: a siker() és a bukas(). Mindkettő a
	saját üzenetén kívül képes extra üzenetet fogadni
	*/

	function siker(uzenet){
	console.log("fizetek " + uzenet);
	}

	function bukas(uzenet){
	console.log("felháborodok " + uzenet);
	}

	/*
	Az éttermi rendelés során a pincér egy ígéretet tesz nekünk. Az ígéret azzal jár, hogy
	valami művelet elindul (a szakács elkezdi a kaját főzni) és majd ennek lesz eredménye,
	a már említett siker, amikor meghozzák a kaját, vagy a bukás, amikor nem.

	Az ígéretet a Javscript-ben egy Promise objektum jelzi. Ennek a konstruktorában
	egy függvényt kell létrehozni. Ez a következőket teszi:

	1. valamit csinál, pl adatbázilekérést (éttermi hasonlat: a kaja főzése megtörténik vagy sem)
	2. ha sikeres ez a művelet, akkor meghívja a sikerül függvényt
	3. ha sikertelen ez a művelet, akkor meghívja a bukás függvényt

	A sikerül és a bukás függvényt a paraméter listájában várja a Promise.
	*/

	var igeret = new Promise(function(sikerfv, bukasfv){

	// a művelet - most a kaja elkészültét egy true/false változóval jelezzük
	var kaja = true;

	if( kaja == true ) sikerfv("1000 ft-ot");
	else bukasfv("nagyon");
	});

	// megmondjuk, hogy mely függvény hívódjon meg siker és bukás esetén
	igeret.then(siker).catch(bukas);

	/*
	-------------------------------------
	Így működik a háttérben a promise. Felmerülhet a kérdés, hogy mi értelme ezt ilyen formában
	leírni, hiszen ennek központi része az if-else, az elég lehetne. A válasz: maga a művelet
	lehet, hogy több ideig tart, mert az pl egy API lekérés. Ez esetben a Promise szerkezet
	biztosítja, hogy nincs blokkolva a végrehajtás és siker esetén a siker() bukás esetén a
	bukas() függvény hívódik meg. A Promise-nak 3 állapota van:

	- pending
	- fulfilled
	- rejected

	Életszerűbb példa: A fetch() függvény, amivel API lekéréseket lehet végezni, Promise-t ad vissza.
	A .then() és .catch() által siker és bukás esetén meghívott függvényeket nem kell külön definiálni
	akár ott helyben a nyíl szintaxissal is megtehetjük. A fetch() siker kezelő függvénynek
	olyat vár, aminek van egy paramétere. Az lekérés válaszát adja át neki.
	*/

	var letoltes = fetch("data.json");

	letoltes.then( (valasz) => {
	console.log(valasz);
	}).catch( (hiba) => {
	console.log(hiba);
	});

	/*
	Egyszerűsítések:
	- nem kell külön változót bevezetni a Promise objektumnak
	- a nyíl szintaxisnál ha csak egy parancsból áll a függvény, elhagyható a { }
	*/

	fetch("data.json")
	.then( (valasz) => console.log(valasz) )
	.catch( (hiba) => console.log(hiba) );

	/*
	Ha érkezik válasz, akkor az meg is jelenik a konzolon egy Response objektum képében.
	Viszont mi a szöveges tartalomhoz szeretnénk hozzáférni. Ennek a Response objektumnak
	van egy .json() metódusa, ami ezt hivatott előállítani. Viszont nem közvetlenül egy
	szöveget ad ez vissza, mert a feldolgozás is lehet hosszadalmas, hanem ez is egy
	Promise-t. Szóval ehhez is tartozik egy .then().catch() részleg, amit ugyanúgy
	method chaining-gel elő tunuk hívni
	*/

	fetch("data.json")
	.then( (valasz) => valasz.json() ) // a valasz-nak inkább előhívjuk a .json() metódusát
	.then( (szoveg) => console.log(szoveg) ) // ez a .then() a valsz.json() által szolgáltatott Promise reakciója
	.catch( (hiba) => console.log(hiba) );

	</script>