正文

掌握JS面向对象编程，这些实战题目帮你轻松上手

/0 浏览量
0430

在JavaScript的世界里，面向对象编程（OOP）是构建复杂应用程序的关键。通过OOP，我们可以创建可重用、可维护的代码。以下是一些实战题目，它们将帮助你更好地理解和掌握JavaScript中的面向对象编程。

实战题目一：创建一个简单的银行账户类

目标

创建一个BankAccount类，该类具有余额、存款和取款的方法。

代码示例

class BankAccount {
  constructor(name, balance = 0) {
    this.name = name;
    this.balance = balance;
  }

  deposit(amount) {
    if (amount > 0) {
      this.balance += amount;
      return this.balance;
    }
    return 'Invalid deposit amount';
  }

  withdraw(amount) {
    if (amount <= this.balance) {
      this.balance -= amount;
      return this.balance;
    }
    return 'Insufficient funds';
  }
}

const myAccount = new BankAccount('John Doe', 1000);
console.log(myAccount.deposit(500)); // 1500
console.log(myAccount.withdraw(200)); // 1300

实战题目二：实现一个购物车类

目标

创建一个ShoppingCart类，该类可以添加商品、删除商品和计算总价。

代码示例

class ShoppingCart {
  constructor() {
    this.items = [];
  }

  addItem(item) {
    this.items.push(item);
  }

  removeItem(itemName) {
    this.items = this.items.filter(item => item.name !== itemName);
  }

  getTotal() {
    return this.items.reduce((total, item) => total + item.price, 0);
  }
}

const cart = new ShoppingCart();
cart.addItem({ name: 'Book', price: 12.99 });
cart.addItem({ name: 'Pen', price: 1.50 });
console.log(cart.getTotal()); // 14.49
cart.removeItem('Book');
console.log(cart.getTotal()); // 1.50

实战题目三：实现一个动物类及其子类

目标

创建一个Animal类，并实现两个子类Dog和Cat，分别代表狗和猫。

代码示例

class Animal {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  speak() {
    return 'Some generic sound';
  }
}

class Dog extends Animal {
  constructor(name, age) {
    super(name, age);
  }

  speak() {
    return 'Woof!';
  }
}

class Cat extends Animal {
  constructor(name, age) {
    super(name, age);
  }

  speak() {
    return 'Meow!';
  }
}

const dog = new Dog('Buddy', 5);
const cat = new Cat('Kitty', 3);
console.log(dog.speak()); // 'Woof!'
console.log(cat.speak()); // 'Meow!'

实战题目四：实现一个用户认证系统

目标

创建一个AuthenticationSystem类，该类可以添加用户、验证用户和删除用户。

代码示例

class AuthenticationSystem {
  constructor() {
    this.users = [];
  }

  addUser(username, password) {
    this.users.push({ username, password });
  }

  authenticate(username, password) {
    const user = this.users.find(u => u.username === username && u.password === password);
    return user ? true : false;
  }

  deleteUser(username) {
    this.users = this.users.filter(u => u.username !== username);
  }
}

const authSystem = new AuthenticationSystem();
authSystem.addUser('john', '12345');
console.log(authSystem.authenticate('john', '12345')); // true
authSystem.deleteUser('john');
console.log(authSystem.authenticate('john', '12345')); // false

通过这些实战题目，你将能够更好地理解和掌握JavaScript中的面向对象编程。实践是学习编程的最佳方式，所以请尽量动手实现这些题目，并在实际项目中应用你所学的知识。祝你学习愉快！

-- 展开阅读全文 --