Javascript 中的对象

在 Javascript 中，对象是一种非常重要的数据类型。它可以用来描述现实世界中的任何事物，从简单的数字和字符串，到复杂的结构和功能。本文将介绍 Javascript 中对象的基本概念、创建方法、属性和方法等知识点。

基本概念

什么是对象？

在 Javascript 中，对象是一种由键值对组成的数据结构，可以描述现实世界中的任何事物。

对象的组成

一个对象由以下三个部分组成：

• 属性（Properties）：一个对象可以有许多属性，每个属性都有一个键和一个值。键是一个字符串，值可以是任何 Javascript 数据类型。

• 方法（Methods）：方法是与对象相关的一个函数。

• 原型链（Prototype Chain）：Javascript 中的所有对象都有一个原型，它是指另一个对象，对象可以从其原型对象中继承属性和方法。

创建对象

对象字面量

对象字面量是一种创建对象的简单方法，由一对大括号({})括起来，并由零个或多个“名称:值”对组成。每个名称都是一个字符串，后面跟着一个冒号(:)，再后面是值。多个键值对之间用逗号(,)分隔。如下所示：

var person = {
  name: 'Tom',
  age: 25,
  gender: 'male',
  sayHello: function() {
    console.log('Hello, my name is ' + this.name);
  }
};

构造函数

构造函数可以用来创建多个相似对象。构造函数与普通函数的区别在于，构造函数使用 new 关键字调用，并且命名约定为首字母大写。如下所示：

function Person(name, age, gender) {
  this.name = name;
  this.age = age;
  this.gender = gender;
  this.sayHello = function() {
    console.log('Hello, my name is ' + this.name);
  };
}

var person1 = new Person('Tom', 25, 'male');
var person2 = new Person('Lily', 23, 'female');

Object.create()

Object.create() 是一个静态方法，用来创建一个新对象，并将其原型设置为指定的对象。如下所示：

var person = {
  name: 'Tom',
  age: 25,
  gender: 'male',
  sayHello: function() {
    console.log('Hello, my name is ' + this.name);
  }
};

var newPerson = Object.create(person);
newPerson.name = 'Lily';
newPerson.age = 23;

访问对象属性和方法

使用“点”语法

使用“点”语法可以访问对象的属性和方法，如下所示：

var person = {
  name: 'Tom',
  age: 25,
  gender: 'male',
  sayHello: function() {
    console.log('Hello, my name is ' + this.name);
  }
};

console.log(person.name); // 输出：Tom
person.sayHello(); // 输出：Hello, my name is Tom

使用“方括号”语法

使用“方括号”语法也可以访问对象的属性和方法。方括号内必须是一个字符串，且要放在引号内。如下所示：

var person = {
  name: 'Tom',
  age: 25,
  gender: 'male',
  sayHello: function() {
    console.log('Hello, my name is ' + this.name);
  }
};

console.log(person['name']); // 输出：Tom
person['sayHello'](); // 输出：Hello, my name is Tom

修改和删除对象属性和方法

修改属性和方法

可以直接给对象的属性和方法赋新值，如下所示：

var person = {
  name: 'Tom',
  age: 25,
  gender: 'male',
  sayHello: function() {
    console.log('Hello, my name is ' + this.name);
  }
};

person.name = 'Lily';
person.sayHello = function() {
  console.log('Hi, my name is ' + this.name);
};

删除属性和方法

可以使用 delete 关键字删除对象的属性和方法，如下所示：

var person = {
  name: 'Tom',
  age: 25,
  gender: 'male',
  sayHello: function() {
    console.log('Hello, my name is ' + this.name);
  }
};

delete person.age;
delete person['sayHello'];

原型与继承

原型链

Javascript 中的所有对象都有一个原型对象，它是指另一个对象，对象可以从其原型对象中继承属性和方法。如果一个属性或方法在对象本身和其原型对象上都存在，那么对象本身的属性或方法会覆盖原型对象上的属性或方法。

var person = {
  name: 'Tom',
  age: 25,
  gender: 'male'
};

var newPerson = Object.create(person);
newPerson.name = 'Lily';

console.log(newPerson.name); // 输出：Lily
console.log(newPerson.age); // 输出：25，来自原型对象

继承

Javascript 中的对象可以从其他对象继承属性和方法。构造函数和原型链都可以用来实现继承。

1. 构造函数实现继承

function Person(name, age, gender) {
  this.name = name;
  this.age = age;
  this.gender = gender;
  this.sayHello = function() {
    console.log('Hello, my name is ' + this.name);
  };
}

function Employee(name, age, gender, salary) {
  Person.call(this, name, age, gender); // 继承属性
  this.salary = salary;
}

var employee = new Employee('Tom', 25, 'male', 5000);
console.log(employee.name); // 输出：Tom
console.log(employee.salary); // 输出：5000
employee.sayHello(); // 输出：Hello, my name is Tom

2. 原型链实现继承

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

Person.prototype.sayHello = function() {
  console.log('Hello, my name is ' + this.name);
};

function Employee(name, age, gender, salary) {
  this.salary = salary;
}

Employee.prototype = new Person(); // 继承原型链

var employee = new Employee('Tom', 25, 'male', 5000);
console.log(employee.name); // 输出：Tom
console.log(employee.salary); // 输出：5000
employee.sayHello(); // 输出：Hello, my name is Tom

总结

本文介绍了 Javascript 中对象的基本概念、创建方法、属性和方法等知识点。了解这些内容将有助于程序员更好地使用和理解 Javascript 对象。