1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
|
---
title: Array.prototype.concat()
slug: Web/JavaScript/Reference/Global_Objects/Array/concat
tags:
- Array
- JavaScript
- Methode(2)
- Prototype
translation_of: Web/JavaScript/Reference/Global_Objects/Array/concat
---
<div>{{JSRef}}</div>
<p><code>De <strong>concat()</strong></code> methode geeft een nieuwe array terug bestaande uit de array waarop het is aangeroepen samengevoegd met de array(s) en/of waarden die zijn geleverd als argumenten.</p>
<h2 id="Syntax">Syntax</h2>
<pre class="syntaxbox"><code>var <var>nieuwe_array</var> = <var>oude_array</var>.concat(waarde1[, waarde2[, ...[, waardeN]]])</code></pre>
<h3 id="Parameters">Parameters</h3>
<dl>
<dt><code>waardeN</code></dt>
<dd>Arrays en/of waarden om te concateneren in een nieuwe array. Zie de beschrijving voor details.</dd>
</dl>
<h3 id="Returnwaarde">Returnwaarde</h3>
<p>Een nieuwe instantie van type {{jsxref("Array")}}.</p>
<h2 id="Beschrijving">Beschrijving</h2>
<p><code>concat</code> maakt een nieuwe array bestaande uit de elementen in het object waarop het is aangeroepen, gevolgd door voor ieder argument de elementen van dat argument (als het argument een array is) of het argument zelf (als het argument geen array is).</p>
<p><code>concat</code> verandert <code>this</code> niet en ook niet de als argument gegeven arrays, maar levert in plaats daarvan een <em>shallow copy</em> welke kopieën bevat van dezelfde elementen gecombineerd van de orginele arrays. Elementen van de orginele arrays worden als volgt gekopiëerd in de nieuwe array:</p>
<ul>
<li>Objectreferenties (en niet het daardwerkelijke object): <code>concat</code> kopieert objectreferenties in de nieuwe array. Zowel de orginele array als de nieuwe array verwijzen naar dezelfde objecten. Dit betekent, als een verwezen object gewijzigd wordt, de wijzigingen zichtbaar zijn in zowel de nieuwe als de orginele array.</li>
<li>Strings en getallen (niet {{jsxref("Global_Objects/String", "String")}} en {{jsxref("Global_Objects/Number", "Number")}} objects): <code>concat</code> kopieert de waarden van strings en getallen in de nieuwe array.</li>
</ul>
<div class="note">
<p><strong>Opmerking:</strong> Concateneren van array(s)/waarde(n) laat de orginelen onaangetast. Bovendien zal iedere operatie op de nieuwe array geen effect hebben op de orginele array en vice versa.</p>
</div>
<h2 id="Voorbeelden">Voorbeelden</h2>
<h3 id="Concateneren_van_twee_arrays">Concateneren van twee arrays</h3>
<p>De volgende code concateneert twee arrays</p>
<pre class="brush: js">var alfa = ['a', 'b', 'c'],
nummer = [1, 2, 3];
var alfaNummeriek = alfa.concat( nummer );
console.log(alfaNummeriek); // Resultaat: ['a', 'b', 'c', 1, 2, 3]
</pre>
<h3 id="Concateneren_van_drie_arrays">Concateneren van drie arrays</h3>
<p>De volgende code concateneert drie arrays</p>
<pre class="brush: js">var num1 = [1, 2, 3],
num2 = [4, 5, 6],
num3 = [7, 8, 9];
var nums = num1.concat(num2, num3);
console.log(nums); // Resultaat: [1, 2, 3, 4, 5, 6, 7, 8, 9]
</pre>
<h3 id="Concateneren_van_waarden_naar_een_array">Concateneren van waarden naar een array</h3>
<p>De volgende code concateneert drie waarden naar een array:</p>
<pre class="brush: js">var alfa = ['a', 'b', 'c'];
var alfaNumeriek = alfa.concat(1, [2, 3]);
console.log( alfaNumeriek);
// Resultaat: ['a', 'b', 'c', 1, 2, 3]
</pre>
<h2 id="Specificaties">Specificaties</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Specificatie</th>
<th scope="col">Status</th>
<th scope="col">Opmerking</th>
</tr>
<tr>
<td>{{SpecName('ES3')}}</td>
<td>{{Spec2('ES3')}}</td>
<td>Eerste definitie. Geïmplementeerd in JavaScript 1.2.</td>
</tr>
<tr>
<td>{{SpecName('ES5.1', '#sec-15.4.4.4', 'Array.prototype.concat')}}</td>
<td>{{Spec2('ES5.1')}}</td>
<td> </td>
</tr>
<tr>
<td>{{SpecName('ES6', '#sec-array.prototype.concat', 'Array.prototype.concat')}}</td>
<td>{{Spec2('ES6')}}</td>
<td> </td>
</tr>
<tr>
<td>{{SpecName('ESDraft', '#sec-array.prototype.concat', 'Array.prototype.concat')}}</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>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari</th>
</tr>
<tr>
<td>Basis support</td>
<td>{{CompatChrome("1.0")}}</td>
<td>{{CompatGeckoDesktop("1.7")}}</td>
<td>{{CompatIE("5.5")}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Android</th>
<th>Chrome for Android</th>
<th>Firefox Mobile (Gecko)</th>
<th>IE Mobile</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
</tr>
<tr>
<td>Basis support</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
</tr>
</tbody>
</table>
</div>
<h2 id="Zie_ook">Zie ook</h2>
<ul>
<li>{{jsxref("Array.push", "push")}} / {{jsxref("Array.pop", "pop")}} — toevoegen/verwijderen van elementen aan het einde van de array</li>
<li>{{jsxref("Array.unshift", "unshift")}} / {{jsxref("Array.shift", "shift")}} — toevoegen/verwijderen van elementen aan het begin van de array</li>
<li>{{jsxref("Array.splice", "splice")}} — toevoegen/verwijderen van elementen op een gespecificeerde locatie van de array</li>
<li>{{jsxref("String.prototype.concat()")}}</li>
<li>{{jsxref("Symbol.isConcatSpreadable")}} – control flattening.</li>
</ul>
|