Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk melaksanakan corak kaedah templat menggunakan JavaScript

Bagaimana untuk melaksanakan corak kaedah templat menggunakan JavaScript

PHPz
PHPzasal
2023-04-25 09:15:45661semak imbas

Corak kaedah templat ialah corak reka bentuk tingkah laku, yang merujuk kepada mentakrifkan rangka algoritma dalam satu operasi dan menangguhkan beberapa langkah ke subkelas. Kaedah templat membenarkan subkelas untuk mentakrifkan semula langkah-langkah tertentu algoritma tanpa mengubah strukturnya. Dalam artikel ini, kami akan membincangkan cara melaksanakan corak Kaedah Templat menggunakan JavaScript.

Melaksanakan kaedah

Dalam JavaScript, anda perlu mengikuti langkah berikut untuk melaksanakan corak kaedah templat:

  1. Tentukan kelas asas yang mentakrifkan rangka algoritma dalam Dalam operasi. Operasi boleh menjadi fungsi atau kaedah kelas.
  2. Laksanakan beberapa langkah dalam algoritma dalam kelas asas. Langkah-langkah ini boleh menjadi kaedah abstrak atau pelaksanaan konkrit. Apabila melaksanakan langkah-langkah ini, anda perlu menganggap bahawa langkah-langkah ini akan ditindih oleh subkelas.
  3. Tentukan subkelas, laksanakan kaedah abstrak dalam kelas asas atau tukar pelaksanaan konkrit dalam kelas asas.
  4. Buat contoh dan panggil operasi dalam kelas asas, yang seterusnya akan memanggil langkah algoritma yang dilaksanakan dalam kelas asas dan langkah yang ditindih dalam subkelas.

Contoh

Berikut ialah contoh yang menunjukkan cara melaksanakan corak Kaedah Templat dalam JavaScript. Katakan kita mencipta kelas asas Operation yang mentakrifkan pengiraan jumlah dua nombor. Operasi ini terdiri daripada dua langkah: pertama, dua nombor ditambah, dan kemudian hasilnya diformatkan. Kami akan menggunakan corak kaedah templat untuk melaksanakan operasi ini dan biarkan subkelas memutuskan cara memformat hasilnya.

class Operation {
  constructor(a, b) {
    this.a = a;
    this.b = b;
  }

  getResult() {
    const sum = this.sum();
    return this.format(sum);
  }

  sum() {
    return this.a + this.b;
  }

  format(result) {
    // 由子类决定如何格式化结果
    throw new Error('该方法必须由子类实现');
  }
}

Dalam kod di atas, kami mentakrifkan kelas Operation, yang mengandungi dua nombor a dan b, serta melaksanakan kaedah getResult. Kaedah ini memanggil kaedah sum dan kaedah format, yang mengira jumlah dua nombor dan memformatkan hasilnya dalam format tertentu masing-masing. Memandangkan kaedah format ialah kaedah abstrak, kita perlu melaksanakan kaedah ini dalam subkelas.

Kini kita boleh mencipta subkelas DecimalFormatOperation yang memformatkan hasil pengiraan sebagai nombor perpuluhan.

class DecimalFormatOperation extends Operation {
  format(result) {
    return result.toFixed(2);
  }
}

Dalam kod di atas, kami mewarisi daripada kelas Operation dan melaksanakan kaedah format. Kaedah ini membundarkan hasil pengiraan kepada dua tempat perpuluhan dan mengembalikannya.

Sekarang, kita boleh mencipta contoh dan memanggil kaedah getResult:

const op = new DecimalFormatOperation(2.2, 3.3);
const result = op.getResult();
console.log(result); // '5.50'

Dalam kod di atas, kami mencipta contoh DecimalFormatOperationop dan lulus Masukkan dua nombor 2.2 dan 3.3. Kemudian kita panggil kaedah getResult dan simpan hasilnya dalam pembolehubah result. Akhirnya, kami mencetak hasilnya ke konsol sebagai '5.50'.

Kesimpulan

Corak kaedah templat ialah corak reka bentuk yang sangat berguna yang boleh digunakan dalam JavaScript untuk menyusun kod dengan lebih baik dan menyediakan cara yang fleksibel untuk mentakrifkan rangka algoritma . Kelebihan utama corak ini ialah ia menjadikan kod lebih mudah difahami dan diselenggara, di samping memudahkan penggunaan semula kod. Jika anda sering menulis algoritma yang kompleks atau perlu melaksanakan beberapa operasi biasa, corak Kaedah Templat mungkin corak reka bentuk yang anda perlukan.

Atas ialah kandungan terperinci Bagaimana untuk melaksanakan corak kaedah templat menggunakan JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn