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:


Objektumom.valami.prototype = function (){

     ismetel : function () {

          blablablabla...
          setTimeout( function () { this.ismetel(); }, 33 );
     }

};

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:

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
 
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

Objektumom = function() {
    var $this;

    function Objektumom() {
        $this = this;
    }

    Objektumom.prototype.ismetel = function() {
        setTimeout( function () { $this.ismetel(); }, 33 );
    }
}
Í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:

Objektumom = function() {  
    var $this;  
  
    function Objektumom() {  
        $this = this;
        $this.data = {
            'ez': false,
            'az': true
        }
    }  
  
    Objektumom.prototype.ismetel = function() {  
        setTimeout( function () { $this.ismetel(); }, 33 );  
    }  

    Objektumom.prototype.csinald = function () {
        console.log($this);
        console.log($this.data);
    }

    return new Objektumom();
}  

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:
egyik = new Objektumom();
>Objektumom {data: Object, ismetel: function, csinald: function}
egyik.data = {'ez': true}
>Object {ez: true}
masik = new Objektumom();
>Objektumom {data: Object, ismetel: function, csinald: function}
masik.data = {'ez': false}
>Object {ez: false}
egyik.data.ez
>true
masik.data.ez
>false
egyik.data.ez = 'szia'
>"szia"
masik.data.ez
>false
egyik.data.ez
>"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:

function Objektumom(){}

Objektumom.prototype.ismetel = function (){
    console.log('blablablabla...');

    setTimeout( this.ismetel.bind(this), 33 );
};

var o = new Objektumom();

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. :)