JavaScript functions die meer dan één waarde teruggeven

JavaScript functions zijn bedoeld om bewerkingen uit te voeren op de inhoud van variabelen. Denk hierbij aan het optellen van getallen, het splitsen van een string in een array van woorden, het uitrekenen en/of opmaken van een maandkalender, enzovoort. De bewerking op zich wordt ook wel overdracht, of transactie genoemd.

De JavaScript standaarden geven aan dat een en ander is bedoeld als in het voorbeeld hieronder:
 
function abcd(p,q,r,s) {
  var x;
 
(Bewerkingen op x met behulp van de parameters p, q, r en s)
  return x
}

In de code staat iets in de geest van var y = abcd(1,2,3,4), waarmee de variabele y een waarde krijgt toegekend die gelijk is aan x op het moment dat de function abcd() is afgelopen.

JavaScript functions zijn (net als in andere programmeertalen) er op gebouwd om één waarde te retourneren. Meestal is dat voldoende, maar soms berekent een function meer dan één waarde, die je in het verdere verloop van het script nodig hebt.

Het ligt dan voor de hand om te proberen om variabelen die in een function worden gewijzigd, te retourneren via de parameterlijst (call by reference). Bij veel programmeertalen kan dat, maar bij JavaScript kan dat niet. Variabelen uit de parameterlijst kunnen binnen een JavaScript-function worden gewijzigd, maar na afloop van de function hebben de gewijzigde variabelen nog steeds dezelfde waarde als vóór de aanroep (call by value).

Toch is het mogelijk om meerdere waarden door het script te laten retourneren. In het volgende getoond wordt hoe het werkt (Voorbeeld I), wat er gebeurt als je twee waarden wilt retourneren (Voorbeeld II), hoe het wel zou kunnen (Voorbeeld III) en wat de beste methode is (Voorbeeld IV).

Voorbeeld I: Bekijk het script:
 
function abcd(p,q,r,s) {
  var x = p + q + r + s
  return x
}

Als je dit script laat werken verschijnt er een melding dat het resultaat van de berekening 10 is.
    window.alert('Het resultaat van de berekening is '+abcd(1,2,3,4)).

Voorbeeld II: Bekijk het script:
 
function efgh(p,q,r,s) {
  var x = p + q + r + s
  var y = p * q * r * s
  return x, y;
}

Je zou denken dat je de waarden 10 en 24 terug krijgt. Maar als je dit script laat werken verschijnt er alleen een melding dat het resultaat van de berekening 24 is.
    window.alert('Het resultaat van de berekening is '+efgh(1,2,3,4)).

Je krijgt alleen de waarde van y (= 24) te zien. De waarde van x (= 10) is verdwenen!

JavaScript kan gewoonweg niet meer dan één waarde terug geven!. Je moet dus een trucje doen om beide waarden toch beschikbaar te krijgen. Dat trucje heet wrapping. Je verpakt de waarden in een object:

  1. Zet beide waarden in een array en laat de function de array teruggeven. Zie onderstaande code (Voorbeeld III):
    function ijkl(p,q,r,s) {
     
      var x = new Array();
      x[0] = p + q + r + s;
      x[1] = p * q * r * s;
      return x;
    }

     
    Als je dit scriptje uitvoert, krijg je zowel x[0] als x[1] te zien. De hele array wordt getoond.
        window.alert('Het resultaat van de berekening is '+ijkl(1,2,3,4)).
     
    Het nadeel van deze aanpak is dat je goed moet onthouden welk resultaat er in welke cel van de array staat.
     
  2. Gebruik een object dat je zelf maakt. Dit is het handigst, omdat je het object zó kunt definiëren dat het voor jouw toepassing het beste uitkomt. Zie onderstaande code:
     
    function Resultaat(s,p) {
      this.som = s;
      this.product = p;
    }

    Je hebt nu een datastructuur (object) gemaakt waarin je een som en een product herkenbaar kunt opslaan, en bij hun naam in dat object kunt aanroepen. Het hele ding zit in één variabele en kan dus door een function worden geretourneerd. De bewerking wordt nu (Voorbeeld IV):
     
    function mnop(p,q,r,s) {
      var x = new Resultaat(0,0);
      x.som = p + q + r + s;
      x.product = p * q * r * s;
      return x;
    }

     
    Refereren gaat als volgt:
     
    Stel: var t = mnop(1,2,3,4)
       De som staat in t.som en het product staat in t.product.
     
    N.B.: Je kunt het object ook op een kortere manier samenstellen, door het object 'anoniem' te declareren. Het object wordt dan in de return-opdracht gemaakt:
     
    function qrst(p,q,r,s) {
      var x = p + q + r + s;
      var y = p * q * r * s;
      return {som: x, product: y};
    }

     
    Refereren gaat net als hier boven:
     
    Stel: var t = qrst(1,2,3,4)
       De som staat in t.som en het product staat in t.product.

Toepassingen van deze benadering zijn te vinden in de items over 2D lineaire algebra, 3D lineaire algebra en complexe getallen.

Opmerking:
 
Dit moet niet worden verward met side-effects ("bijwerkingen"). Je kunt variabelen laten wijzigen door een function, terwijl de function zelf iets heel anders, of niets, teruggeeft. Dat is alleen mogelijk met globale variabelen, die buiten de function dus ook betekenis hebben (lees: variabelen die binnen en buiten de function dezelfde naam hebben en binnen de function niet worden geherdefinieerd).

 
terug

html-376; Laatste wijziging: 21 mei 2020