Toon posts:

[JS] setInterval binnen class

Pagina: 1

Acties:

52 views sinds 30-01-2008
Reageer

zondag 12 mei 2002 23:24

Acties:

Norjee

Topicstarter

code:

<html>
<body>
<div id=blaat></div>
<script language=javascript>

function testClass(naam)
    {
    this.naam = naam
    this.i = 0
    
    this.testInterval = function()  
        {   
        document.getElementById(this.naam).innerHTML =this.i++; 
        }
        
    
    
    this.initInterval = function()
        {       
        setInterval("test.testInterval()" , 100) // dit werkt... duh..
        setInterval("this.testInterval()" , 100) // dit werkt NIET
                            // en is nu juist wat ik nodig heb
                            // is er een manier om binnen een class
                            // de naam van de class te krijgen,
                            // (in dit geval "test") of een andere
                            // manier om setInterval binnen een class
                            // werkend te krijgen
        }   
    }   

test = new testClass("blaat")
test.initInterval()

</script>
</body>
</html>

Hoe krijg ik setInterval dus werkend binnen een class??

edit:
lamaar.. het is dus onmogelijk volgense de search

maandag 13 mei 2002 00:06

Acties:

Verwijderd

code:

function CustomObject(id)
{
  this.ownerObject = document.getElementById(id);
  this.ownerObject.customObject = this;
  this.timer = null;
  this.i = 0;
  
  this.initInterval = function initInterval()
  {
    this.timer = setInterval("document.getElementById('" + this.ownerObject.id + "').customObject.testInterval();", 100);
  }

  this.testInterval = function testInterval()
  {
    this.ownerObject.innerHTML = this.i++;
  }
}

Zoals je ziet vereist het een truuckje om toch bij een object te kunnen komen.
Het is een beetje spelen met de document object model, je geeft een object een eigen 'childobject', en dat childobject ken je een 'parent' toe. Op die manier kun je toch een beetje lastige dingen doen zoals deze.

Zorg ook dat je het getal dat de setInterval functie returnt in een variabele stopt, zodat je ook de interval kunt 'unsetten'.

maandag 13 mei 2002 09:15

Acties:

Verwijderd

kleinigheidje trouwens:

document.getElementById() is nogal traag. Stuk sneller (grofweg factor 200 ofzo

) is bij creatie de objecten zelf in een Array op te slaan en vandaaruit op te vragen. Zeker bij iets als animatie kan dit behoorlijk schelen.

code:

document.myObjects = new Array();

function CustomObject(id){
    document.myObjects[id] = this;
    [...]
}

maandag 13 mei 2002 09:19

Acties:

Bosmonster

*zucht*

Op maandag 13 mei 2002 09:15 schreef Fred_Emmer het volgende:
kleinigheidje trouwens:

document.getElementById() is nogal traag. Stuk sneller (grofweg factor 200 ofzo ) is bij creatie de objecten zelf in een Array op te slaan en vandaaruit op te vragen. Zeker bij iets als animatie kan dit behoorlijk schelen.
code:
1
2
3
4
5
6
document.myObjects = new Array();

function CustomObject(id){
    document.myObjects[id] = this;
    [...]
}

Daar kwam ik ook achter toen ik met m'n memory spelletje bezig was ja.. Ik kwam op resultaten als dit in een test bij 1000x opzoeken in IE6/Win2K:

document.all : 2600 ms
getElementById : 1400 ms
eigen Array : 20 ms

behoorlijke verschillen...

maandag 13 mei 2002 09:38

Acties:

Clay

cookie erbij?

this.iets werkt niet in een setInterval omdat je script niet meer in die functie is als het na het opgegeven aantal milliseconden uitgevoerd wordt. de methode die je in een interval aanroept wordt globaal uitgevoerd, en "this" is globaal nix, of staat iig niet voor het object waar je het vandaan uit probeert te voeren.

Wat je wel kan doen is aan je object een .setInterval methode toevoegen die object gerelateerde methodes kan uitvoeren:

code:

// globale array is nog wel nodig
var counters = [];

function counter(id) {
    this.n = 0;
    this.id = id;
    counters[id] = this;
}

    counter.prototype.update = function() {
        this.n ++;
        window.status = this.n;
    }

    counter.prototype.setInterval = function(func, interval) {
        this.timer = setInterval("counters['"+this.id+"']."+func, interval);
    }

// instantie van counter
teller = new counter("tel");
teller.setInterval("update()", 100);

zoiets bv.

Instagram | Flickr | "Let my music become battle cries" - Frédéric Chopin

maandag 13 mei 2002 12:07

Acties:

Verwijderd

Ik wist wel dat getElementById niet de snelste functie was, maar dit vind ik best een dramatisch verschil!

Ik heb toevallig ook pas een pagina gemaakt met elementen die in een eigen array kwamen, en dat beviel me prima. Niet alleen omdat het sneller was, dat viel me niet eens op, maar wel dat het veel prettiger scripten is.

Maar nu ik deze getallen heb gezien zal ik er zeker rekening mee houden in toekomstige DHTML pagina's.

maandag 13 mei 2002 12:15

Acties:

Bosmonster

*zucht*

Op maandag 13 mei 2002 12:07 schreef Cheatah het volgende:
Ik wist wel dat getElementById niet de snelste functie was, maar dit vind ik best een dramatisch verschil!

Ik heb toevallig ook pas een pagina gemaakt met elementen die in een eigen array kwamen, en dat beviel me prima. Niet alleen omdat het sneller was, dat viel me niet eens op, maar wel dat het veel prettiger scripten is.

Maar nu ik deze getallen heb gezien zal ik er zeker rekening mee houden in toekomstige DHTML pagina's.

bij getElementById kon ik het me nog voorstellen, dat is een methode die week ik nog wat uitvoert.. maar document.all is toch gewoon een Array? En dat was de langzaamste...

Mogelijk lag het ook in de grootte van de verzameling, maar dat zou des te meer reden zijn zelf je objecten in een eigen verzameling op te slaan om onnodige "opzoek-overhead" te voorkomen.

ik zal nog ff een uitgebreidere test maken en posten..

maandag 13 mei 2002 12:35

Acties:

Bosmonster

*zucht*

http://bosmonster.b2f.nl/test.html

Deze gaat met 2000 objecten..

testresultaten bij mij:

all[]: 14 seconden
getEleById : 7 seconden
eigen Array : 20 ms

Pas als ik het aantal nog hoger opkrik begint de eigen Array 'langzamere' waarden te vertonen.. Bij 20.000 bijvoorbeeld komt ie op 2 seconden. de andere methodes hebben dan al gezorgd voor een Crash

(Mozilla 1.0 RC1 geeft soortgelijke resultaten overigens.. al kan ik de doc.all niet testen

)

maandag 13 mei 2002 12:40

Acties:

André

Analytics dude

Ditzelfde haal ik ook:

code:

1
2
3

all[]: 15 seconden
getElementById : 8 seconden
eigen Array : 16 ms

Ik denk dat 'all' zo langzaam is omdat dat een enorm grote array is. En bij 'getElementById' moet je script je hele pagina afzoeken. Terwijl je eigen array direct een verwijzing heeft naar het juiste object.

maandag 13 mei 2002 12:51

Acties:

Bosmonster

*zucht*

Op maandag 13 mei 2002 12:40 schreef Yogho het volgende:
Ditzelfde haal ik ook:
code:
1
2
3
all[]: 15 seconden
getElementById : 8 seconden
eigen Array : 16 ms
Ik denk dat 'all' zo langzaam is omdat dat een enorm grote array is. En bij 'getElementById' moet je script je hele pagina afzoeken. Terwijl je eigen array direct een verwijzing heeft naar het juiste object.

document.all is een grote Array, vandaar dat ik ook een groot aantal objecten neem om het verschil te minimaliseren (mijn eigen Array is ook 2000 objecten groot).

Dus die theorie gaat niet helemaal op. Zelfs als document.all standaard 1000 items groot is zou deze met 2000 extra objecten net zo snel moeten zijn als mijn eigen Array met 3000 items.

Het verschil is hier echter een paar duizend procent!! Dit bewijst dat document.all[] GEEN gewone Array is imho, maar een soort 'cloak' voor een interne systeem functie..

Pagina: 1

Reageer