Rumah > hujung hadapan web > tutorial js > Menguasai Objek JavaScript: Tulang Belakang Pengaturcaraan Dinamik

Menguasai Objek JavaScript: Tulang Belakang Pengaturcaraan Dinamik

Patricia Arquette
Lepaskan: 2024-12-20 17:24:10
asal
118 orang telah melayarinya

Mastering JavaScript Objects: The Backbone of Dynamic Programming

Objek JavaScript: Panduan Komprehensif

Objek JavaScript ialah blok binaan asas dalam bahasa, menyediakan cara untuk mengumpulkan data dan fungsi berkaitan bersama-sama. Ia penting untuk bekerja dengan data berstruktur dan merupakan asas pengaturcaraan berorientasikan objek dalam JavaScript.


1. Apakah Objek dalam JavaScript?

Objek dalam JavaScript ialah koleksi sifat, di mana setiap sifat mempunyai kunci (atau nama) dan nilai. Nilai boleh terdiri daripada sebarang jenis data, termasuk objek atau fungsi lain.

Contoh:

const person = {
  name: "Alice",
  age: 30,
  greet: function () {
    console.log("Hello, " + this.name);
  }
};
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

2. Mencipta Objek

a. Literal Objek

Cara paling biasa dan mudah untuk mencipta objek.

const car = {
  brand: "Tesla",
  model: "Model S",
  year: 2023
};
Salin selepas log masuk
Salin selepas log masuk

b. Menggunakan Object() baharu

Mencipta objek menggunakan pembina Objek.

const book = new Object();
book.title = "JavaScript: The Good Parts";
book.author = "Douglas Crockford";
Salin selepas log masuk
Salin selepas log masuk

c. Menggunakan Fungsi Pembina

Pembina tersuai untuk mencipta objek yang serupa.

function Person(name, age) {
  this.name = name;
  this.age = age;
}
const user = new Person("Bob", 25);
Salin selepas log masuk
Salin selepas log masuk

d. Menggunakan Kelas

Sintaks moden untuk penciptaan objek menggunakan kelas ES6.

class Animal {
  constructor(type, sound) {
    this.type = type;
    this.sound = sound;
  }
}
const dog = new Animal("Dog", "Bark");
Salin selepas log masuk
Salin selepas log masuk

3. Mengakses Sifat Objek

Anda boleh mengakses sifat menggunakan:

  • Notasi Titik:
  console.log(person.name);
Salin selepas log masuk
Salin selepas log masuk
  • Notasi Kurungan: Berguna untuk kekunci dinamik atau kekunci dengan aksara khas.
  console.log(person["name"]);
Salin selepas log masuk
Salin selepas log masuk

4. Menambah, Mengemas kini dan Memadamkan Sifat

  • Tambah atau Kemas Kini:
  person.hobby = "Reading"; // Adding a new property
  person.age = 31; // Updating an existing property
Salin selepas log masuk
Salin selepas log masuk
  • Padam:
  delete person.hobby;
Salin selepas log masuk
Salin selepas log masuk

5. Kaedah dalam Objek

Kaedah ialah fungsi yang dikaitkan dengan objek.

const person = {
  name: "Alice",
  age: 30,
  greet: function () {
    console.log("Hello, " + this.name);
  }
};
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

6. Menyemak Hartanah

  • dalam Operator:
const car = {
  brand: "Tesla",
  model: "Model S",
  year: 2023
};
Salin selepas log masuk
Salin selepas log masuk
  • mempunyai Kaedah Harta Sendiri:
const book = new Object();
book.title = "JavaScript: The Good Parts";
book.author = "Douglas Crockford";
Salin selepas log masuk
Salin selepas log masuk

7. Mengulang Melalui Sifat Objek

  • untuk...dalam Gelung: Berulang ke atas semua sifat terbilang.
function Person(name, age) {
  this.name = name;
  this.age = age;
}
const user = new Person("Bob", 25);
Salin selepas log masuk
Salin selepas log masuk
  • Object.keys: Mengembalikan tatasusunan nama sifat.
class Animal {
  constructor(type, sound) {
    this.type = type;
    this.sound = sound;
  }
}
const dog = new Animal("Dog", "Bark");
Salin selepas log masuk
Salin selepas log masuk
  • Object.values: Mengembalikan tatasusunan nilai sifat.
  console.log(person.name);
Salin selepas log masuk
Salin selepas log masuk
  • Object.entry: Mengembalikan tatasusunan pasangan nilai kunci.
  console.log(person["name"]);
Salin selepas log masuk
Salin selepas log masuk

8. Objek Bersarang

Objek boleh mengandungi objek lain sebagai sifat.

  person.hobby = "Reading"; // Adding a new property
  person.age = 31; // Updating an existing property
Salin selepas log masuk
Salin selepas log masuk

9. Pemusnahan Objek

Ekstrak nilai daripada objek kepada pembolehubah.

  delete person.hobby;
Salin selepas log masuk
Salin selepas log masuk

10. Operator Hamparan dan Rehatkan dengan Objek

  • Operator Spread:
const calculator = {
  add: function (a, b) {
    return a + b;
  },
  subtract(a, b) {
    return a - b; // Shorthand syntax
  }
};
console.log(calculator.add(5, 3));
Salin selepas log masuk
  • Operator Rehat:
  console.log("name" in person); // true
Salin selepas log masuk

11. Kaedah Objek (Statik)

JavaScript menyediakan banyak kaedah statik untuk objek.

a. Object.assign

Menyalin sifat daripada satu objek ke objek lain.

  console.log(person.hasOwnProperty("age")); // true
Salin selepas log masuk

b. Object.freeze

Menghalang pengubahsuaian pada objek.

  for (let key in person) {
    console.log(key, person[key]);
  }
Salin selepas log masuk

c. Object.seal

Membenarkan kemas kini tetapi menghalang penambahan atau pemadaman sifat.

  console.log(Object.keys(person));
Salin selepas log masuk

d. Object.create

Mencipta objek baharu dengan prototaip yang ditentukan.

  console.log(Object.values(person));
Salin selepas log masuk

12. Rujukan Objek dan Pengklonan

Objek disimpan dan dimanipulasi melalui rujukan, bukan nilai.

Klon Cetek:

  console.log(Object.entries(person));
Salin selepas log masuk

Klon Dalam (menggunakan JSON.parse dan JSON.stringify):

const company = {
  name: "Tech Corp",
  address: {
    city: "San Francisco",
    zip: "94105"
  }
};
console.log(company.address.city); // Access nested object
Salin selepas log masuk

13. Prototaip dan Warisan

Objek dalam JavaScript mempunyai prototaip, membenarkan pewarisan sifat dan kaedah.

const { name, age } = person;
console.log(name, age);
Salin selepas log masuk

14. Kes Penggunaan Biasa untuk Objek

  1. Menyimpan Pasangan Nilai Kunci: Objek sesuai untuk penyimpanan harta dinamik.
  const newPerson = { ...person, gender: "Female" };
Salin selepas log masuk
  1. Mewakili Entiti Dunia Nyata:

    Objek sering memodelkan struktur data, seperti pengguna atau produk.

  2. Fungsi Pengumpulan:

    Objek boleh berfungsi sebagai modul atau ruang nama.

const person = {
  name: "Alice",
  age: 30,
  greet: function () {
    console.log("Hello, " + this.name);
  }
};
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

15. Pertimbangan Prestasi

  • Meminimumkan sarang dalam untuk prestasi yang lebih baik.
  • Elakkan pembuatan objek yang kerap dalam kod kritikal prestasi.
  • Gunakan Peta atau Set untuk data pasangan nilai kunci yang besar apabila prestasi adalah penting.

Kesimpulan

Objek JavaScript berkuasa dan fleksibel, membentuk tulang belakang kebanyakan aplikasi. Memahami ciri dan keupayaan mereka membolehkan pembangun menulis kod yang cekap, boleh diselenggara dan berskala. Penguasaan objek ialah langkah asas untuk menjadi mahir dalam JavaScript.

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 Objek JavaScript: Tulang Belakang Pengaturcaraan Dinamik. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:dev.to
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