aboutsummaryrefslogtreecommitdiff
path: root/files/id/web/javascript/reference/global_objects/array/slice/index.html
diff options
context:
space:
mode:
authorPeter Bengtsson <mail@peterbe.com>2020-12-08 14:42:17 -0500
committerPeter Bengtsson <mail@peterbe.com>2020-12-08 14:42:17 -0500
commitda78a9e329e272dedb2400b79a3bdeebff387d47 (patch)
treee6ef8aa7c43556f55ddfe031a01cf0a8fa271bfe /files/id/web/javascript/reference/global_objects/array/slice/index.html
parent1109132f09d75da9a28b649c7677bb6ce07c40c0 (diff)
downloadtranslated-content-da78a9e329e272dedb2400b79a3bdeebff387d47.tar.gz
translated-content-da78a9e329e272dedb2400b79a3bdeebff387d47.tar.bz2
translated-content-da78a9e329e272dedb2400b79a3bdeebff387d47.zip
initial commit
Diffstat (limited to 'files/id/web/javascript/reference/global_objects/array/slice/index.html')
-rw-r--r--files/id/web/javascript/reference/global_objects/array/slice/index.html152
1 files changed, 152 insertions, 0 deletions
diff --git a/files/id/web/javascript/reference/global_objects/array/slice/index.html b/files/id/web/javascript/reference/global_objects/array/slice/index.html
new file mode 100644
index 0000000000..44f018ba65
--- /dev/null
+++ b/files/id/web/javascript/reference/global_objects/array/slice/index.html
@@ -0,0 +1,152 @@
+---
+title: Array.prototype.slice()
+slug: Web/JavaScript/Reference/Global_Objects/Array/slice
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/slice
+---
+<div>{{JSRef}}</div>
+
+<p>Method <code><strong>slice()</strong></code> mengembalikan sebuah salinan dangkal dari sebagian array menjadi sebuah objek array baru yang dimulai dari <code>start</code> sampai <code>end</code> (<code>end</code> tidak termasuk) dimana <code>start</code> dan <code>end</code> merupakan index dari  item yang ada di  array tersebut. Tidak merubah array asli.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/array-slice.html")}}</div>
+
+<p class="hidden">The source for this interactive demo is stored in a GitHub repository. If you'd like to contribute to the interactive demo project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p>
+
+<h2 id="Sintaks">Sintaks</h2>
+
+<pre class="syntaxbox notranslate"><var>arr</var>.slice([<var>start</var>[, <var>end</var>]])
+</pre>
+
+<h3 id="Parameter">Parameter</h3>
+
+<dl>
+ <dt><code><var>start</var></code> {{optional_inline}}</dt>
+ <dd>Indeks berbasis nol untuk memulai ekstraksi.</dd>
+ <dd><br>
+ Indeks negatif dapat digunakan, menunjukkan offset dari akhir urutan.. <code>slice(-2)</code> mengekstrak dua elemen terakhir dari urutan.</dd>
+ <dd>Jika <code><var>start</var></code> tidak terdefinisi, <code>slice</code> memulai dari indeks ke <code>0</code>.</dd>
+ <dd>Jika <code><var>start</var></code> lebih besar dari indeks urutan, array kosong akan dikembalikan.</dd>
+ <dt><code><var>end</var></code> {{optional_inline}}</dt>
+ <dd>Indeks berbasis nol untuk mengakhiri ekstraksi. <code>slice</code> mengekstrak hingga tapi tidak termasuk <code><var>end</var></code>. Sebagai contoh, <code>slice(1,4)</code> mengekstrak elemen kedua menuju elemen ke-empat (indeks elemen 1, 2, dan 3).</dd>
+ <dd>
+ <p>Indeks negatif bisa digunakan,<br>
+ menunjukkan offset dari akhir urutan. <code>slice(2,-1)</code> mengekstrak elemen ketiga menuju elemen kedua-ke-terakhir dalam urutan.</p>
+ </dd>
+ <dd>Jika <code><var>end</var></code> dihillangkan, <code>slice</code> mengekstrak melalui akhir dari urutan (<code><var>arr</var>.length</code>).</dd>
+ <dd>Jika <code><var>end</var></code> lebih besar dari panjang urutan, <code>slice</code> mengkstrak melalui akhir urutan (<code><var>arr</var>.length</code>).</dd>
+</dl>
+
+<h3 id="Return_value">Return value</h3>
+
+<p>Array baru berisi elemen yang diekstrak.</p>
+
+<h2 id="Deskripsi">Deskripsi</h2>
+
+<p><code>slice</code> does not alter the original array. It returns a shallow copy of elements from the original array. Elements of the original array are copied into the returned array as follows:</p>
+
+<ul>
+ <li>For object references (and not the actual object), <code>slice</code> copies object references into the new array. Both the original and new array refer to the same object. If a referenced object changes, the changes are visible to both the new and original arrays.</li>
+ <li>For strings, numbers and booleans (not {{jsxref("String")}}, {{jsxref("Number")}} and {{jsxref("Boolean")}} objects), <code>slice</code> copies the values into the new array. Changes to the string, number, or boolean in one array do not affect the other array.</li>
+</ul>
+
+<p>If a new element is added to either array, the other array is not affected.</p>
+
+<h2 id="Contoh">Contoh</h2>
+
+<h3 id="Return_a_portion_of_an_existing_array">Return a portion of an existing array</h3>
+
+<pre class="brush: js notranslate">let fruits = ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']
+let citrus = fruits.slice(1, 3)
+
+// fruits contains ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']
+// citrus contains ['Orange','Lemon']
+</pre>
+
+<h3 id="Using_slice">Using <code>slice</code></h3>
+
+<p>In the following example, <code>slice</code> creates a new array, <code>newCar</code>, from <code>myCar</code>. Both include a reference to the object <code>myHonda</code>. When the color of <code>myHonda</code> is changed to purple, both arrays reflect the change.</p>
+
+<pre class="brush: js notranslate">// Using slice, create newCar from myCar.
+let myHonda = { color: 'red', wheels: 4, engine: { cylinders: 4, size: 2.2 } }
+let myCar = [myHonda, 2, 'cherry condition', 'purchased 1997']
+let newCar = myCar.slice(0, 2)
+
+// Display the values of myCar, newCar, and the color of myHonda
+// referenced from both arrays.
+console.log('myCar = ' + JSON.stringify(myCar))
+console.log('newCar = ' + JSON.stringify(newCar))
+console.log('myCar[0].color = ' + myCar[0].color)
+console.log('newCar[0].color = ' + newCar[0].color)
+
+// Change the color of myHonda.
+myHonda.color = 'purple'
+console.log('The new color of my Honda is ' + myHonda.color)
+
+// Display the color of myHonda referenced from both arrays.
+console.log('myCar[0].color = ' + myCar[0].color)
+console.log('newCar[0].color = ' + newCar[0].color)
+</pre>
+
+<p>This script writes:</p>
+
+<pre class="notranslate">myCar = [{color: 'red', wheels: 4, engine: {cylinders: 4, size: 2.2}}, 2,
+ 'cherry condition', 'purchased 1997']
+newCar = [{color: 'red', wheels: 4, engine: {cylinders: 4, size: 2.2}}, 2]
+myCar[0].color = red
+newCar[0].color = red
+The new color of my Honda is purple
+myCar[0].color = purple
+newCar[0].color = purple
+</pre>
+
+<h3 id="Array-like_objects">Array-like objects</h3>
+
+<p><code>slice</code> method can also be called to convert Array-like objects/collections to a new Array. You just {{jsxref("Function.prototype.bind", "bind")}} the method to the object. The {{jsxref("Functions/arguments", "arguments")}} inside a function is an example of an 'array-like object'.</p>
+
+<pre class="brush: js notranslate">function list() {
+ return Array.prototype.slice.call(arguments)
+}
+
+let list1 = list(1, 2, 3) // [1, 2, 3]
+</pre>
+
+<p>Binding can be done with the {{jsxref("Function.prototype.call", "call()")}} method of {{jsxref("Function.prototype")}} and it can also be reduced using <code>[].slice.call(arguments)</code> instead of <code>Array.prototype.slice.call</code>.</p>
+
+<p>Anyway, it can be simplified using {{jsxref("Function.prototype.bind", "bind")}}.</p>
+
+<pre class="brush: js notranslate">let unboundSlice = Array.prototype.slice
+let slice = Function.prototype.call.bind(unboundSlice)
+
+function list() {
+ return slice(arguments)
+}
+
+let list1 = list(1, 2, 3) // [1, 2, 3]</pre>
+
+<h2 id="Spesifikasi">Spesifikasi</h2>
+
+<table class="standard-table">
+ <thead>
+ <tr>
+ <th scope="col">Specification</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>{{SpecName('ESDraft', '#sec-array.prototype.slice', 'Array.prototype.slice')}}</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Kompatibilitas_Peramban">Kompatibilitas Peramban</h2>
+
+
+
+<p>{{Compat("javascript.builtins.Array.slice")}}</p>
+
+<h2 id="Lihat_juga">Lihat juga</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.splice()")}}</li>
+ <li>{{jsxref("Function.prototype.call()")}}</li>
+ <li>{{jsxref("Function.prototype.bind()")}}</li>
+</ul>