Ganti for loop dengan foreach javascript

Array adalah kumpulan elemen yang terurut. Dalam JavaScript, array dapat dibuat menggunakan notasi objek formal, atau dapat diinisialisasi menggunakan notasi literal, seperti yang ditunjukkan pada kode berikut

var arrObject = new Array("val1", "val2"); // array as object var arrLiteral = ["val1", "val2"]; // array literal

Untuk pengembang, tidak ada perbedaan. Anda dapat memanggil metode var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_3 pada literal dan objek. Namun, untuk mesin JavaScript, literal array harus ditafsirkan ulang setiap kali diakses, terutama saat digunakan dalam pemanggilan fungsi. Sisi positifnya, literal array dapat menggantikan kebutuhan akan variabel sementara, terutama saat mengirim nilai ke suatu fungsi

Objek var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_3 baru dibuat menggunakan operator var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean5, sebagai berikut

var arrObject = new Array();_

Anda juga dapat membuat larik baru yang memiliki beberapa nilai

var arrObject = new Array("val1","val2");

Anda dapat membuat literal array dengan menggunakan tanda kurung siku untuk menyimpan nilai array. Misalnya, Anda dapat mendefinisikan literal array dan menugaskannya ke variabel

var arrLiteral = ["val1","val2","val3"];_

Anda juga dapat membuat, dan menggunakan, array literal dalam pemanggilan fungsi atau metode

someFunction("param1", ["val1","val2"]);

Perhatikan, bagaimanapun, bahwa ketika Anda meneruskan variabel yang berisi array literal ke suatu fungsi, itu diteruskan dengan referensiâsama seperti meneruskan variabel yang memegang objek var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3. Perubahan variabel dalam fungsi tercermin di luar fungsi

function chgArray(arr) { arr[0] = "surprise!"; } var newArray = new Array("val1", "val2"); var newLiteral = ["val1","val2"]; chgArray(newArray); chgArray(newLiteral); alert(newArray); // prints surprise!,val2 alert(newLiteral); // prints surprise!,val2_

Sebuah array, apakah literal atau objek, dapat menyimpan nilai dari tipe data yang berbeda

var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_

Anda dapat mencetak sebuah array;

alert(arrLiteral); // prints out val1,34,true,val2,18,false

Dalam contoh ini, mesin JavaScript membuat konversi larik ke string untuk literal larik dan objek larik yang terkandung sebagai elemen di dalam literal larik

Elemen array dapat diakses secara langsung, menggunakan tanda kurung siku yang berisi indeksnya (posisi dalam array). Selain itu, elemen array dapat diatur menggunakan indeks yang sama, yang secara otomatis membuat elemen array jika tidak ada

var arrObject = new Array(); arrObject[0] = "cat"; // array now has one element alert(arrObject[0]); // prints cat

Array dalam JavaScript berbasis nol, yang berarti indeks elemen pertama adalah nol, dan elemen terakhir adalah panjang array, minus 1

var farmAnimals = new Array("cat","dog","horse","pig"); alert(farmAnimals[0]); // print cat alert(farmAnimals[3]); // print pig

Tidak semua elemen array harus didefinisikan saat dibuat. Misalnya, jika Anda membuat literal array, Anda dapat menggunakan koma untuk membatasi elemen array yang belum ada

var arrObject = new Array();_0

Dalam kode ini, elemen array kedua saat ini adalah var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean7. Namun, Anda tidak dapat menggunakan koma kosong untuk menambahkan elemen larik yang tidak terdefinisi ke akhir larik. JavaScript hanya akan mengabaikannya

Untuk membuat larik dari beberapa elemen yang tidak terdefinisi, Anda dapat memberikan panjang larik saat membuat larik

var arrObject = new Array();_1

Setelah Anda membuat larik, menggunakan var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3 objek atau notasi literal, Anda dapat mengakses elemen larik dalam satu lingkaran, atau menggunakan sejumlah metode larik

5. 1.  Mengulang Melalui Larik

Anda ingin mengakses semua elemen array dengan mudah

Pendekatan yang paling umum untuk mengakses array adalah dengan menggunakan var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean9 loop

var arrObject = new Array();_2

Loop var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_9 dapat digunakan untuk mengakses setiap elemen array. Larik dimulai dari nol, dan properti larik alert(arrLiteral); // prints out val1,34,true,val2,18,false1 digunakan untuk mengatur akhir perulangan

Namun terkadang, Anda tidak ingin mengakses setiap elemen array. Misalnya, Anda mungkin ingin menjelajahi larik hingga menemukan elemen tertentu, atau elemen apa pun yang memenuhi (atau tidak memenuhi) kriteria tertentu. Dalam kasus ini, Anda akan ingin menggunakan alert(arrLiteral); // prints out val1,34,true,val2,18,false2 loop dan menguji elemen array

var arrObject = new Array();_3

Perhatikan bahwa penghitung indeks, alert(arrLiteral); // prints out val1,34,true,val2,18,false_3, bertambah karena digunakan untuk mengakses elemen larik. Penggunaan alert(arrLiteral); // prints out val1,34,true,val2,18,false_4 berarti bahwa nilai alert(arrLiteral); // prints out val1,34,true,val2,18,false3 yang ada diakses terlebih dahulu, kemudian variabelnya bertambah

5. 2.  Membuat Array Multidimensi

Anda ingin membuat array multidimensi (array array)

Buat array di mana setiap elemen juga merupakan array. Misalnya, untuk membuat larik dengan tiga elemen, yang masing-masing juga merupakan larik dari tiga elemen yang masing-masing berisi string, angka, dan literal larik, gunakan cuplikan kode di

Contoh 5-1.  Membuat larik multidimensi

var arrObject = new Array();_4

Array multidimensi dalam JavaScript dikelola dengan membuat array baru sebagai elemen di dalam array yang sudah ada. Array baru dapat dibuat sebagai elemen var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_3, atau sebagai literal array

Di , sebuah array, alert(arrLiteral); // prints out val1,34,true,val2,18,false_7, dibuat sebagai objek var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3 dengan tiga anggota. Masing-masing dari ketiga elemen tersebut juga dibuat sebagai var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3 objek dengan tiga anggota. Data larik kemudian diatur, dengan anggota larik pertama berisi literal string, yang kedua berisi literal angka, dan literal larik ketigaâitu sendiri berisi dua anggota larik, masing-masing dengan literal string

Untuk mengakses elemen array, gunakan notasi braket persegi, dengan setiap set tanda kurung digunakan untuk mengalamatkan setiap level array. Dalam kode berikut, isi larik dicetak melalui jendela peringatan, setelah diubah menjadi string terlebih dahulu, jika perlu

var arrObject = new Array();_5

Array multidimensi biasanya digunakan untuk menyimpan data dari struktur tabel, tetapi bagaimana struktur dipertahankan tergantung pada pengembang. Misalnya, pengembang dapat mendukung struktur array di mana indeks terluar mencerminkan kolom, dan indeks terdalam mencerminkan baris. Sebagai contoh, tunjukkan tabel lima kolom, tiga baris sederhana yang berisi sekumpulan angka

Tabel 5-1.  Tabel sederhana dengan lima kolom dan tiga baris serta data sampel

45. 89

4

34

9998. 99

56

3

23

99

43

2

1

1

0

43

67

Untuk membuatnya dalam JavaScript menggunakan array multidimensi, gunakan kode berikut

var arrObject = new Array();_6

Tentu saja, ini tidak memperhitungkan header kolom dan baris. Untuk menambahkan header, perlakukan saja sebagai data array, pastikan untuk memasukkannya ke tempat yang tepat dalam array untuk mencerminkan struktur tabel

Catatan

Dalam lingkungan multipengembang, sangat penting adanya kesepakatan di antara pengembang tentang apakah data struktur tabel disimpan berpusat pada kolom atau berpusat pada baris

5. 3.  Membuat String dari Array

Anda ingin membuat satu string dari array

Gunakan metode var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_3 bawaan objek ________12______1 untuk menggabungkan elemen array menjadi string

var arrObject = new Array();_7

Metode var arrObject = new Array(); arrObject[0] = "cat"; // array now has one element alert(arrObject[0]); // prints cat_2 mengambil satu parameter opsional, pembatas yang digunakan untuk memisahkan string saat digabungkanâdalam hal ini, tanda hubung (var arrObject = new Array(); arrObject[0] = "cat"; // array now has one element alert(arrObject[0]); // prints cat3). Ini mengembalikan string dengan semua elemen array digabungkan. Jika array berisi apa pun selain string, nilainya diubah menjadi string yang setara

var arrObject = new Array();_8

Jika parameter pembatas tidak disediakan, koma akan disisipkan di antara nilai elemen larik secara default

var arrObject = new Array();_9

Anda ingin mengurutkan array

Gunakan metode var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_3 objek var arrObject = new Array(); arrObject[0] = "cat"; // array now has one element alert(arrObject[0]); // prints cat5

var arrObject = new Array("val1","val2");0

Metode var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3 objek var arrObject = new Array(); arrObject[0] = "cat"; // array now has one element alert(arrObject[0]); // prints cat5 mengurutkan elemen array menurut abjad jika tidak ada parameter fungsi pembanding opsional yang disediakan. Untuk memfasilitasi pengurutan, semua tipe data dikonversi ke string yang setara sebelum pengurutan

var arrObject = new Array("val1","val2");1

Meskipun anggota larik dalam contoh ini adalah angka, mereka diurutkan dalam urutan leksikografis (kamus), bukan angka. Untuk melakukan pengurutan numerik yang sebenarnya, gunakan fungsi pengurutan khusus

var arrObject = new Array("val1","val2");2

Fungsi mengurangi nilai parameter kedua dari yang pertama, dan jika yang pertama kurang dari yang kedua, nilai negatif dikembalikan; . Jika nilai pengembalian kurang dari nol, indeks pengurutan untuk parameter kedua diatur lebih tinggi dari parameter pertama. Jika nilainya lebih besar dari nol, indeks pengurutan untuk parameter pertama disetel lebih tinggi dari yang lain. Jika nilainya tepat nol, indeks pengurutan untuk keduanya tidak berubah

Jika elemen array berisi string yang dapat diubah menjadi angka, maka fungsi pengurutan ________12______8 masih berfungsi, karena konversi angka bersifat otomatis

var arrObject = new Array("val1","val2");_3

Metode var arrObject = new Array(); arrObject[0] = "cat"; // array now has one element alert(arrObject[0]); // prints cat_5 mengurutkan elemen dalam urutan menaik. Jika Anda ingin melakukan pengurutan terbalik, gunakan metode var arrObject = new Array(); arrObject[0] = "cat"; // array now has one element alert(arrObject[0]); // prints cat5 untuk mengurutkan elemen, lalu gunakan metode var farmAnimals = new Array("cat","dog","horse","pig"); alert(farmAnimals[0]); // print cat alert(farmAnimals[3]); // print pig1 untuk membalikkan urutan anggota array

var arrObject = new Array("val1","val2");_4

5. 5.  Simpan dan Akses Nilai dalam Urutan

Anda ingin menyimpan nilai sedemikian rupa sehingga Anda dapat mengakses nilai dalam urutan penyimpanannya

Untuk menyimpan dan mengakses nilai dalam urutan penerimaannya, buat antrean FIFO (masuk pertama, keluar pertama). Gunakan metode JavaScript var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3 objek var farmAnimals = new Array("cat","dog","horse","pig"); alert(farmAnimals[0]); // print cat alert(farmAnimals[3]); // print pig3 untuk menambahkan item ke antrean, dan var farmAnimals = new Array("cat","dog","horse","pig"); alert(farmAnimals[0]); // print cat alert(farmAnimals[3]); // print pig4 untuk mengambil

var arrObject = new Array("val1","val2");5

Antrian adalah larik elemen yang ditambahkan satu per satu, dan diambil dalam urutan masuk pertama, keluar pertama (FIFO). Pikirkan antrean di bank. orang pergi ke ujung ketika mereka tiba di bank, dan teller membantu mereka yang berada di garis depan, yang paling lama berada di sana

Anda dapat meniru perilaku ini menggunakan variabel penghitung untuk menyimpan indeks item terakhir yang ditambahkan (akhir), dan indeks item terakhir diambil (dari depan), tetapi untungnya, objek JavaScript var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3 menyediakan metode yang menangani informasi ini untuk

Metode var farmAnimals = new Array("cat","dog","horse","pig"); alert(farmAnimals[0]); // print cat alert(farmAnimals[3]); // print pig_6 membuat elemen array baru dan menambahkannya ke akhir array

var arrObject = new Array("val1","val2");_6

Jumlah elemen array bertambah dengan setiap elemen yang didorong

Metode var farmAnimals = new Array("cat","dog","horse","pig"); alert(farmAnimals[0]); // print cat alert(farmAnimals[3]); // print pig_7 mengekstrak elemen array dari depan array, menghapusnya dari array, dan mengembalikan elemen

var arrObject = new Array("val1","val2");_7

Jumlah elemen larik berkurang satu dengan setiap elemen yang digeser, karena var farmAnimals = new Array("cat","dog","horse","pig"); alert(farmAnimals[0]); // print cat alert(farmAnimals[3]); // print pig4 juga memodifikasi larik selain mengembalikan item

5. 6.  Simpan dan Akses Nilai dalam Urutan Terbalik

Anda ingin menyimpan nilai sedemikian rupa sehingga Anda dapat mengakses nilai dalam urutan terbalik. mengakses nilai yang paling baru disimpan terlebih dahulu, lalu tumpukan LIFO (masuk terakhir, keluar pertama).

Untuk mengakses nilai yang disimpan dalam urutan terbalik (item terakhir yang ditambahkan diakses terlebih dahulu), buat tumpukan LIFO (last-in, first-out). Gunakan metode JavaScript var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3 objek var farmAnimals = new Array("cat","dog","horse","pig"); alert(farmAnimals[0]); // print cat alert(farmAnimals[3]); // print pig3 untuk menambahkan item ke tumpukan, dan metode var arrObject = new Array();01 untuk mengambil

var arrObject = new Array("val1","val2");_8

Tumpukan adalah larik elemen, dengan setiap elemen baru ditambahkan ke bagian atas tumpukan, dan diambil dalam urutan masuk terakhir, keluar pertama (LIFO). Pikirkan setumpuk piring. Anda menambahkan piring ke atas saat dicuci, dan mengambilnya dari atas saat diperlukan. Anda bisa menggunakan variabel yang menyimpan bilangan bulat yang melacak akhir array setelah setiap penambahan dan pengambilan, tetapi JavaScript menyediakan fungsionalitas yang kita butuhkan

Metode var farmAnimals = new Array("cat","dog","horse","pig"); alert(farmAnimals[0]); // print cat alert(farmAnimals[3]); // print pig_6 membuat elemen array baru dan menambahkannya ke akhir array

var arrObject = new Array("val1","val2");_6

Jumlah elemen array bertambah dengan setiap elemen yang didorong

Metode var arrObject = new Array();03 mengekstrak elemen array dari akhir array, menghapusnya dari array, dan mengembalikan elemen tersebut

var arrLiteral = ["val1","val2","val3"];_0

Jumlah elemen array berkurang satu dengan setiap elemen yang muncul, karena var arrObject = new Array();01 memodifikasi array

5. 7.  Buat Larik Baru sebagai Subset dari Larik yang Ada

Anda ingin membuat larik baru dari segmen larik yang sudah ada. Jika elemen array adalah objek, Anda ingin agar kedua array tetap sinkron

Gunakan metode var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_3 objek var arrObject = new Array();06 untuk membuat larik baru berdasarkan elemen dalam rentang tertentu

var arrLiteral = ["val1","val2","val3"];_1

Metode var arrObject = new Array();07 adalah cara sederhana untuk membangun array baru dari urutan elemen yang berurutan dalam array lain. Parameternya adalah indeks awal dan akhir untuk urutan elemen yang akan disalin. Nilai negatif untuk salah satu indeks menunjukkan bahwa var arrObject = new Array();_06 harus bekerja dari akhir array

Jika elemen yang disalin adalah nilai literal, seperti string, angka, dan Boolean, elemen tersebut akan disalin berdasarkan nilaiâmengubah nilai di larik lama tidak berdampak pada nilai yang sama di larik baru, dan sebaliknya

Namun, ketika objek disalin, mereka akan disalin dengan referensi, apakah mereka disalin melalui var arrObject = new Array();06 atau dengan penugasan variabel langsung

var arrLiteral = ["val1","val2","val3"];_2

Kode berikut menunjukkan sinkronisasi objek saat digunakan dengan slice. Bagian dari satu larik digunakan untuk membuat larik baru dengan var arrObject = new Array();06. Elemen dalam larik pertama adalah var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3 objek. Dalam kode, ketika nilai salah satu objek dalam larik pertama diubah, perubahan tersebut tercermin dalam larik baru. Sebaliknya, ketika suatu nilai diubah dalam larik baru, perubahan tersebut tercermin dalam larik asli

var arrLiteral = ["val1","val2","val3"];_3

Kegunaan praktis lainnya untuk var arrObject = new Array();06 adalah mengubah properti argumen fungsi menjadi larik yang tepat

var arrLiteral = ["val1","val2","val3"];_4

Menggunakan var arrObject = new Array();_06 untuk membuat subset array adalah cara cepat menyalin subset array dan, jika nilainya adalah objek, pastikan kedua array sinkron. Perlu diketahui, bahwa IE8 tidak mendukung var arrObject = new Array();06

5. 8.  Menelusuri Larik

Anda ingin mencari array untuk nilai tertentu dan mendapatkan indeks elemen array jika ditemukan

Gunakan metode objek baru (ECMAScript 5) ________1______3 var arrObject = new Array();16 dan var arrObject = new Array();17

var arrLiteral = ["val1","val2","val3"];_5

Meskipun dukungan untuk var arrObject = new Array();16 dan var arrObject = new Array();17 telah ada di browser untuk beberapa waktu, itu hanya diformalkan dengan rilis ECMAScript 5. Kedua metode mengambil nilai pencarian, yang kemudian dibandingkan dengan setiap elemen dalam larik. Jika nilainya ditemukan, keduanya mengembalikan indeks yang mewakili elemen array. Jika nilainya tidak ditemukan, â1 dikembalikan. Metode var arrObject = new Array();16 mengembalikan yang pertama ditemukan, var arrObject = new Array();17 mengembalikan yang terakhir ditemukan

var arrLiteral = ["val1","val2","val3"];_6

Kedua metode dapat mengambil indeks awal, pengaturan di mana pencarian akan dimulai

var arrLiteral = ["val1","val2","val3"];_7

Saat ini, semua browser target buku mendukung var arrObject = new Array();16 dan var arrObject = new Array();17, kecuali IE8

Seperti yang disebutkan, tidak semua browser mendukung var arrObject = new Array();_24 dan var arrObject = new Array();17. Metode lintas-peramban untuk mengimplementasikan fungsionalitas serupa di peramban ini diberikan dalam dokumentasi Mozilla, di https. // pengembang. mozilla. org/en/Core_JavaScript_1. 5_Referensi/Global_Objects/Array/indexOf. Karena IE8 tidak mendukung var arrObject = new Array();16, inilah solusi Mozilla untuk fungsi tersebut

var arrLiteral = ["val1","val2","val3"];_8

5. 9.  Perataan Array Multidimensi

Anda ingin meratakan array multidimensi menjadi array satu dimensi

Gunakan metode var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_3 objek var arrObject = new Array();28 untuk menggabungkan dimensi array menjadi array dimensi tunggal

var arrLiteral = ["val1","val2","val3"];_9

Metode var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3 var arrObject = new Array();28 mengambil satu atau lebih array, dan menambahkan elemen array ke akhir konten array induk tempat metode itu dipanggil. Array yang digabungkan kemudian dikembalikan sebagai array baru

Salah satu penggunaan untuk jenis fungsionalitas ini adalah mengembalikan larik satu dimensi yang terdiri dari elemen-elemen dari larik multidimensi, seperti yang ditunjukkan pada solusi

5. 10.  Telusuri dan Hapus atau Ganti Elemen Larik

Anda ingin menemukan kejadian dari nilai yang diberikan dalam array, dan menghapus elemen atau menggantinya dengan nilai lain

Gunakan metode var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_3 var arrObject = new Array();16 dan var arrObject = new Array();33 untuk menemukan dan menghapus/mengganti elemen array

someFunction("param1", ["val1","val2"]);0

Metode var arrObject = new Array();33 membutuhkan tiga parameter. Parameter pertama diperlukan; . Dua parameter lainnya adalah opsional. jumlah elemen yang akan dihapus, dan penggantinya. Jika indeksnya negatif, elemen akan disambung dari akhir, bukan dari awal array

someFunction("param1", ["val1","val2"]);1

Jika jumlah elemen yang akan disambung tidak disediakan, semua elemen dari indeks hingga akhir akan dihapus

someFunction("param1", ["val1","val2"]);2

Parameter terakhir, nilai yang diganti, dapat berupa sekumpulan nilai pengganti, dipisahkan dengan koma

someFunction("param1", ["val1","val2"]);3

Menghapus atau mengganti satu elemen itu praktis, tetapi bisa menghapus atau mengganti semua contoh elemen tertentu bahkan lebih mudah. Di , sebuah array dibuat dengan beberapa elemen, termasuk beberapa instance dari nilai tertentu. Metode var arrObject = new Array();33 kemudian digunakan dalam satu lingkaran untuk mengganti semua elemen dengan satu nilai ini dengan elemen dengan nilai baru. Metode var arrObject = new Array();33 digunakan lagi, dalam loop terpisah, untuk menghapus elemen yang baru disambung

Contoh 5-2.  Menggunakan perulangan dan penyambungan untuk mengganti dan menghapus elemen

someFunction("param1", ["val1","val2"]);4

Contoh bekerja dengan semua browser target buku ini kecuali untuk IE8, yang saat ini tidak mendukung var arrObject = new Array();16 atau var arrObject = new Array();33

5. 11.  Menerapkan Fungsi Terhadap Setiap Elemen Array

Anda ingin menggunakan fungsi untuk memeriksa nilai larik, dan menggantinya jika sesuai dengan kriteria yang diberikan

Gunakan objek ECMAScript 5 var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3 baru var arrObject = new Array();40 untuk melampirkan fungsi callback ke setiap elemen array

someFunction("param1", ["val1","val2"]);5

Pada bagian terakhir, kami menggunakan alert(arrLiteral); // prints out val1,34,true,val2,18,false_2 loop untuk melintasi array untuk menemukan dan mengganti nilai, tetapi seberapa jauh lebih membantu menggunakan metode var arrObject = new Array();40?

Metode var arrObject = new Array();40 mengambil satu parameter, fungsi. Fungsi itu sendiri memiliki tiga parameter. elemen array, indeks elemen, dan array. Ketiganya digunakan dalam fungsi, var arrObject = new Array();_44

Pertama, nilai elemen diuji untuk melihat apakah cocok dengan string yang diberikan, var arrObject = new Array();45. Jika cocok, indeks elemen larik digunakan untuk mengubah nilai elemen larik dengan string pengganti, var arrObject = new Array();46

Catatan

Jangan kembalikan nilai dari fungsi yang diteruskan ke metode var arrObject = new Array();40, karena nilainya akan dibuang

Chrome, Firefox, Opera, dan Safari mendukung var arrObject = new Array();40, tetapi IE8 tidak

Konsep fungsi callback dibahas lebih detail di Bab 6

Sebagian besar browser modern mendukung var arrObject = new Array();_40. Namun, bagi yang tidak, Anda dapat meniru perilaku var arrObject = new Array();40 menggunakan properti var arrObject = new Array();51. Mozilla memberikan deskripsi tentang cara meniru var arrObject = new Array();40 di https. // pengembang. mozilla. org/en/Core_JavaScript_1. 5_Reference/Global_Objects/Array/forEach. Untuk kelengkapan, saya sudah menggandakan kode di bawah ini. Untuk menggunakannya, tambahkan kode ke dalam fungsi pustaka dan pastikan kode diproses sebelum metode var arrObject = new Array();40 diperlukan

someFunction("param1", ["val1","val2"]);6

5. 12.  Menerapkan Fungsi ke Setiap Elemen dalam Array dan Mengembalikan Array Baru

Anda ingin mengonversi larik angka desimal menjadi larik baru dengan ekuivalen heksadesimalnya

Gunakan metode var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3 objek var arrObject = new Array();55 untuk membuat array baru yang terdiri dari elemen-elemen dari array lama yang telah dimodifikasi melalui fungsi panggilan balik yang diteruskan ke metode var arrObject = new Array();55

someFunction("param1", ["val1","val2"]);7

Seperti metode var arrObject = new Array();_40 di , metode ECMAScript 5 var arrObject = new Array();55 memungkinkan kita untuk melampirkan fungsi callback yang diterapkan ke setiap elemen array. Tidak seperti var arrObject = new Array();_40, metode var arrObject = new Array();55 menghasilkan array baru daripada memodifikasi array asli. Oleh karena itu, Anda tidak akan mengembalikan nilai saat menggunakan var arrObject = new Array();40, tetapi Anda harus mengembalikan nilai saat menggunakan var arrObject = new Array();55

Fungsi yang diteruskan ke metode peta memiliki tiga parameter. elemen array saat ini, indeks untuk elemen array, dan array. Metode var arrObject = new Array();40 dan var arrObject = new Array();55 saat ini tidak didukung oleh IE8

Sebagian besar browser modern mendukung metode var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_3 objek var arrObject = new Array();55, tetapi untuk memastikan bahwa fungsionalitas tersebut ada, Anda dapat menggunakan properti var arrObject = new Array();51 untuk meniru perilaku metode. Lihat caranya di situs web Mozilla

Untuk kelengkapan, saya telah menyertakan kode untuk solusinya di bawah ini. Untuk menggunakannya, sertakan kode dalam fungsi pustaka yang diproses sebelum metode var arrObject = new Array();55 diperlukan

someFunction("param1", ["val1","val2"]);_8

5. 13.  Membuat Array yang Difilter

Anda ingin memfilter nilai elemen dalam larik dan menetapkan hasilnya ke larik baru

Gunakan metode var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_3 objek var arrObject = new Array();70

someFunction("param1", ["val1","val2"]);_9

Metode var arrObject = new Array();70 adalah tambahan ECMAScript 5 lainnya, seperti var arrObject = new Array();40 dan var arrObject = new Array();55, masing-masing tercakup dalam Resep dan . Seperti mereka, metode ini adalah cara menerapkan fungsi callback ke setiap elemen array

Fungsi yang diteruskan sebagai parameter ke metode var arrObject = new Array();_70 mengembalikan nilai Boolean, benar atau salah, berdasarkan beberapa pengujian terhadap elemen array. Nilai yang dikembalikan ini menentukan apakah elemen array ditambahkan ke array baru. itu ditambahkan jika fungsi mengembalikan true; . Dalam solusinya, string karakter âvar arrObject = new Array();46â difilter dari larik asli saat larik baru dibuat

Fungsi tersebut memiliki tiga parameter. elemen array, indeks untuk elemen, dan array itu sendiri. Metode var arrObject = new Array();70 tidak didukung oleh IE8

Dukungan untuk var arrObject = new Array();_70 cukup luas, tetapi untuk memastikan akses ke fungsionalitas, ada cara untuk meniru metode filter menggunakan var arrObject = new Array();51. Mozilla merinci pendekatannya di https. // pengembang. mozilla. org/en/Core_JavaScript_1. 5_Reference/Global_Objects/Array/filter, tapi saya sudah menyalin teknik di bawah ini. Untuk menggunakan, sertakan fungsi dalam kode Anda, dan jalankan fungsi sebelum Anda perlu mengakses metode var arrObject = new Array();70

function chgArray(arr) { arr[0] = "surprise!"; } var newArray = new Array("val1", "val2"); var newLiteral = ["val1","val2"]; chgArray(newArray); chgArray(newLiteral); alert(newArray); // prints surprise!,val2 alert(newLiteral); // prints surprise!,val2_0

5. 14.  Memvalidasi Konten Larik

Anda ingin memastikan bahwa sebuah array memenuhi kriteria tertentu

Gunakan metode var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_3 objek var arrObject = new Array();81 untuk memeriksa bahwa setiap elemen melewati kriteria yang diberikan. Misalnya, kode berikut memeriksa untuk memastikan bahwa setiap elemen dalam larik adalah karakter alfanumerik

function chgArray(arr) { arr[0] = "surprise!"; } var newArray = new Array("val1", "val2"); var newLiteral = ["val1","val2"]; chgArray(newArray); chgArray(newLiteral); alert(newArray); // prints surprise!,val2 alert(newLiteral); // prints surprise!,val2_1

Atau gunakan metode var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_3 objek var arrObject = new Array();83 untuk memastikan bahwa setidaknya beberapa elemen lolos kriteria. Sebagai contoh, kode berikut memeriksa untuk memastikan bahwa setidaknya beberapa elemen array adalah string alfanumerik

function chgArray(arr) { arr[0] = "surprise!"; } var newArray = new Array("val1", "val2"); var newLiteral = ["val1","val2"]; chgArray(newArray); chgArray(newLiteral); alert(newArray); // prints surprise!,val2 alert(newLiteral); // prints surprise!,val2_2

Metode objek var arrObject = new Array();81 dan var arrObject = new Array();85 adalah metode terakhir dari ECMAScript 5 var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3 yang akan saya bahas dalam buku ini. Berbeda dengan metode fungsi panggilan balik var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_3 yang saya bahas dalam resep sebelumnya di bab ini, fungsi var arrObject = new Array();81 dan var arrObject = new Array();83 tidak bekerja terhadap semua elemen array;

Solusinya menunjukkan bahwa fungsi panggilan balik yang sama dapat digunakan untuk metode objek var arrObject = new Array();81 dan var arrObject = new Array();85. Perbedaannya adalah saat menggunakan metode var arrObject = new Array();_81, segera setelah fungsi mengembalikan nilai salah, pemrosesan selesai, dan metode mengembalikan salah. Namun, metode ________4______83 akan terus menguji setiap elemen array hingga fungsi callback mengembalikan nilai true. Pada saat itu, tidak ada elemen lain yang divalidasi, dan metode mengembalikan nilai true. Namun, jika fungsi panggilan balik menguji semua elemen, dan tidak mengembalikan nilai benar pada titik mana pun, metode var arrObject = new Array();83 mengembalikan nilai salah

Metode mana yang digunakan tergantung pada kebutuhan Anda. Jika semua elemen array harus memenuhi kriteria tertentu, maka gunakan var arrObject = new Array();81;

Fungsi callback mengambil tiga parameter. elemen, indeks untuk elemen, dan array. Metode var arrObject = new Array();_83 atau var arrObject = new Array();81 tidak didukung oleh IE8, tetapi didukung oleh browser target lain untuk buku ini

Sebagian besar browser modern mendukung var arrObject = new Array();81 dan var arrObject = new Array();83, tetapi untuk browser yang tidak mendukung (seperti sebagian besar versi Internet Explorer), Anda dapat meniru perilaku menggunakan var arrObject = new Array();51. Mozilla membahas cara melakukan ini di https. // pengembang. mozilla. org/en/Core_JavaScript_1. 5_Reference/Global_Objects/Array/beberapa dan https. // pengembang. mozilla. org/en/Core_JavaScript_1. 5_Reference/Global_Objects/Array/every

Untuk kelengkapan, saya juga menyertakan fungsionalitas di bawah ini. Untuk menggunakan, pastikan skrip yang disediakan diproses sebelum metode diperlukan

Inilah cara meniru var arrObject = new Array();83

function chgArray(arr) { arr[0] = "surprise!"; } var newArray = new Array("val1", "val2"); var newLiteral = ["val1","val2"]; chgArray(newArray); chgArray(newLiteral); alert(newArray); // prints surprise!,val2 alert(newLiteral); // prints surprise!,val2_3

Inilah cara meniru var arrObject = new Array();81

function chgArray(arr) { arr[0] = "surprise!"; } var newArray = new Array("val1", "val2"); var newLiteral = ["val1","val2"]; chgArray(newArray); chgArray(newLiteral); alert(newArray); // prints surprise!,val2 alert(newLiteral); // prints surprise!,val2_4

5. 15.  Menggunakan Larik Asosiatif untuk Menyimpan Nama dan Nilai Elemen Formulir

Anda ingin menyimpan nama dan nilai elemen formulir, untuk tujuan validasi nanti

Gunakan array asosiatif untuk menyimpan elemen, menggunakan pengidentifikasi elemen sebagai indeks array

function chgArray(arr) { arr[0] = "surprise!"; } var newArray = new Array("val1", "val2"); var newLiteral = ["val1","val2"]; chgArray(newArray); chgArray(newLiteral); alert(newArray); // prints surprise!,val2 alert(newLiteral); // prints surprise!,val2_5

Ulangi array menggunakan pernyataan var arrObject = new Array("val1","val2");_04

function chgArray(arr) { arr[0] = "surprise!"; } var newArray = new Array("val1", "val2"); var newLiteral = ["val1","val2"]; chgArray(newArray); chgArray(newLiteral); alert(newArray); // prints surprise!,val2 alert(newLiteral); // prints surprise!,val2_6

Sebagian besar larik JavaScript menggunakan indeks numerik, seperti berikut ini

function chgArray(arr) { arr[0] = "surprise!"; } var newArray = new Array("val1", "val2"); var newLiteral = ["val1","val2"]; chgArray(newArray); chgArray(newLiteral); alert(newArray); // prints surprise!,val2 alert(newLiteral); // prints surprise!,val2_7

Namun, Anda dapat membuat larik asosiatif dalam JavaScript, di mana indeks larik dapat berupa string yang mewakili kata kunci, memetakan string tersebut ke nilai yang diberikan. Dalam solusinya, indeks array adalah pengidentifikasi yang diberikan elemen array, dan nilai array yang sebenarnya adalah nilai elemen bentuk

Anda dapat membuat larik asosiatif, tetapi Anda tidak menggunakan objek var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3 untuk melakukannya. Menggunakan objek var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_3 berisiko dan secara aktif tidak disarankanâterutama jika Anda menggunakan salah satu pustaka bawaan yang menggunakan atribut var arrObject = new Array("val1","val2");07 untuk memperluas objek, seperti yang ditemukan orang saat Prototipe populer. library js pertama kali dirilis beberapa tahun yang lalu

Prototipe sebelumnya. Pustaka js membuat asumsi bahwa sebagian besar penggunaan larik dalam JavaScript berbasis indeks numerik, seperti sebagian besar contoh sebelumnya dalam bab ini. Pustaka memperluas fungsionalitas objek var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3 melalui var arrObject = new Array();51, berdasarkan asumsi ini. Tetapi memperluas var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_3 objek dengan cara ini merusak fungsionalitas loop var arrObject = new Array("val1","val2");04 yang digunakan untuk melintasi array asosiatif yang dibuat dari objek var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3

Ini bukan Prototipe itu. js adalah JavaScript yang âmelanggarâ. Putaran var arrObject = new Array("val1","val2");_04 dimaksudkan untuk satu tujuan. mengulangi properti objek, seperti mampu mengulang melalui properti objek var arrObject = new Array("val1","val2");14, atau properti objek kustom Anda sendiri

Saat kita menggunakan objek var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3 untuk membuat larik asosiatif, yang sebenarnya kita lakukan adalah menambahkan properti baru ke objek larik, daripada menambahkan elemen larik baru. Anda sebenarnya bisa membuat array asosiatif dengan var arrObject = new Array("val1","val2");16 atau var arrObject = new Array("val1","val2");14, serta var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3. Alasannya adalah bahwa objek JavaScript adalah array asosiatif. Saat Anda menambahkan array baru, var arrObject = new Array("val1","val2");19

function chgArray(arr) { arr[0] = "surprise!"; } var newArray = new Array("val1", "val2"); var newLiteral = ["val1","val2"]; chgArray(newArray); chgArray(newLiteral); alert(newArray); // prints surprise!,val2 alert(newLiteral); // prints surprise!,val2_8

yang sebenarnya Anda lakukan adalah menambahkan properti objek baru

function chgArray(arr) { arr[0] = "surprise!"; } var newArray = new Array("val1", "val2"); var newLiteral = ["val1","val2"]; chgArray(newArray); chgArray(newLiteral); alert(newArray); // prints surprise!,val2 alert(newLiteral); // prints surprise!,val2_9

Untuk mendemonstrasikan lebih lanjut betapa berbedanya larik asosiatif dari larik berbasis numerik, saat Anda menggunakan var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3 untuk membuat larik asosiatif, Anda tidak dapat mengakses larik âelemenâ dengan indeks, dan properti panjang mengembalikan nol

Alih-alih menggunakan objek var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_3 untuk membuat array asosiatif, gunakan JavaScript var arrObject = new Array("val1","val2");22 secara langsung. Anda mendapatkan fungsionalitas yang persis sama, tetapi hindari bentrok dengan perpustakaan yang memperluas objek basis var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean3 menggunakan var arrObject = new Array("val1","val2");07

menampilkan halaman web. Di sini, saat formulir dikirimkan, semua elemen formulir dari teks bertipe diakses dan disimpan dalam array asosiatif. ID elemen digunakan sebagai kata kunci larik, dan nilai ditetapkan ke elemen larik. Setelah dikumpulkan, array asosiatif diteruskan ke fungsi lain yang dapat digunakan untuk memvalidasi nilai, tetapi dalam kasus ini hanya membuat string pasangan kata kunci/nilai, yang kemudian ditampilkan

Contoh 5-3.  Mendemonstrasikan larik asosiatif dengan elemen formulir

var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_0

Dalam contoh, perhatikan bahwa indeks array dibentuk oleh elemen formâs var arrObject = new Array("val1","val2");25. Saat array dilintasi, sintaks loop ________1______9 yang digunakan adalah

var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_1

Sintaks ini mengakses indeks array, yang kemudian ditetapkan ke variabel kata kunci yang dapat digunakan untuk mengakses nilai array

var arrObject = new Array("val1", 34, true); // string, number, boolean var arrLiteral = [arrObject, "val2", 18, false); // object, string, number, boolean_2

menunjukkan contoh setelah nilai diketik ke dalam bidang formulir dan formulir dikirimkan

Gambar  5-1.  Demonstrasi larik asosiatif dan melintasi elemen formulir

Jenis pasangan kata kunci/nilai ini biasanya disebut sebagai peta hash atau tabel hash, meskipun fungsi JavaScript bukanlah fungsi peta hash yang sebenarnya. Alasan mengapa ini bukan peta hash yang sebenarnya adalah karena tidak memperhitungkan fakta bahwa kata kunci yang sama dapat digunakan dengan banyak nilai, dan versi JavaScript hanya menerima string sebagai kata kunci

Apa yang bisa kita gunakan sebagai pengganti for loop di JavaScript?

Apakah forEach sama dengan untuk loop JavaScript?

Apakah forEach lebih baik daripada JavaScript loop?

Bagaimana Anda melakukan forEach loop di JavaScript?