Corak Reka Bentuk JavaScript - Tingkah Laku - Keadaan

Corak keadaan membenarkan objek mengubah gelagatnya apabila keadaan dalamannya berubah.

Dalam contoh ini, kami mencipta corak keadaan ringkas dengan kelas Pesanan yang akan mengemas kini status dengan kaedah next().

const ORDER_STATUS = {
  waitingForPayment: 'Waiting for payment',
  shipping: 'Shipping',
  delivered: 'Delivered',
};

class OrderStatus {
  constructor(name, nextStatus) {
    this.name = name;
    this.nextStatus = nextStatus;
  }

  next() {
    return new this.nextStatus();
  }
}

class WaitingForPayment extends OrderStatus {
  constructor() {
    super(ORDER_STATUS.waitingForPayment, Shipping);
  }
}

class Shipping extends OrderStatus {
  constructor() {
    super(ORDER_STATUS.shipping, Delivered);
  }
}

class Delivered extends OrderStatus {
  constructor() {
    super(ORDER_STATUS.delivered, Delivered);
  }
}

class Order {
  constructor() {
    this.state = new WaitingForPayment();
  }

  next() {
    this.state = this.state.next();
  }
}

export { Order };

Contoh lengkap ada di sini ? https://stackblitz.com/edit/vitejs-vite-6zcfql?file=state.js

Kesimpulan

Gunakan corak ini apabila gelagat objek bergantung pada keadaannya dan gelagatnya berubah dalam masa jalan bergantung pada keadaan itu.

---

Saya harap anda dapati ia membantu. Terima kasih kerana membaca. ?

Jom berhubung! Anda boleh menemui saya di:

• Sederhana: https://medium.com/@nhannguyendevjs/
• Dev: https://dev.to/nhannguyendevjs/
• Hashnode: https://nhannguyen.hashnode.dev/
• Linkedin: https://www.linkedin.com/in/nhannguyendevjs/
• X (dahulunya Twitter): https://twitter.com/nhannguyendevjs/
• Beli Saya Kopi: https://www.buymeacoffee.com/nhannguyendevjs

Atas ialah kandungan terperinci Corak Reka Bentuk JavaScript - Tingkah Laku - Keadaan. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!