ugrás a tartalomhoz

JS setTimeout() object-en belül

elek9914 · 2015. Feb. 19. (Cs), 09.35
Sziasztok!

Szeretném, ha egy objektumom függvénye önmagát hívná meg bizonyos idő elteltével.
Első gondolatom ez volt:
  1. Objektumom.valami.prototype = function (){  
  2.   
  3.      ismetel : function () {  
  4.   
  5.           blablablabla...  
  6.           setTimeout( function () { this.ismetel(); }, 33 );  
  7.      }  
  8.   
  9. };  
de ez ugye nem megy, mert a "this.ismetel()" -re nem hivatkozhatok a setTimeoutban megadott függvényben.
Még úgy sem megy hogy erre változtattam ezt a sort:
  1. setTimeout( this.ismetel(), 33 );  
Ezzel meg az a baj, hogy egyáltalán nem várja meg a 33 ms-t, hanem azonnal lefuttatja a this.ismetel() -t. Ha 5000 ms-t adok meg időzítésnek akkor is azonnal hívja meg.

Hogyan lehetne ezt megoldani?
Üdv: Elek
‹ Mouse Event Probléma Szerintetek ez mi ›
 ■
1

this.ismetel() Ez meghívja az

Hidvégi Gábor · 2015. Feb. 19. (Cs), 09.43
this.ismetel()

Ez meghívja az adott függvényt, és a visszatérési értékét adja át a setTimeout-nak.
2

Azaz?

elek9914 · 2015. Feb. 19. (Cs), 09.50
Nincs konkrét visszatérési érték megadva, hisz a függvény utolsó része az önmagát meghívó setTimeout.
Most így hirtelen nem jövök rá hogy mit akarsz ezzel mondani :/
4

A setTimeout első paraméterét

Hidvégi Gábor · 2015. Feb. 19. (Cs), 10.06
A setTimeout első paraméterét kétféleképp lehet megadni:

1, karakterláncként, ez a kevésbé szép megoldás:
setTimeout('fuggveny("parameter"); fuggveny2();', 33);

2, ún. callback-ként, amikor csak a függvény nevét kell beírni, a paraméterek az idő után következnek
setTimeout(fuggveny, 33, "parameter");

A második esetben látható, hogy csak egy függvényt vagy metódust lehet megadni.

A kettő között az a különbség, hogy amikor ezt írod be:
var valtozo = fuggveny;
akkor a változó értéke maga a függvény lesz, azaz meghívhatod a következőképpen:
valtozo();

Ha így hívod meg:
var valtozo = fuggveny();
akkor pedig a változó értéke a függvény visszatérési értéke lesz.

Amikor ezt írtad be:
setTimeout(this.fuggveny(), 33);
az ekvivalens a következővel:
var valtozo = this.fuggveny();
setTimeout(valtozo, 33);

Egyébként neked szerintem a setInterval()-ra van szükséged.
3

Binding

Poetro · 2015. Feb. 19. (Cs), 10.01
setTimeout( function () { this.ismetel(); }, 33 );

Mivel a this a setTimeout-on belül a globális objektum, böngészőben a window lesz, így nehéz lesz meghívni az általad választott függvényt. Használhatsz .bind-ot, vagy bevezetsz egy új változót, például that vagy self, amit a this értékével töltesz föl, majd használsz a setTimout-on belül.
9

Igen, én is így

csabessz47 · 2015. Feb. 19. (Cs), 14.14
Igen, én is így csinálnám
  1. Objektumom = function() {  
  2.     var $this;  
  3.   
  4.     function Objektumom() {  
  5.         $this = this;  
  6.     }  
  7.   
  8.     Objektumom.prototype.ismetel = function() {  
  9.         setTimeout( function () { $this.ismetel(); }, 33 );  
  10.     }  
  11. }  
Így a $this mindig a js objektumra vonatkozik, a this pedig használható szokásosan.
10

Ne haragudj, de átgondoltad

spapp · 2015. Feb. 19. (Cs), 14.49
Ne haragudj, de átgondoltad te ezt?
Kipróbáltad egyáltalán?
Hogyan vennéd használatba a 'Objektumom' osztályt?
11

A "teljes" objektum így nézne

csabessz47 · 2015. Feb. 20. (P), 10.43
A "teljes" objektum így nézne ki:
  1. Objektumom = function() {    
  2.     var $this;    
  3.     
  4.     function Objektumom() {    
  5.         $this = this;  
  6.         $this.data = {  
  7.             'ez': false,  
  8.             'az': true  
  9.         }  
  10.     }    
  11.     
  12.     Objektumom.prototype.ismetel = function() {    
  13.         setTimeout( function () { $this.ismetel(); }, 33 );    
  14.     }    
  15.   
  16.     Objektumom.prototype.csinald = function () {  
  17.         console.log($this);  
  18.         console.log($this.data);  
  19.     }  
  20.   
  21.     return new Objektumom();  
  22. }    
  23.   
  24. Objektumom = new Objektumom();  
Így bármi történik az Objektumom-on belül, az ott is marad, más js-sel nem tud összeakadni.
A $this mindig az objektum lesz. Nyilván lehetne más neve is, de nekem ez kényelmes.
A this pedig lehet a kiváltó elem (egy click eventnél).
Használni: Objektumom.csinald();
12

Látom, továbbra sem érted.

Hidvégi Gábor · 2015. Feb. 20. (P), 13.31
Látom, továbbra sem érted. Még mindig tele van hibával a kódod, és ugyanúgy rosszul működik; jó lenne, ha megtanulnád a JS alapjait.
13

Jó, legyen. Mert az tény,

csabessz47 · 2015. Feb. 20. (P), 14.03
Jó, legyen. Mert az tény, hogy nem értem miért hibás.
Nem hiába vagyok backendes, js-hez csak akkor nyúlok ha muszáj, bár ez már nem js alapjai szerintem, vagy valamikor nagyon feljebb emelkedhetett az a léc.

Egyébként akkor ők is rosszul csinálják?
http://s.szalas.hu/3356115309/uncooked/js/szallas_modal.js
vagy
http://s.szalas.hu/3356115309/uncooked/js/new_social.js

Nem véletlen a hasonlóság, innen tetszett meg az egész.
14

Először is olvasd el, amit a

Hidvégi Gábor · 2015. Feb. 20. (P), 14.10
Először is olvasd el, amit a 4-esben írtam. Ha megnézed a szallas_modal.js forrását, akkor láthatod, hogy van egy nagyon fontos különbség a tiedhez képest:

if (options.show) {
  window.setTimeout(function() {
    _this.show();
  }, options.interval);
}


Elég szerencsétlennek tartom ezt a lambdás szokást a JS körökben, nehezíti a kódolvasást, és ez hatványozottan jön elő a node.js kódokban.
15

Értem

csabessz47 · 2015. Feb. 20. (P), 14.17
Értem,
Azt hittem magával az objektum kialakításával ($this és a csinald metódussal) van gondod, a setTimeOut-ra már nem is figyeltem, csak másolgattam.
Bocs :)
16

Én kérek bocsánatot, mert

Hidvégi Gábor · 2015. Feb. 20. (P), 14.26
Én kérek bocsánatot, mert figyelmetlen voltam, a setTimeout-os kódod jó.
17

Akkor jót beszélgettünk

csabessz47 · 2015. Feb. 20. (P), 14.42
Akkor jót beszélgettünk :)
Szeretem a pénteket, sosem unalmas.
18

Az adott objektumból egy vagy

Hidvégi Gábor · 2015. Feb. 20. (P), 14.48
Az adott objektumból egy vagy több is lehet a rendszerben?
19

Nem látom akadályát

csabessz47 · 2015. Feb. 20. (P), 15.07
Nem látom akadályát, hogy miért ne lehetne több (jelen esetben a data property-ben levő értékek különböznének), nekem még nem volt rá szükségem.
20

Nem látom akadályát, hogy

Poetro · 2015. Feb. 20. (P), 15.55
Nem látom akadályát, hogy miért ne lehetne több

Pedig pont te szabtál neki akadályt azzal, hogy egy megosztott változóban tárolod el a this értékét, amin minden egyes példány osztozik, és az utoljára létrehozott értékét fogja hordozni.
21

A data módusult, erre a fenti

csabessz47 · 2015. Feb. 20. (P), 16.10
A data módusult, erre a fenti Objektumom objektumban: $this.data = {};
Chrome konzol:
  1. egyik = new Objektumom();  
  2. >Objektumom {data: Object, ismetel: function, csinald: function}  
  3. egyik.data = {'ez': true}  
  4. >Object {ez: true}  
  5. masik = new Objektumom();  
  6. >Objektumom {data: Object, ismetel: function, csinald: function}  
  7. masik.data = {'ez': false}  
  8. >Object {ez: false}  
  9. egyik.data.ez  
  10. >true  
  11. masik.data.ez  
  12. >false  
  13. egyik.data.ez = 'szia'  
  14. >"szia"  
  15. masik.data.ez  
  16. >false  
  17. egyik.data.ez  
  18. >"szia"  
Tehát itt egyik és masik 2 külön objektum, a datában más értékekkel.
Remélem most nem beszélek mellé.
22

$this

Poetro · 2015. Feb. 20. (P), 16.23
De a csinald es az ismetel a $this-re hivatkozik, ami meg van osztva. Azaz azok a hívások máshogy fognak működni.
5

Ami példakódot írtál az

spapp · 2015. Feb. 19. (Cs), 10.13
Ami példakódot írtál az szintaktikailag helytelen.
Csodálkoznék ha egyáltalán valami történne.

Így próbáld:
  1. function Objektumom(){}  
  2.   
  3. Objektumom.prototype.ismetel = function (){  
  4.     console.log('blablablabla...');  
  5.   
  6.     setTimeout( this.ismetel.bind(this), 33 );  
  7. };  
  8.   
  9. var o = new Objektumom();  
  10.   
  11. o.ismetel();  
6

Köszönöm

elek9914 · 2015. Feb. 19. (Cs), 10.20
A bind-olás tényleg jó.
Köszönöm mégegyszer!
7

blablabla

elek9914 · 2015. Feb. 19. (Cs), 10.26
a blablabla az csak azt jelezte hogy ott még sok más kód van, csak azért írtam most a példában oda :)
8

A "blablablabla..." nélkül is

spapp · 2015. Feb. 19. (Cs), 12.28
A "blablablabla..." nélkül is helytelen a szintaktika. Így értettem. :)