重学 JavaScript：全方位剖析对象

2023-12-16 11:14:03

导论：对象在 JavaScript 中的重要性

作为 JavaScript 最基本的数据结构，对象广泛应用于各种场景。通过对象，可以方便地组织和处理复杂数据。对象的概念贯穿 JavaScript 的方方面面，从 DOM 操作到事件处理，再到网络通信，处处可见其身影。深入掌握对象及其相关知识，无疑是 JavaScript 进阶之路的必经环节。

对象创建与操作

1. 使用new操作符创建对象

在 JavaScript 中，创建对象的方式多种多样。最常见的方法之一便是使用new操作符。通过new操作符，可以调用构造函数来创建新对象，同时自动执行构造函数中的代码。构造函数通常用于初始化对象属性和方法。

function Person(name, age) {
  this.name = name;
  this.age = age;
}

const person1 = new Person('John', 30);
const person2 = new Person('Mary', 25);

console.log(person1.name); // 'John'
console.log(person2.age); // 25

2. 利用字面量创建对象

另一种创建对象的方法是使用字面量语法。字面量是一种直接在代码中定义对象的方式，无需使用构造函数。

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

console.log(person.name); // 'John'
console.log(person.age); // 30

对象属性与方法

1. 对象属性

对象属性是对象存储数据的键值对。属性名称可以是字符串、数字或符号。属性值可以是任何 JavaScript 类型的数据，包括其他对象、函数甚至数组。

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

console.log(person.name); // 'John'
console.log(person['age']); // 30
console.log(person.city); // 'New York'

2. 对象方法

对象方法是对象中定义的函数。方法可以被调用来执行特定的操作。方法名称可以是字符串、数字或符号。方法体可以是任何 JavaScript 代码，包括条件语句、循环和函数调用。

const person = {
  name: 'John',
  age: 30,
  greet: function() {
    console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
  }
};

person.greet(); // 'Hello, my name is John and I am 30 years old.'

理解原型链

原型链是 JavaScript 中一个重要的概念。每个对象都具有一个原型对象，而原型对象又具有自己的原型对象，以此类推。原型链允许对象继承原型对象中的属性和方法。

function Person(name, age) {
  this.name = name;
  this.age = age;
}

Person.prototype.greet = function() {
  console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
};

const person1 = new Person('John', 30);
const person2 = new Person('Mary', 25);

person1.greet(); // 'Hello, my name is John and I am 30 years old.'
person2.greet(); // 'Hello, my name is Mary and I am 25 years old.'