Biasakan diri Anda dengan array dengan menyelesaikan latihan di bawah ini. Pertama, kita akan berlatih membuat dan memanipulasi array di konsol JavaScript, lalu kita akan melanjutkan untuk mengimplementasikannya ke dalam proyek kecil menggunakan konsep HTML dan JavaScript yang kita pelajari di bagian terakhir
Pemanasan
- Apa itu pointer?
- Bagaimana kita bisa menggunakan notasi tanda kurung siku untuk mengisolasi satu elemen dalam array?
- Apa perbedaan antara Array.prototype.pop() dan Array.prototype.push()?
- Jenis objek apa yang dapat ditempatkan ke dalam larik JavaScript?
Kode
Bermain-main dengan array Anda sendiri dengan menyelesaikan setiap hal berikut di konsol DevTools
- Susun nama saudara atau nama karakter film favorit Anda
- Buat array dari nama orang tua Anda
- Gabungkan kedua larik ini menggunakan Array.prototype.concat()
- Tambahkan nama hewan peliharaan Anda menggunakan Array.prototype.push()
- Membalik urutan array. Untuk melakukan ini, teliti metode larik pada MDN yang melakukan fungsi pembalikan
- Akses salah satu nama orang tua Anda menggunakan notasi tanda kurung siku
- Perbarui nama salah satu orang tua Anda menggunakan notasi indeks dan tanda kurung siku
- Lihat metode dari (tetap menggunakan metode instan). Setiap orang dalam pasangan atau grup Anda harus memilih satu metode larik baru untuk dicoba
Halaman Web Hal Favorit
Saat Anda merasa nyaman menggunakan array di konsol, lanjutkan dengan mengimplementasikannya ke dalam proyek lengkap
Catatan. Anda dapat mencoba solusi di editor interaktif di bawah ini, namun mungkin berguna untuk mengunduh kode dan menggunakan alat online seperti CodePen, jsFiddle, atau Glitch untuk mengerjakan tugas
Jika Anda buntu, minta bantuan kami — lihat bagian di bagian bawah halaman ini
Catatan. Dalam contoh di bawah ini, jika ada kesalahan dalam kode Anda, itu akan ditampilkan ke panel hasil di halaman, untuk membantu Anda mencoba menemukan jawabannya (atau ke konsol JavaScript browser, untuk versi yang dapat diunduh)
Mari kita mulai dengan beberapa latihan susunan dasar. Dalam tugas ini kami ingin Anda membuat larik tiga item, disimpan di dalam variabel bernama myArray. Barangnya bisa apa saja yang Anda inginkan — bagaimana dengan makanan atau band favorit Anda?
Selanjutnya, ubah dua item pertama dalam larik menggunakan notasi dan penetapan tanda kurung sederhana. Kemudian tambahkan item baru ke awal array
Coba perbarui kode langsung di bawah untuk membuat ulang contoh yang sudah selesai
Unduh titik awal untuk tugas ini bekerja di editor Anda sendiri atau di editor online
Sekarang mari beralih ke tugas lain. Di sini Anda diberikan string untuk dikerjakan. Kami ingin Anda melakukannya
- Ubah string menjadi array, hapus + karakter dalam proses. Simpan hasilnya dalam variabel bernama myArray
- Simpan panjang array dalam variabel yang disebut arrayLength
- Simpan item terakhir dalam array dalam variabel yang disebut lastItem
Coba perbarui kode langsung di bawah untuk membuat ulang contoh yang sudah selesai
Unduh titik awal untuk tugas ini bekerja di editor Anda sendiri atau di editor online
Untuk tugas larik ini, kami memberi Anda larik awal, dan Anda akan bekerja agak berlawanan arah. Kamu butuh
Untuk setiap latihan di bawah ini, asumsikan Anda memulai dengan larik people berikut
let people = ["Greg", "Mary", "Devon", "James"];
- Menggunakan loop, lakukan iterasi melalui array dan konsol ini. log semua orang
- Tulis perintah untuk menghapus "Greg" dari array
- Tulis perintah untuk menghapus "James" dari array
- Tulis perintah untuk menambahkan "Matt" ke depan array
- Tulis perintah untuk menambahkan nama Anda ke akhir array
- Menggunakan loop, lakukan iterasi melalui array ini dan setelah konsol. masuk "Mary", keluar dari loop
- Tulis perintah untuk membuat salinan array menggunakan slice. Salinan TIDAK boleh menyertakan "Mary" atau "Matt"
- Tulis perintah yang memberikan indexOf di mana "Mary" berada
- Tulis perintah yang memberikan indexOf di mana "Foo" berada (ini harus mengembalikan -1)
- Tetapkan ulang variabel orang dengan nilai yang Anda mulai. Menggunakan perintah splice, hapus "Devon" dari array dan tambahkan "Elizabeth" dan "Artie". Array Anda akan terlihat seperti ini setelah selesai ["Greg", "Mary", "Elizabeth", "Artie", "James"]
- Buat variabel baru bernama withBob_ dan atur sama dengan array people yang digabungkan dengan string "Bob"
Solusi Kode
Anda dapat menemukan solusi untuk latihan di sini
Saat Anda siap, lanjutkan ke Object Basics
Melanjutkan