diff options
| author | Ryan Johnson <rjohnson@mozilla.com> | 2021-04-29 16:16:42 -0700 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2021-04-29 16:16:42 -0700 |
| commit | 95aca4b4d8fa62815d4bd412fff1a364f842814a (patch) | |
| tree | 5e57661720fe9058d5c7db637e764800b50f9060 /files/id/web/javascript/guide/loops_and_iteration | |
| parent | ee3b1c87e3c8e72ca130943eed260ad642246581 (diff) | |
| download | translated-content-95aca4b4d8fa62815d4bd412fff1a364f842814a.tar.gz translated-content-95aca4b4d8fa62815d4bd412fff1a364f842814a.tar.bz2 translated-content-95aca4b4d8fa62815d4bd412fff1a364f842814a.zip | |
remove retired locales (#699)
Diffstat (limited to 'files/id/web/javascript/guide/loops_and_iteration')
| -rw-r--r-- | files/id/web/javascript/guide/loops_and_iteration/index.html | 331 |
1 files changed, 0 insertions, 331 deletions
diff --git a/files/id/web/javascript/guide/loops_and_iteration/index.html b/files/id/web/javascript/guide/loops_and_iteration/index.html deleted file mode 100644 index 506b033350..0000000000 --- a/files/id/web/javascript/guide/loops_and_iteration/index.html +++ /dev/null @@ -1,331 +0,0 @@ ---- -title: Loops and iteration -slug: Web/JavaScript/Guide/Loops_and_iteration -translation_of: Web/JavaScript/Guide/Loops_and_iteration -original_slug: Web/JavaScript/Panduan/Loops_and_iteration ---- -<div>{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Control_flow_and_error_handling", "Web/JavaScript/Guide/Functions")}}</div> - -<p class="summary"><span id="result_box" lang="id"><span>Loop menawarkan cara cepat dan mudah untuk melakukan sesuatu secara berulang-ulang.</span> <span>Bab tentang <a href="/id/docs/Web/JavaScript/Guide">Panduan JavaScript</a> ini memperkenalkan berbagai pernyataan iterasi</span></span><span lang="id"><span> berbeda yang tersedia untuk JavaScript.</span></span></p> - -<p><span id="result_box" lang="id"><span>Anda dapat menganggap <em>loop</em> sebagai versi permainan terkomputerisasi di mana Anda menyuruh seseorang untuk mengambil langkah X menuju satu arah lalu langkah Y ke arah yang lain;</span> <span>Sebagai contoh, gagasan "Pergilah lima langkah ke timur" dapat di ekspresikan dengan cara berikut sebagai sebuah loop (pengulangan):</span></span></p> - -<pre class="brush: js">var langkah; -for (langkah= 0; langkah< 5; langkah++) { - // berlari 5 kali, dengan nilai langkah 0 sampai 4. - console.log('<span class="short_text" id="result_box" lang="id"><span>Berjalan ke timur satu langkah</span></span>'); -} -</pre> - -<p><span id="result_box" lang="id"><span>Ada beberapa jenis loop yang berbeda, namun pada dasarnya semuanya melakukan hal yang sama, mereka mengulangi sebuah aksi beberapa kali (dan sebenarnya memungkinkan bahwa dapat saja menjadi nol).</span> <span>Berbagai mekanisme loop menawarkan berbagai cara untuk menentukan titik awal dan akhir perulangan.</span> <span>Ada berbagai situasi yang lebih mudah dikerjakan oleh sebuah tipe loop dibandingkan tipe (loop) yang lain.</span></span></p> - -<p><span id="result_box" lang="id"><span>Pernyataan untuk loop yang disediakan dalam JavaScript adalah:</span></span></p> - -<ul> - <li>{{anch("for statement")}}</li> - <li>{{anch("do...while statement")}}</li> - <li>{{anch("while statement")}}</li> - <li>{{anch("labeled statement")}}</li> - <li>{{anch("break statement")}}</li> - <li>{{anch("continue statement")}}</li> - <li>{{anch("for...in statement")}}</li> - <li>{{anch("for...of statement")}}</li> -</ul> - -<h2 id="for_statement"><code>for</code> statement</h2> - -<p>Sebuah {{jsxref("statements/for","for loop")}} <span id="result_box" lang="id"><span>mengulang hingga kondisi yang ditentukan evaluasinya menjadi salah/false.</span> <span><code> for</code> loop pada Javascript serupa dengan <code> for </code>loop pada Java dan C</span></span><span lang="id"><span>.</span> <span>Sebuah statement (pernyataan) <code>for </code> terlihat sebagai berikut:</span></span></p> - -<pre class="syntaxbox">for ([initialExpression]; [condition]; -[incrementExpression]) statement -</pre> - -<p>Ketika sebuah <code>for</code> loop dieksekusi, <span class="short_text" id="result_box" lang="id"><span>Berikut ini akan terjadi:</span></span></p> - -<ol> - <li><span class="short_text" id="result_box" lang="id"><span>Ekspresi yang menginisialisasi yaitu</span></span> <code>initialExpression</code>, <span id="result_box" lang="id"><span>Jika ada, maka akan di eksekusi</span>. <span>Ekspresi ini biasanya menginisialisasi satu atau lebih penghitung loop, tetapi sintaksnya memperbolehkan ekspresi dengan tingkat kerumitan apapun.</span> <span>Ekspresi ini juga bisa mendeklarasikan variabel.</span></span></li> - <li>Ekpresi <code>condition</code> di evaluasi. JIka <em>value</em> dari kondisi adalah true (benar), maka statement loop akan dieksekusi. Jika value dari <code>condition</code> false (salah), <code>for</code> loop akan dihentikan. <span id="result_box" lang="id"><span>Jika ekspresi <code>condition </code>dihilangkan sama sekali, kondisinya diasumsikan benar.</span></span></li> - <li>Mengeksekusi <code>Statement</code> . <span id="result_box" lang="id"><span>Untuk mengeksekusi berbagai pernyataan, gunakanlah sebuah blok pernyataan</span></span> (<code>{ ... }</code>) <span class="short_text" id="result_box" lang="id"><span>untuk mengelompokkan pernyataan-pernyataan tersebut</span></span>.</li> - <li>Jika ada, ekspresi baru<code> incrementExpression</code> di eksekusi<span id="result_box" lang="id"><span>.</span></span></li> - <li>Kontrol kembali ke langkah ke-2.</li> -</ol> - -<h3 id="Contoh"><strong>Contoh</strong></h3> - -<p><em>function</em> (fungsi) berikut memuat sebuah statement <code>for</code> yang menghitung angka dari opsi yang terpilih dalam sebuah daftar <em>scrolling</em> (sebuah elemen {{HTMLElement("select")}} yang memperbolehkan berbagai pilihan). Statement<code> for</code> mendeklarasikan variable <code>i</code> dan menginisialisasinya ke nol. Ia memeriksa bahwa<code> i</code> lebih kecil dari nomor dari opsi dalam elemen<code> <select></code> , menampilkan statement <code>if</code> yang berhasil, dan menaikan <code>i</code> satu setelah masing-masing lolos melewati loop.</p> - -<pre class="brush: html"><form name="selectForm"> - <p> - <label for="musicTypes">Choose some music types, then click the button below:</label> - <select id="musicTypes" name="musicTypes" multiple="multiple"> - <option selected="selected">R&B</option> - <option>Jazz</option> - <option>Blues</option> - <option>New Age</option> - <option>Classical</option> - <option>Opera</option> - </select> - </p> - <p><input id="btn" type="button" value="How many are selected?" /></p> -</form> - -<script> -function howMany(selectObject) { - var numberSelected = 0; - for (var i = 0; i < selectObject.options.length; i++) { - if (selectObject.options[i].selected) { - numberSelected++; - } - } - return numberSelected; -} - -var btn = document.getElementById('btn'); -btn.addEventListener('click', function() { - alert('Number of options selected: ' + howMany(document.selectForm.musicTypes)); -}); -</script> - -</pre> - -<h2 id="do...while_statement"><code>do...while</code> statement</h2> - -<p>Pernyataan/statement {{jsxref("statements/do...while", "do...while")}} terus di ulangi sampai evaluasi kondisi bernilai false/salah. Sebuah <code>do...while</code> statement terlihat sebagai berikut:</p> - -<pre class="syntaxbox">do - statement -while (condition); -</pre> - -<p><code>statement</code> di jalankan lebih dulu sebelum kondisi diperiksa. Untuk menjalankan banyak statements, gunakan statement blok (<code>{ ... }</code>) untuk membuat grup dari statement tersebut. Jika <code>condition</code> bernilai benar, maka statement akan dijalankan kembali. Kondisi diperiksa pada setiap akhir eksekusi. Ketika kondisi bernilai salah, eksekusi berhenti dan kontrol akan melewati pernyataan yang mengikuti <code>do...while</code>.</p> - -<h3 id="Contoh_2"><strong>Contoh</strong></h3> - -<p>Dalam contoh berikut, perulangan <code>do</code> di iterasi sekali dan di iterasi kembali sampai i tidak lagi kurang dari 5. </p> - -<pre class="brush: js">var i = 0; -do { - i += 1; - console.log(i); -} while (i < 5);</pre> - -<h2 id="while_statement"><code>while</code> statement</h2> - -<p>Sebuah statement {{jsxref("statements/while","while")}} di eksekusi pernyataan pernyataannya asalkan memenuhi syarat kondisinya yang bernilai true/benar. Sebuah statement <code>while</code> terlihat sebagai berikut:</p> - -<pre class="syntaxbox">while (condition) - statement -</pre> - -<p>Jika kondisi bernilai false/salah, <code>statement</code> dengan perulangan berhenti di eksekusi dan kontrol akan melewati statement yang mengikuti perulangan tersebut.</p> - -<p>Kondisi terjadi sebelum <code>statement</code> dalam perulangan di eksekusi. Jika kondisi bernilai true/benar, <code>statement</code> di eksekusi dan kondisi di uji kembali. Jika kondisi bernilai false/salah, eksekusi akan berhenti dan konrol lewat untuk statement yang mengikuti <code>while</code>.</p> - -<p>Untuk mengeksekusi banyak statement, gunakan blok statement ({ ... }) untuk mengelompokan banyak statement tersebut.</p> - -<h3 id="Contoh_1"><strong>Contoh 1</strong></h3> - -<p>Beikut perulangan <code>while</code> mengiterasi <code>n</code> selama n kurang dari tiga:</p> - -<pre class="brush: js">var n = 0; -var x = 0; -while (n < 3) { - n++; - x += n; -} -</pre> - -<p>Dengan setiap iterasi, perulangan akan menambahkan increments <code>n</code> dan menambahkan nilainya pada <code>x</code>. Karena itu, <code>x</code> dan <code>n</code> mengambil nilai nilai berikut:</p> - -<ul> - <li>Setelah lewat awal: <code>n</code> = 1 dan <code>x</code> = 1</li> - <li>Setelah lewat kedua: <code>n</code> = 2 dan <code>x</code> = 3</li> - <li>Setelah lewat ketiga: <code>n</code> = 3 dan <code>x</code> = 6</li> -</ul> - -<p>Setelah melewati perulangan yang ketiga , kondisinya <code>n < 3</code> tidak lagi bernilai true/benar, jadi perulangan di hentikan.</p> - -<h3 id="Contoh_2_2"><strong>Contoh 2</strong></h3> - -<p>Hindari perulangan tanpa batas. Pastikan kondisi dalam perulangan mendapatkan kondisi yang bernilai false/salah untuk berhenti, jika tidak perulangan tidak akan pernah berhenti. Statements dalam <code>while</code> berikut di eksekusi berulang kali selamanya karena kondisi tidak pernah mendapatkan nilai false/salah:</p> - -<pre class="brush: js">while (true) { - console.log('Hello, world!'); -}</pre> - -<h2 id="labeled_statement"><code>labeled</code> statement</h2> - -<p>Sebuah {{jsxref("statements/label","label")}} menyediakan sebuah statement dengan pengenal yang memungkinkan Anda merujuknya di tempat lain dalam program Kamu. Untuk contohnya, Kamu dapat menggunakan label untuk mengidentifikasi pengulangan, lalu gunakan statement <code>break</code> atau <code>continue</code> untuk menunjukkan apakah suatu program harus memutuskan loop atau melanjutkan eksekusinya.</p> - -<p>Sintak dari statement berlabel terlihat seperti berikut:</p> - -<pre class="syntaxbox">label : - statement -</pre> - -<p>Nilai dai sebuah <code><em>label</em></code> dapat berupa identifikasi JavaScript apa pun yang tidak dari kata kunci yang ada pada javascript. <code><em>statement</em></code><br> - yang Kamu identifikasi dengan label tersebut dapat berupa statement apa pun.</p> - -<h3 id="Contoh_3"><strong>Contoh</strong></h3> - -<p>Pada contoh ini, label <code>markLoop</code> mengidentifikasi sebuah perulangan <code>while</code>.</p> - -<pre class="brush: js">markLoop: -while (theMark == true) { - doSomething(); -}</pre> - -<h2 id="break_statement"><code>break</code> statement</h2> - -<p>Gunakan {{jsxref("statements/break","break")}} statement untuk menghentikan perulangan, <code>switch</code>, atau konjungsi dengan statement yang memakai label.</p> - -<ul> - <li>Ketika kamu menggunakan <code>break</code> tanpa sebuah label, Itu akan langsung mengakhiri lampiran yang ada didalam <code>while</code>, <code>do-while</code>, <code>for</code>, atau <code>switch</code> dengan segera dan kontrol pindah dari statement tersebut.</li> - <li>Ketika kamu menggunakan <code>break</code> pada sebuah label, Itu akan mengakhiri statement dari spesifik label.</li> -</ul> - -<p>Sintak dari statement <code>break</code> terlihat seperti ini:</p> - -<pre class="syntaxbox">break [<em>label</em>]; -</pre> - -<p>Bentuk pertama sintak mengakhiri perulangan atau <code>switch</code>; Bentuk kedua sintak mengakhiri statement dari spesifik label.</p> - -<h3 id="Contoh_1_2"><strong>Contoh</strong> <strong>1</strong></h3> - -<p>Contoh berikut mengiterasi melewati elemen-elemen dalam array sampai menemukan indeks elemen yang bernilai dari <code>theValue</code>:</p> - -<pre class="brush: js">for (var i = 0; i < a.length; i++) { - if (a[i] == theValue) { - break; - } -}</pre> - -<h3 id="Contoh_2_Breaking_pada_sebuah_label"><strong>Contoh 2: </strong>Breaking pada sebuah label</h3> - -<pre class="brush: js">var x = 0; -var z = 0; -labelCancelLoops: while (true) { - console.log('Outer loops: ' + x); - x += 1; - z = 1; - while (true) { - console.log('Inner loops: ' + z); - z += 1; - if (z === 10 && x === 10) { - break labelCancelLoops; - } else if (z === 10) { - break; - } - } -} -</pre> - -<h2 id="continue_statement"><code>continue</code> statement</h2> - -<p>Statement {{jsxref("statements/continue","continue")}} bisa digunakan untuk memulai lagi statement <code>while</code>, <code>do-while</code>, <code>for</code>, atau <code>label</code>.</p> - -<ul> - <li>Ketika kamu menggunakan <code>continue</code> tanpa sebuah label, itu akan menghentikan iterasi saat ini dari statement <code>while</code>, <code>do-while</code>, atau <code>for</code> dan melanjutkan eksekusi dari perulangan iterasi selanjutnya. Berbeda dengan statement <code>break</code>, <code>continue</code> tidak mengakhiri eksekusi dari perulangan sepenuhnya. Pada sebuah perulangan <code>while</code>, dia lompat kembali pada kondisinya. Pada sebuah perulangan <code>for</code>, Dia melompat ke ekpresi penambahan ke <code>increment-expression</code>.</li> - <li>Ketika kamu menggunakan <code>continue</code> dengan sebuah label, itu berlaku untuk pernyataan perulangan yang diidentifikasi dengan label tersebut.</li> -</ul> - -<p>Sintak statement <code>continue</code> terlihat sebagai berikut:</p> - -<pre class="syntaxbox">continue [<em>label</em>]; -</pre> - -<h3 id="Contoh_1_3"><strong>Contoh 1</strong></h3> - -<p>Contoh berikut menunjukkan sebuah perulangan <code>while</code> dengan sebuah statement <code>continue</code> yang di eksekusi ketika niai dari <code>i</code> adalah tiga Jadi, <code>n</code> mengambil nilai satu, tiga, tujuh dan dua belas.</p> - -<pre class="brush: js">var i = 0; -var n = 0; -while (i < 5) { - i++; - if (i == 3) { - continue; - } - n += i; -} -</pre> - -<h3 id="Contoh_2_3"><strong>Contoh 2</strong></h3> - -<p>Sebuah statement yang berlabel <code>checkiandj</code> berisikan sebuah statement berlabel <code>checkj</code>. Jika ada <code>continue</code> , Programnya akan menghentikan iterasi saat ini dari <code>checkj</code> dan memulai iterasi selanjutnya. Setiap kali <code>continue</code> ditemui, <code>checkj</code> di iterasi kembali sampai kondisinya bernilai <code>false</code>/salah. Ketika bernilai <code>false</code>/salah, Sisa dari statement <code>checkiandj</code> sudah selesai, dan <code>checkiandj</code> di iterasi kembali sampai kondisi bernilai salah <code>false</code>. Ketika bernilai salah <code>false</code> , program melanjutkan pada statement yang mengikuti <code>checkiandj</code>.</p> - -<p>JIka <code>continue</code> dipunyai label dari <code>checkiandj</code>, program akan terus berlanjut ke bagian atas dari statement <code>checkiandj</code> .</p> - -<pre class="brush: js">checkiandj: - while (i < 4) { - console.log(i); - i += 1; - checkj: - while (j > 4) { - console.log(j); - j -= 1; - if ((j % 2) == 0) { - continue checkj; - } - console.log(j + ' is odd.'); - } - console.log('i = ' + i); - console.log('j = ' + j); - }</pre> - -<h2 id="for...in_statement"><code>for...in</code> statement</h2> - -<p>Statement {{jsxref("statements/for...in","for...in")}} mengiterasi sebuah variabel spesifik diatas properti enumerable dari sebuah objek. Untuk setiap properti yang berbeda, JavaScript mengeksekusi pernyataan pernyataan yang spesifik. Sebuah statement <code>for...in</code> terlihat sebagai berikut:</p> - -<pre class="syntaxbox">for (variable in object) { - statements -} -</pre> - -<h3 id="Contoh_4"><strong>Contoh</strong></h3> - -<p>Function/fungsi berikut mengambil argumentnya dari sebuah objek dan nama objek. Lalu dia di iterasi diatas semua property objek dan mengembalikan sebuah string yang mendaftarkan nama properti dan nilainya.</p> - -<pre class="brush: js">function dump_props(obj, obj_name) { - var result = ''; - for (var i in obj) { - result += obj_name + '.' + i + ' = ' + obj[i] + '<br>'; - } - result += '<hr>'; - return result; -} -</pre> - -<p>Untuk sebuah objek <code>car</code> dengan property <code>make</code> dan <code>model</code>, <code>result/hasil</code> akan menjadi:</p> - -<pre class="brush: js">car.make = Ford -car.model = Mustang -</pre> - -<h3 id="Arrays"><strong>Arrays</strong></h3> - -<p>Meskipun mungkin menggunakan ini sebagai cara untuk melakukan iterasi di atas elemen {{jsxref("Array")}},statement <strong>for...in</strong> akan mengembalikan nilai nama property yang di tetapkan pengguna dalam penambahan numerik indek. Jadi lebih baik menggunakan tradisional perulangan {{jsxref("statements/for","for")}} dengan sebuah numerik indek ketika mengiterasi diatas array, karena statement <strong>for...in</strong> mengiterasi diatas nama properti yang di tetapkan pengguna pada penambahan elemen array, Jika kamu merubah array, seperti menambahkan properti atau metode. </p> - -<h2 id="for...of_statement"><code>for...of</code> statement</h2> - -<p>Statement {{jsxref("statements/for...of","for...of")}} membuat sebuah iterasi perulangan diatas <a href="/en-US/docs/Web/JavaScript/Guide/iterable">iterable objects</a> (termasuk {{jsxref("Array")}}, {{jsxref("Map")}}, {{jsxref("Set")}}, {{jsxref("functions/arguments","arguments")}} object dan seterusnya), menjalankan hubungan iterasi khusus dengan statement yang akan dieksekusi untuk setiap nilai properti yang berbeda.</p> - -<pre class="syntaxbox">for (<em>variable</em> of <em>object</em>) { - <em>statement -</em>}</pre> - -<p>Contoh berikut menampilkan perbedaan diantara sebuah perulangan <code>for...of</code> dan sebuah perulangan {{jsxref("statements/for...in","for...in")}}. Ketika <code>for...in</code> mengiterasi diatas nama-nama properti, <code>for...of</code> mengiterasi diatas nilai-nilai properti:</p> - -<pre class="brush:js">let arr = [3, 5, 7]; -arr.foo = 'hello'; - -for (let i in arr) { - console.log(i); // logs "0", "1", "2", "foo" -} - -for (let i of arr) { - console.log(i); // logs 3, 5, 7 -} -</pre> - -<p>{{PreviousNext("Web/JavaScript/Guide/Control_flow_and_error_handling", "Web/JavaScript/Guide/Functions")}}</p> |
