JS面向对象编程详解

JavaScript是一种基于对象的语言。在JavaScript中，对象既可以是内置的，如Math和Date对象，也可以是自定义的。在这种语言中，我们使用面向对象编程（OOP）模式进行代码的组织和控制。

面向对象编程（OOP）是一种程序设计模式，它将计算机程序中的数据和功能组成了对象，通过对象之间的交互来实现计算机程序的功能。在JavaScript中，我们可以使用对象（Object）、类（Class）、属性（Property）和方法（Method）等一系列概念来实现面向对象编程。

面向对象编程中的重要概念

类

类是一种JavaScript数据类似于对象。它的作用是封装数据和行为，是实施封装的重要一个思想。

在JavaScript中，我们可以使用“class”关键字来声明一个类。

示例代码:

class Animal {
  constructor(name) {
    this.name = name;
  }
  speak() {
    console.log(this.name + ' makes a noise.');
  }
}

let a = new Animal('Cat');
a.speak();

对象

在面向对象编程中，对象是类的一个实例。

在JavaScript中，创建一个对象通常使用“new Object()”，但是也可以通过“{}”来创建一个简单对象。

示例代码:

let person = new Object();
person.firstName = "John";
person.lastName = "Doe";
person.age = 50;

属性

在JavaScript中，属性是可以对对象进行操作的数据。

示例代码:

let person = {
  firstName: "John",
  lastName: "Doe",
  age: 50
};

方法

在面向对象编程中，方法是类中的函数，用于实现类的行为。

在JavaScript中，我们可以使用“this”关键字来引用当前对象。

示例代码：

class Person {
  constructor(name) {
    this.name = name;
  }
  sayHello() {
    console.log("Hello, my name is " + this.name);
  }
}

let p = new Person("John");
p.sayHello();

让我们一起设计一个餐厅！

那么，如何使用面向对象编程来设计一个餐厅呢？以下是详细的步骤和职责。

步骤

1. 设计餐厅类Restaurant，并添加属于餐厅的属性，如：餐厅名称；餐厅类型；就餐时间段；坐位数等等；
2. 设计菜品类Dish，并添加属于菜品的属性，如：菜品名称；菜品类型；菜品价格，等等；
3. 让餐厅类Restaurant拥有一个能力，来添加菜品；
4. 让餐厅类Restaurant拥有一个能力，来订餐，其中订餐传入的是菜品类Dish的实例；
5. 让餐厅类Restaurant拥有一个能力，来打印餐厅的菜单（已点菜品）；
6. 让餐厅类Restaurant拥有一个能力，来计算餐费。

示例代码

class Restaurant {
  constructor(name, type, openTime, closeTime, seatNum) {
    this.name = name;
    this.type = type;
    this.openTime = openTime;
    this.closeTime = closeTime;
    this.seatNum = seatNum;
    this.menu = [];
  }

  addDish(dish) {
    this.menu.push(dish);
  }

  order(dish) {
    console.log("One " + dish.name + " has been ordered.");
    this.addDish(dish);
  }

  getMenu() {
    console.log("Menu:");
    for(let i=0;i<this.menu.length;i++) {
      console.log(this.menu[i].name + " " + this.menu[i].price);
    }
  }

  calcCost() {
    let cost = 0;
    for(let i=0;i<this.menu.length;i++) {
      cost += this.menu[i].price;
    }
    console.log("Cost: " + cost);
  }
}

class Dish {
  constructor(name, type, price) {
    this.name = name;
    this.type = type;
    this.price = price;
  }
}

let res = new Restaurant("My Restaurant", "Chinese Restaurant", "17:00", "21:00", 20);
let dumpling = new Dish("Dumpling", "Chinese Food", 6);
let friedChiken = new Dish("Fried Chiken", "Western Food", 10);
res.order(dumpling);
res.order(friedChiken);
res.getMenu();
res.calcCost();

以上代码通过使用面向对象编程的方法，来创建了一个简单的餐厅，并实现了一些基本的功能，如添加菜品、订餐、打印菜单和计算餐费。

现在，你可以开始使用面向对象编程的方式来构建更加复杂的JavaScript应用程序了！