Web-Dev-For-Beginners/translations/ms/2-js-basics/4-arrays-loops

Asas JavaScript: Array dan Gelung

Sketchnote oleh Tomomi Imura

Kuiz Pra-Kuliah

Kuiz pra-kuliah

Pelajaran ini merangkumi asas JavaScript, bahasa yang memberikan interaktiviti pada web. Dalam pelajaran ini, anda akan mempelajari tentang array dan gelung, yang digunakan untuk memanipulasi data.

🎥 Klik pada imej di atas untuk video tentang array dan gelung.

Anda boleh mengikuti pelajaran ini di Microsoft Learn!

Array

Bekerja dengan data adalah tugas biasa dalam mana-mana bahasa, dan ia menjadi lebih mudah apabila data disusun dalam format struktur seperti array. Dengan array, data disimpan dalam struktur yang serupa dengan senarai. Salah satu kelebihan utama array ialah anda boleh menyimpan pelbagai jenis data dalam satu array.

✅ Array ada di sekeliling kita! Bolehkah anda memikirkan contoh array dalam kehidupan sebenar, seperti susunan panel solar?

Sintaks untuk array adalah sepasang kurungan petak.

let myArray = [];

Ini adalah array kosong, tetapi array boleh diisytiharkan dengan data yang telah diisi. Nilai-nilai dalam array dipisahkan dengan koma.

let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];

Nilai-nilai dalam array diberikan nilai unik yang dipanggil indeks, iaitu nombor bulat yang diberikan berdasarkan jaraknya dari permulaan array. Dalam contoh di atas, nilai string "Chocolate" mempunyai indeks 0, dan indeks "Rocky Road" ialah 4. Gunakan indeks dengan kurungan petak untuk mendapatkan, mengubah, atau memasukkan nilai dalam array.

✅ Adakah anda terkejut bahawa array bermula pada indeks sifar? Dalam beberapa bahasa pengaturcaraan, indeks bermula pada 1. Terdapat sejarah menarik tentang ini, yang anda boleh baca di Wikipedia.

let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];
iceCreamFlavors[2]; //"Vanilla"

Anda boleh menggunakan indeks untuk mengubah nilai, seperti ini:

iceCreamFlavors[4] = "Butter Pecan"; //Changed "Rocky Road" to "Butter Pecan"

Dan anda boleh memasukkan nilai baru pada indeks tertentu seperti ini:

iceCreamFlavors[5] = "Cookie Dough"; //Added "Cookie Dough"

✅ Cara yang lebih biasa untuk menambah nilai ke dalam array adalah dengan menggunakan operator array seperti array.push()

Untuk mengetahui berapa banyak item dalam array, gunakan sifat length.

let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];
iceCreamFlavors.length; //5

✅ Cuba sendiri! Gunakan konsol pelayar anda untuk mencipta dan memanipulasi array ciptaan anda sendiri.

Gelung

Gelung membolehkan kita melakukan tugas berulang atau iteratif, dan boleh menjimatkan banyak masa dan kod. Setiap iterasi boleh berbeza dalam pemboleh ubah, nilai, dan syaratnya. Terdapat pelbagai jenis gelung dalam JavaScript, dan semuanya mempunyai perbezaan kecil, tetapi pada dasarnya melakukan perkara yang sama: mengulangi data.

Gelung For

Gelung for memerlukan 3 bahagian untuk iterasi:

• counter Pemboleh ubah yang biasanya dimulakan dengan nombor yang mengira bilangan iterasi
• condition Ungkapan yang menggunakan operator perbandingan untuk menghentikan gelung apabila false
• iteration-expression Dilaksanakan pada akhir setiap iterasi, biasanya digunakan untuk mengubah nilai counter

// Counting up to 10
for (let i = 0; i < 10; i++) {
  console.log(i);
}

✅ Jalankan kod ini dalam konsol pelayar. Apa yang berlaku apabila anda membuat perubahan kecil pada counter, condition, atau iteration expression? Bolehkah anda membuatnya berjalan ke belakang, mencipta kiraan mundur?

Gelung While

Tidak seperti sintaks gelung for, gelung while hanya memerlukan syarat yang akan menghentikan gelung apabila syarat menjadi false. Syarat dalam gelung biasanya bergantung pada nilai lain seperti counter, dan mesti diuruskan semasa gelung. Nilai permulaan untuk counter mesti dicipta di luar gelung, dan sebarang ungkapan untuk memenuhi syarat, termasuk mengubah counter mesti dikekalkan di dalam gelung.

//Counting up to 10
let i = 0;
while (i < 10) {
 console.log(i);
 i++;
}

✅ Mengapa anda memilih gelung for berbanding gelung while? 17K penonton mempunyai soalan yang sama di StackOverflow, dan beberapa pendapat mungkin menarik untuk anda.

Gelung dan Array

Array sering digunakan dengan gelung kerana kebanyakan syarat memerlukan panjang array untuk menghentikan gelung, dan indeks juga boleh menjadi nilai counter.

let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];

for (let i = 0; i < iceCreamFlavors.length; i++) {
  console.log(iceCreamFlavors[i]);
} //Ends when all flavors are printed

✅ Bereksperimenlah dengan mengulangi array ciptaan anda sendiri dalam konsol pelayar.

---

🚀 Cabaran

Terdapat cara lain untuk mengulangi array selain gelung for dan while. Terdapat forEach, for-of, dan map. Tulis semula gelung array anda menggunakan salah satu teknik ini.

Kuiz Pasca-Kuliah

Kuiz pasca-kuliah

Ulasan & Kajian Kendiri

Array dalam JavaScript mempunyai banyak kaedah yang sangat berguna untuk manipulasi data. Baca tentang kaedah-kaedah ini dan cuba beberapa daripadanya (seperti push, pop, slice dan splice) pada array ciptaan anda.

Tugasan

Ulangi Array

---

Penafian:
Dokumen ini telah diterjemahkan menggunakan perkhidmatan terjemahan AI Co-op Translator. Walaupun kami berusaha untuk memastikan ketepatan, sila ambil maklum bahawa terjemahan automatik mungkin mengandungi kesilapan atau ketidaktepatan. Dokumen asal dalam bahasa asalnya harus dianggap sebagai sumber yang berwibawa. Untuk maklumat penting, terjemahan manusia profesional adalah disyorkan. Kami tidak bertanggungjawab atas sebarang salah faham atau salah tafsir yang timbul daripada penggunaan terjemahan ini.