Rumah > hujung hadapan web > tutorial js > Array JavaScript: Cara Membuat dan Memanipulasi

Array JavaScript: Cara Membuat dan Memanipulasi

Jennifer Aniston
Lepaskan: 2025-02-18 10:50:10
asal
573 orang telah melayarinya

array JavaScript yang mendalam dan mudah difahami: Penjelasan terperinci Penciptaan dan Operasi

JavaScript Arrays: How to Create and Manipulate

mata teras

    Array JavaScript mempunyai atribut
  • , boleh dikendalikan, dan mempunyai atribut bernombor dengan julat nama antara 0 dan 4294967294 (termasuk). JavaScript tidak menyokong susunan bersekutu. length
  • tatasusunan JavaScript dicipta dalam pelbagai cara, dan disyorkan untuk menggunakan literasi array untuk membuat array baru. Arahan boleh intensif (panjang sama dengan bilangan atribut bernombor) atau jarang (panjang lebih besar daripada bilangan atribut bernombor).
  • Panjang pelbagai JavaScript boleh diubah. Jika panjang baru ditetapkan kurang daripada panjang semasa, sebarang atribut bernombor dalam array yang diposisikan lebih besar daripada panjang baru akan dikeluarkan.
  • JavaScript menyediakan kaedah untuk menambah, membuang, dan menggantikan entri dalam array. Kaedah untuk menambah penyertaan termasuk
  • , push dan unshift; splice pop shift Ketahui cara memanipulasi tatasusunan JavaScript. Kami akan merangkumi proses penciptaan array, menukar panjang array, dan menambah, mengeluarkan, dan menggantikan penyertaan. Atribut splice objek adalah harta yang banyak pemula dalam JavaScript tidak faham. Ramai orang tersilap percaya bahawa
  • memberitahu anda dengan tepat berapa banyak penyertaan yang ada dalam array, dan ini hanya berlaku untuk beberapa tatasusunan. Sesetengah pemula tidak menyedari bahawa
adalah harta yang boleh ditulis dari array. Untuk menjelaskan bagaimana atribut

berfungsi, mari kita lihat apa yang berlaku apabila kita mengubah nilainya atau menjalankan operasi yang juga menyebabkan perubahan panjang. Mari mulakan dari awal. Arus JavaScript mempunyai atribut bernama Array dan boleh diberi pilihan atribut bernombor yang namanya antara 0 dan 4294967294 (termasuk). Ia juga mempunyai beberapa kaedah untuk memanipulasi sifat, beberapa di antaranya kita akan melihat ketika memeriksa bagaimana sifat length berfungsi. Perhatikan bahawa JavaScript tidak menyokong array bersekutu, jadi semasa anda boleh menambah sifat bernama pada array, mereka tidak menjadi sebahagian daripada array dan akan diabaikan oleh semua kaedah array. Mereka juga tidak menjejaskan panjang. Untuk menjadikannya lebih mudah untuk menunjukkan apa yang berlaku kepada Array Properties apabila bekerja dengan pelbagai kenyataan, kami akan menjalankan fungsi berikut selepas setiap kod. Ini merekodkan panjang array dan semua sifat bernombor ke konsol penyemak imbas. length length length length Artikel ini dikaji semula oleh Chris Perry dan Marcello La Rocca. Terima kasih kepada semua pengulas rakan sebaya SitePoint untuk membuat kandungan SitePoint Perfect! length

var test = function(array) {
  console.log('length:'+ array.length);
  array.forEach(function(element, index, array) {
    console.log(index + ':' + element);
  });
};
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Buat array di JavaScript

kita akan melihat cara yang berbeza untuk membuat tatasusunan dalam JavaScript. Arahan yang dibuat oleh dua contoh pertama hanya ditetapkan panjang dan tidak mempunyai entri bernombor sama sekali. Dua contoh terakhir membuat entri bernombor dari 0 hingga minus panjang 1. Arahan dengan panjang yang lebih besar daripada atribut bernombor dipanggil array jarang, manakala array dengan panjang sama dengan atribut bernombor dipanggil array padat.

var test = function(array) {
  console.log('length:'+ array.length);
  array.forEach(function(element, index, array) {
    console.log(index + ':' + element);
  });
};
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Perhatikan bahawa apabila membuat array baru, notasi literal array lebih disukai (menentukan array baru dengan kurungan kosong).

// 创建一个没有编号条目的数组

var arr = new Array(5);
test(arr);
// length: 5

var arr = [];
arr.length = 5;
test(arr);
// length: 5
Salin selepas log masuk
Salin selepas log masuk

kaedah array yang mengendalikan atribut bernombor (dalam kes ini forEach) hanya akan mengendalikan atribut sedia ada. Jika anda gelung sebaliknya dengan for atau while, gelung juga cuba memproses sifat-sifat yang tidak wujud, dan array mengenal pasti entri yang tidak wujud sebagai undefined. Kod anda tidak akan dapat membezakan contoh terakhir di atas dari dua contoh pertama. Jika anda tidak pasti jika anda bekerja pada tatasusunan yang padat, anda harus sentiasa menggunakan kaedah array untuk memproses array.

Tukar panjang array JavaScript

Contoh berikut melihat apa yang berlaku jika kita menetapkan panjang baru untuk array yang lebih kecil daripada panjang semasa.

var arr = ['a', 'b', 'c', 'd', 'e'];
test(arr);
// length:5, 0:a, 1:b, 2:c, 3:d, 4:e

var arr = [undefined, undefined, undefined, undefined, undefined];
test(arr);
// length:5, 0:undefined, 1:undefined, 2:undefined, 3:undefined, 4:undefined
Salin selepas log masuk

Perhatikan bahawa apabila membuat array menggunakan notasi [], setiap entri terdiri daripada nilai yang diikuti oleh koma. Jika nilai ditinggalkan, tiada atribut dibuat untuk lokasi tersebut. Koma terakhir hanya boleh ditinggalkan apabila nilai disediakan untuk harta ini, jika tidak, panjang akan dikurangkan oleh satu.

Mengeluarkan penyertaan dari array JavaScript

JavaScript menyediakan tiga kaedah pop, shift dan splice untuk menghapuskan penyertaan dari array, dengan itu mengurangkan panjang array. Dalam setiap kes, nilai yang dikeluarkan (atau nilai) dikembalikan oleh panggilan.

var arr = ['a', 'b', 'c', 'd', 'e', 'f'];
test(arr);
// length:6, 0:a, 1:b, 2:c, 3:d, 4:e, 5:f

arr.length = 5;
test(arr);
// length:5, 0:a, 1:b, 2:c, 3:d, 4:e

var arr = ['a','b','c','d','e','f',,,];
test(arr);
// length:8, 0:a, 1:b, 2:c, 3:d, 4:e, 5:f

arr.length = 7;
test(arr);
// length:7, 0:a, 1:b, 2:c, 3:d, 4:e, 5:f
Salin selepas log masuk

bagaimana untuk menambah entri dalam array

kita boleh menambah entri baru ke array dengan hanya menyatakan di mana atribut bernombor belum wujud. Kami juga boleh menggunakan salah satu daripada tiga kaedah yang disediakan oleh JavaScript (push, unshift dan splice) untuk memasukkan penyertaan baru dan memindahkan entri lama jika perlu.

// pop() 从数组中移除最后一个元素
var arr = ['a','b','c','d','e','f'];
var el = arr.pop();
test(arr); // length:5, 0:a, 1:b, 2:c, 3:d, 4:e
console.log(el); // f

// shift() 从数组中移除第一个元素
var arr = ['a','b','c','d','e','f'];
var el = arr.shift();
test(arr); // length:5, 0:b, 1:c, 2:d, 3:e, 4:f
console.log(el); // a

// splice() 可以移除现有元素
var arr1 = ['a','b','c','d','e','f'];
var arr2 = arr1.splice(0,2); // 从索引0开始移除2个元素
test(arr1); // length:4, 0:c, 1:d, 2:e, 3:f
test(arr2); // length:2, 0:a, 1:b

var arr1 = ['a','b','c','d','e','f',,,'i'];
var arr2 = arr1.splice(6,2); // 从索引6开始移除2个元素
test(arr1); // length:7, 0:a, 1:b, 2:c, 3:d, 4:e, 5:f, 6:i
test(arr2); // length:2
Salin selepas log masuk

Gantikan entri dalam array JavaScript

Jika kita memberikan nilai baru kepada entri yang sedia ada, entri itu hanya akan mendapat nilai baru, dan seluruh array tidak akan terjejas. Begitu juga, dengan menggabungkan variasi kaedah splice() yang telah kita pelajari, kita boleh menggantikan entri sedia ada atau mengisi kekosongan dalam array.

var arr = ['a','b','c','d','e','f',,,'i'];
arr[11] = 'l';
test(arr);
// length:12, 0:a, 1:b, 2:c, 3:d, 5:f, 8:i, 11:l

// push() 将一个或多个元素添加到数组的末尾
var arr = ['a','b','c','d','e','f',,,,];
arr.push('j');
test(arr);
// length:10, 0:a, 1:b, 2:c, 3:d, 5:f, 9:j

// unshift() 将一个或多个元素添加到数组的开头
var arr = ['a','b','c','d','e','f',,,,];
arr.unshift('x');
test(arr);
// length:10, 0:x, 1:a, 2:b, 3:c, 4:d, 5:e, 6:f

arr1 = ['a','b','c','d','e','f',,,'i'];
arr2 = arr1.splice(6,0,'g','h'); // 从索引6移除0个元素,并插入'g'、'h'
test(arr1); // length:11, 0:a, 1:b, 2:c, 3:d, 5:f, 6:g, 7:h, 10:i
test(arr2); // length:0
Salin selepas log masuk

Kesimpulan

Contoh di atas harus memberi anda pemahaman yang lebih baik tentang bagaimana sifat -sifat length kerja array. Ini boleh menjadi lebih besar daripada atau sama dengan bilangan penyertaan dalam array. Jika sama, kita mempunyai pelbagai padat; Peranan tepat kaedah array tertentu mungkin bergantung kepada sama ada terdapat sifat dalam array jarang yang sepadan dengan kedudukan tertentu. Jika kita menukar panjang array, ia menghilangkan sebarang atribut bernombor dalam array yang kedudukannya lebih besar daripada panjang baru. Jika panjangnya sama dengan bilangan atribut bernombor, dan kami meningkatkan panjang, maka kami menukar array padat ke array jarang. Kaedah array yang memadam dan menambah atribut dalam array akan memindahkan penyertaan sedia ada jika perlu dan juga akan memelihara dan memindahkan sebarang jurang antara atribut.

Soalan Lazim Array JavaScript (Soalan Lazim)

Bagaimana untuk menambah elemen ke tatasusunan di JavaScript?

Dalam JavaScript, anda boleh menggunakan kaedah push() untuk menambah elemen ke array. Kaedah ini menambah item baru ke hujung array dan mengembalikan panjang baru. Berikut adalah contoh:

var test = function(array) {
  console.log('length:'+ array.length);
  array.forEach(function(element, index, array) {
    console.log(index + ':' + element);
  });
};
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Bagaimana untuk membuang elemen dari array JavaScript?

JavaScript menyediakan beberapa cara untuk menghapuskan elemen dari array. Kaedah pop() membuang elemen terakhir dari array dan mengembalikan elemen. Kaedah shift() membuang elemen pertama dari array dan mengembalikan elemen. Berikut adalah cara menggunakan kaedah ini:

// 创建一个没有编号条目的数组

var arr = new Array(5);
test(arr);
// length: 5

var arr = [];
arr.length = 5;
test(arr);
// length: 5
Salin selepas log masuk
Salin selepas log masuk

(kandungan FAQ berikutnya selaras dengan teks asal, ditinggalkan di sini untuk mengelakkan pertindihan)

Atas ialah kandungan terperinci Array JavaScript: Cara Membuat dan Memanipulasi. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan