Rumah >hujung hadapan web >tutorial js >Menguasai Pemusnahan dalam JavaScript: Permudahkan Tatasusunan dan Objek

Menguasai Pemusnahan dalam JavaScript: Permudahkan Tatasusunan dan Objek

Susan Sarandon
Susan Sarandonasal
2025-01-04 05:50:40144semak imbas

Mastering Destructuring in JavaScript: Simplify Arrays and Objects

Memusnahkan Tatasusunan dan Objek dalam JavaScript

Menyahstruktur ialah ciri yang mudah dan berkuasa dalam JavaScript yang diperkenalkan dalam ES6 yang membolehkan anda mengekstrak nilai daripada tatasusunan atau sifat daripada objek ke dalam pembolehubah yang berbeza. Ia memudahkan kod, menjadikannya lebih mudah dibaca dan ringkas.

1. Pemusnahan Tatasusunan

Dengan pemusnahan tatasusunan, anda boleh menetapkan nilai daripada tatasusunan kepada pembolehubah. Sintaksnya adalah mudah:

const arr = [1, 2, 3, 4];

// Destructuring the array
const [a, b, c] = arr;

console.log(a);  // Output: 1
console.log(b);  // Output: 2
console.log(c);  // Output: 3

Dalam contoh di atas, tiga elemen pertama tatasusunan diberikan kepada a, b dan c, masing-masing.

Melangkau Elemen dalam Tatasusunan

Anda boleh melangkau elemen dalam tatasusunan dengan meninggalkan pemegang tempat (koma) dalam tugasan yang memusnahkan:

const arr = [1, 2, 3, 4];

// Skipping the second element
const [a, , c] = arr;

console.log(a);  // Output: 1
console.log(c);  // Output: 3

Nilai Lalai dalam Tatasusunan

Jika tatasusunan tidak mempunyai nilai pada indeks tertentu, anda boleh menetapkan nilai lalai:

const arr = [1];

// Destructuring with a default value
const [a, b = 2] = arr;

console.log(a);  // Output: 1
console.log(b);  // Output: 2 (default value)

2. Pemusnahan Objek

Pemusnahan objek membolehkan anda membongkar nilai daripada objek dan menetapkannya kepada pembolehubah dengan nama sifat yang sepadan. Sintaks menggunakan pendakap kerinting {}.

const person = {
  name: "John",
  age: 30,
  city: "New York"
};

// Destructuring the object
const { name, age, city } = person;

console.log(name);  // Output: John
console.log(age);   // Output: 30
console.log(city);  // Output: New York

Dalam contoh di atas, nama sifat, umur dan bandar diekstrak daripada objek orang dan diberikan kepada pembolehubah dengan nama yang sama.

Menamakan Semula Pembolehubah dalam Pemusnahan Objek

Jika anda ingin menetapkan sifat objek kepada pembolehubah dengan nama yang berbeza, anda boleh menamakan semula mereka semasa pemusnahan:

const person = {
  name: "John",
  age: 30
};

// Renaming variables
const { name: fullName, age: years } = person;

console.log(fullName);  // Output: John
console.log(years);     // Output: 30

Nilai Lalai dalam Objek

Anda juga boleh menetapkan nilai lalai dalam pemusnahan objek:

const person = {
  name: "John"
};

// Destructuring with default values
const { name, age = 25 } = person;

console.log(name);  // Output: John
console.log(age);   // Output: 25 (default value)

Memusnahkan Objek Bersarang

Jika objek mempunyai objek bersarang, anda boleh memusnahkannya juga. Anda hanya perlu menyatakan nama sifat di dalam sepasang pendakap kerinting yang lain.

const person = {
  name: "John",
  address: {
    city: "New York",
    zip: "10001"
  }
};

// Destructuring nested objects
const { name, address: { city, zip } } = person;

console.log(name);  // Output: John
console.log(city);  // Output: New York
console.log(zip);   // Output: 10001

3. Memusnahkan dengan Fungsi

Anda boleh menggunakan penstrukturan dalam parameter fungsi untuk mengakses nilai secara langsung daripada tatasusunan atau objek yang dihantar ke fungsi.

Pemusnahan Tatasusunan dalam Parameter Fungsi

function printCoordinates([x, y]) {
  console.log(`X: ${x}, Y: ${y}`);
}

const coordinates = [10, 20];
printCoordinates(coordinates);  // Output: X: 10, Y: 20

Pemusnahan Objek dalam Parameter Fungsi

function printPerson({ name, age }) {
  console.log(`Name: ${name}, Age: ${age}`);
}

const person = { name: "John", age: 30 };
printPerson(person);  // Output: Name: John, Age: 30

4. Operator Rehat dengan Pemusnahan

operator rehat (...) membolehkan anda mengumpul baki elemen tatasusunan atau baki sifat objek ke dalam pembolehubah tunggal.

Rehat dengan Tatasusunan

const arr = [1, 2, 3, 4];

// Destructuring the array
const [a, b, c] = arr;

console.log(a);  // Output: 1
console.log(b);  // Output: 2
console.log(c);  // Output: 3

Rehat dengan Objek

const arr = [1, 2, 3, 4];

// Skipping the second element
const [a, , c] = arr;

console.log(a);  // Output: 1
console.log(c);  // Output: 3

Kesimpulan

Memusnahkan dalam JavaScript ialah ciri ringkas dan berkuasa yang boleh memudahkan kerja dengan tatasusunan dan objek. Dengan menggunakan tatasusunan dan pemusnahan objek, anda boleh mengekstrak nilai dengan cara yang lebih mudah dibaca dan bersih, terutamanya dalam kes yang melibatkan struktur data atau parameter fungsi yang kompleks.


Hai, saya Abhay Singh Kathayat!
Saya seorang pembangun tindanan penuh dengan kepakaran dalam kedua-dua teknologi hadapan dan belakang. Saya bekerja dengan pelbagai bahasa pengaturcaraan dan rangka kerja untuk membina aplikasi yang cekap, berskala dan mesra pengguna.
Jangan ragu untuk menghubungi saya melalui e-mel perniagaan saya: kaashshorts28@gmail.com.

Atas ialah kandungan terperinci Menguasai Pemusnahan dalam JavaScript: Permudahkan Tatasusunan dan Objek. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
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