设计模式是程序语言里的集大成者。JavaScript 中的设计模式指的是一些可重用的解决方案,这些方案适用于编写 JavaScript Web 应用程序时常见的一些问题。
开发人员将 JavaScript 设计模式作为解决问题的模板是很合适的,但并不是说这些模式可以代替开发人员的工作。
通过设计模式,我们可以将许多开发人员的经验结合起来,以优化过的方式来构造代码,从而解决我们所面对的问题。设计模式还提供了用于描述问题解决方案的通用词汇表,而不是去枯燥地描述代码的语法和语义。 JavaScript 设计模式可帮助开发人员编写出井井有条、美观且结构合理的代码。尽管设计模式很容易重用,但它们并不是要取代开发人员的工作;它们是开发人员的支持与辅助,提供了与特定应用程序无关的通用解决方案,从而尽量避免那些可能导致 Web 应用程序的开发工作出现重大问题的小漏洞。 与临时方案相比,它们消除了不必要的重复,从而缩减了代码库的整体大小,并让我们的代码更加健壮。 在本文中,我们将探讨 7 种最出色和最受欢迎的 JavaScript 设计模式,这些模式主要归为以下三类:创作设计模式、结构设计模式和行为设计模式。
1、构造函数设计模式 这是一种特殊的方法,用于在分配内存后初始化新创建的对象。由于 JavaScript 一般来说是面向对象的,所以它打交道最多的就是对象。于是我打算深入研究对象构造函数。在 JavaScript 中创建新对象有三种方法可用。 以下创建构造函数设计模式的一种方法。- // 创建一个新的空对象
- let newObject = {};
- // 创建一个新的空对象
- let newObject = Object.create(Object.prototype);
- let newObject = newObject();
复制代码 要访问函数的属性,你需要初始化对象。- const object = new ConstructorObject()
复制代码 上面的 new 关键字告诉 JavaScript,一个 constructorObject 应该充当一个构造函数。这个设计模式并不支持继承。
2、原型模式
原型模式是基于原型继承的。在这种模式中,被创建的对象充当其他对象的原型。实际上,原型(prototype)是被创建的每个对象构造函数的蓝图。 示例:- var myCar= {
- name:"Ford Escort",
- brake:function(){
- console.log("Stop! I am applying brakes");
- }
- Panic : function (){
- console.log ( "wait. how do you stop thuis thing?")
- }
- }
- // 使用 object create 实个新的例化一 car
- var yourCar= object.create(myCar);
- // 现在它就是另一个的原型了
- console.log (yourCar.name);]
复制代码
3、模块设计模式
模块(module)设计模式对原型模式做了一些改进。模块模式设置了不同类型的修饰符(私有和公共)。你可以创建相似的函数或属性而不会发生冲突。我们还可以灵活地公开重命名函数。这个设计模式的一个缺陷是无法覆盖(override)外部环境中创建的函数。 示例:- function AnimalContainter () {
- const container = [];
- function addAnimal (name) {
- container.push(name);
- }
- function getAllAnimals() {
- return container;
- }
- function removeAnimal(name) {
- const index = container.indexOf(name);
- if(index < 1) {
- throw new Error('Animal not found in container');
- }
- container.splice(index, 1)
- }
- return {
- add: addAnimal,
- get: getAllAnimals,
- remove: removeAnimal
- }
- }
- const container = AnimalContainter();
- container.add('Hen');
- container.add('Goat');
- container.add('Sheep');
- console.log(container.get()) //Array(3) ["Hen", "Goat", "Sheep"]
- container.remove('Sheep')
- console.log(container.get()); //Array(2) ["Hen", "Goat"]
复制代码
4. 单例模式在仅需要创建一个实例的情况下(例如一个数据库连接),这个模式是必需的。在这个模式中,只能在关闭连接时创建一个实例,或者在打开新实例之前必须关闭已有的实例。此模式也称为严格模式,它的一个缺点是测试时的体验很差,因为它隐藏的依赖项对象很难挑出来进行测试。 示例:- function DatabaseConnection () {
- let databaseInstance = null;
- // 追踪特定时间创建实例的数量
- let count = 0;
- function init() {
- console.log(`Opening database #${count + 1}`);
- // 现在执行操作
- }
- function createIntance() {
- if(databaseInstance == null) {
- databaseInstance = init();
- }
- return databaseInstance;
- }
- function closeIntance() {
- console.log('closing database');
- databaseInstance = null;
- }
- return {
- open: createIntance,
- close: closeIntance
- }
- }
- const database = DatabseConnection();
- database.open(); //Open database #1
- database.open(); //Open database #1
- database.open(); //Open database #1
- database.close(); //close database
复制代码
|