diff options
Diffstat (limited to 'files/nl/web/javascript/reference/functions/rest_parameters/index.html')
-rw-r--r-- | files/nl/web/javascript/reference/functions/rest_parameters/index.html | 183 |
1 files changed, 0 insertions, 183 deletions
diff --git a/files/nl/web/javascript/reference/functions/rest_parameters/index.html b/files/nl/web/javascript/reference/functions/rest_parameters/index.html deleted file mode 100644 index e4c2acae46..0000000000 --- a/files/nl/web/javascript/reference/functions/rest_parameters/index.html +++ /dev/null @@ -1,183 +0,0 @@ ---- -title: Rest parameters -slug: Web/JavaScript/Reference/Functions/rest_parameters -translation_of: Web/JavaScript/Reference/Functions/rest_parameters ---- -<div>{{jsSidebar("Functions")}}</div> - -<p>De <strong>rest parameter</strong> syntax laat ons toe om een onbepaald aantal argumenten te vertegenwoordigen als een array.</p> - -<h2 id="Syntax">Syntax</h2> - -<pre class="brush: js">function(a, b, ...theArgs) { - // ... -} -</pre> - -<h2 id="Beschrijving">Beschrijving</h2> - -<p>Als het laatst genoemd argument van een functie wordt voorafgegaan door ..., dan wordt dit een array waarvan de elementen van 0 tot theArgs.length worden doorgegeven als eigenlijke argumenten aan de functie.</p> - -<p>In het bovestaande voorbeeld, verzameld theArgs als derde argument van de functie. Alle opeenvolgende argumenten die na a en b zijn toegevoegd in de argumenten lijst.</p> - -<h3 id="Verschillen_tussen_de_rest_parameter_en_het_arguments_object">Verschillen tussen de rest parameter en het arguments object</h3> - -<p>Er zijn drie belangrijke verschillen tussen de rest parameters en het <a href="/en-US/docs/Web/JavaScript/Reference/Functions/arguments" title="arguments"><code>arguments</code></a> object:</p> - -<ul> - <li>rest parameters zijn alleen de argumenten die niet via een andre naam aan de functie zijn doorgegeven, terwijl het arguments object wel alle argumenten bevat die zijn doorgegeven.</li> - <li>het <code>arguments</code> object is niet echt een array, terwijl de rest parameters wel een instantie van een <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array" title="Array"><code>Array</code></a> zijn, waardoor je methodes zoals <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort" title="Array sort method"><code>sort</code></a>, <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map" title="Array map method"><code>map</code></a>, <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach" title="Array forEach method"><code>forEach</code></a> en <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/pop" title="Array pop method">pop</a></code> rechtstreeks kan gebruiken.</li> - <li>de argumenten object heeft extra functionaliteit specifiek voor zichzelf (zoals de <code>callee</code> property).</li> -</ul> - -<h3 id="Van_arguments_tot_een_array">Van arguments tot een array</h3> - -<p>Rest parameters zijn ingevoerd om de standaardcode die werd veroorzaakt door het arguments object te verminderen.</p> - -<pre class="brush: js">// Voor rest parameters, kwam je het volgende wel eens tegen: -function f(a, b){ - var args = Array.prototype.slice.call(arguments, f.length); - - // … -} - -// Wat net hetzelfde is als: - -function f(a, b, ...args) { - -} -</pre> - -<h2 id="Voorbeelden">Voorbeelden</h2> - -<p>Aangezien theArgs een array is, kunt u de telling van de elementen verkrijgen met het behulp van de eigenschap <strong>.length</strong>:</p> - -<pre class="brush: js">function fun1(...theArgs) { - console.log(theArgs.length); -} - -fun1(); // 0 -fun1(5); // 1 -fun1(5, 6, 7); // 3 -</pre> - -<p>In het volgende voorbeeld, gebruiken we de <strong>rest parameter</strong> voor het verzamelen vanaf het tweede argument tot het einde. We vermenigvuldigen deze vervolgens met de eerste:</p> - -<pre class="brush: js">function multiply(multiplier, ...theArgs) { - return theArgs.map(function (element) { - return multiplier * element; - }); -} - -var arr = multiply(2, 1, 2, 3); -console.log(arr); // [2, 4, 6] -</pre> - -<p>Het volgende voorbeeld toont aan dat je Array methodes kan gebruiken op <strong>rest parameters</strong> maar niet op het <strong>arguments</strong> object:</p> - -<pre class="brush: js">function sortRestArgs(...theArgs) { - var sortedArgs = theArgs.sort(); - return sortedArgs; -} - -console.log(sortRestArgs(5,3,7,1)); // toont 1,3,5,7 - -function sortArguments() { - var sortedArgs = arguments.sort(); - return sortedArgs; // dit zal nooit gebeuren -} - -// gooit een TypeError: arguments.sort is not a function -console.log(sortArguments(5,3,7,1)); -</pre> - -<p>Om Array methodes op het <strong>arguments</strong> object te gebruiken, moet je het eerst converteren naar een echte array.</p> - -<h2 id="Specificatie">Specificatie</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-function-definitions', 'Function Definitions')}}</td> - <td>{{Spec2('ES6')}}</td> - <td>Initial definition.</td> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-function-definitions', 'Function Definitions')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td></td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibiliteit">Browser compatibiliteit</h2> - -<div>{{CompatibilityTable}}</div> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome</th> - <th>Edge</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatChrome(47)}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatGeckoDesktop("15.0")}}</td> - <td>{{CompatNo}}</td> - <td>34</td> - <td>{{CompatNo}}</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Android Webview</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - <th>Chrome for Android</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatNo}}</td> - <td>{{CompatChrome(47)}}</td> - <td>{{CompatGeckoMobile("15.0")}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatChrome(47)}}</td> - </tr> - </tbody> -</table> -</div> - -<h2 id="Bekijk_ook">Bekijk ook</h2> - -<ul> - <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions/arguments" title="arguments">Arguments object</a></li> - <li><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array" title="Array">Array</a></li> - <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions" title="Functions and function scope">Functions</a></li> - <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator" title="spread operator">Spread Operator</a></li> - <li><a class="external" href="http://wiki.ecmascript.org/doku.php?id=harmony:rest_parameters">Original proposal at ecmascript.org</a></li> - <li><a class="external" href="http://javascriptweblog.wordpress.com/2011/01/18/javascripts-arguments-object-and-beyond/">JavaScript arguments object and beyond</a></li> -</ul> |