JavaScript设计模式中构造函数模式的介绍-js教程-PHP中文网

一、构造函数模式概念

二、构造函数模式的作用和注意事项

模式作用：

注意事项：

三、构造函数模式代码和实战总结

首页

web前端

js教程

JavaScript设计模式中构造函数模式的介绍

不言

Jul 03, 2018 pm 03:17 PM

javascript 设计模式

这篇文章主要介绍了JavaScript设计模式之构造函数模式,结合实例形式分析了构造函数模式的概念、功能、定义及使用方法,需要的朋友可以参考下

本文实例讲述了JavaScript设计模式之构造函数模式。分享给大家供大家参考，具体如下：

一、构造函数模式概念

构造函数用于创建特定类型的对象——不仅声明了使用过的对象，构造函数还可以接受参数以便第一次创建对象的时候设置对象的成员值。你可以自定义自己的构造函数，然后在里面声明自定义类型对象的属性或方法。

在JavaScript里，构造函数通常是认为用来实现实例的，JavaScript没有类的概念，但是有特殊的构造函数。通过new关键字来调用自定义的构造函数，在构造函数内部，this关键字引用的是新创建的对象。

二、构造函数模式的作用和注意事项

模式作用：

1.用于创建特定类型的对象

2.第一次声明的时候给对象赋值

3.自己声明构造函数，赋予属性和方法

注意事项：

1.声明函数的时候处理业务逻辑

2.区分和单例的区别，配合单例实现初始化

3.构造函数大写字母开头

三、构造函数模式代码和实战总结

<!DOCTYPE html>
<html>
<head lang="en">
  <meta charset="UTF-8">
  <title>构造函数模式</title>
</head>
<body>
<!--<script>
  function Car(model,year,miles){
    if(!(this instanceof Car)){
      return new Car(model,year,miles);
    }
    this.model = model;
    this.year = year;
    this.miles = miles;
    this.output = function(){
      return this.model + "走了" + this.miles + "公里";
    }
  }
  var tom = new Car("大叔",2009,20000);
  var dudu = Car("Dudu",2010,5000);
  console.log(typeof tom);
  console.log(tom.output());
  console.log(typeof dudu);
  console.log(dudu.output());
</script>-->
<script>
  //1.用于创建特定类型的对象
  //2.这样的函数名会被人笑话
  //3.js开发的时候写单引号
  //4.js里构造函数比较特殊的地方 new
  //5.其他的语言里 比如PHP 里人家实现 有一个关键字 A class
  //6.zaomen就是构造函数 他又充当了类的概念
  var AA = {
    zaomen:function(huawen) {
      if (!(this instanceof AA.zaomen)) {
        console.log(123);
        return new AA.zaomen(huawen);
      };
      var _huawen = "普通";
      if (huawen) {
        _huawen = huawen;
      }
      this.suo = "普通";
      this.huawen = _huawen;
      this.create = function () {
        return "【锁头】" + this.suo + "【花纹】" + this.huawen;
      }
    }
  };
  var BB = {
    zaomen:function(huawen,suo) {
      if (!(this instanceof BB.zaomen)) {
        return new BB.zaomen(huawen,suo);
      };
      var _huawen = "普通";
      if (huawen) {
        _huawen = huawen;
      }
      this._suo = "普通";
      if (suo) {
        _suo = suo;
      }
      this.suo = _suo;
      this.huawen = _huawen;
      this.create = function () {
        return "【锁头】" + this.suo + "【花纹】" + this.huawen;
      }
    }
  };
  /*function zaomen(huawen){
    if(!(this instanceof zaomen)){
      return new zaomen();
    }
    var _huawen = "普通";
    if(huawen){
      _huawen = huawen;
    }
    this.suo = "普通";
    this.huawen = _huawen;
    this.create = function(){
      return "【锁头】" + this.suo + "【花纹】" + this.huawen;
    }
  }*/
  var xiaozhang = AA.zaomen();
  alert("xiaozhang" + xiaozhang.create());
  var xiaoli = BB.zaomen("绚丽",&#39;123&#39;);
  alert("xiaoli" + xiaoli.create());
</script>
</body>
</html>

登录后复制

运行效果如下：

以上就是本文的全部内容，希望对大家的学习有所帮助，更多相关内容请关注PHP中文网！

热AI工具

Undresser.AI Undress

人工智能驱动的应用程序，用于创建逼真的裸体照片

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

免费脱衣服图片

Clothoff.io

AI脱衣机

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸！

显示更多

热工具

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

中文版，非常好用

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

显示更多

热门话题

Java教程

1664

CakePHP 教程

1423

Laravel 教程

1317

PHP教程

1268

C# 教程

1244

显示更多

Related knowledge

Java框架中设计模式与架构模式的区别 Jun 02, 2024 pm 12:59 PM

在Java框架中，设计模式和架构模式的区别在于：设计模式定义了在软件设计中解决常见问题的抽象解决方案，关注类和对象之间的交互，如工厂模式。架构模式定义了系统结构和模块之间的关系，关注系统组件的组织和交互，如分层架构。

Java设计模式之装饰器模式剖析 May 09, 2024 pm 03:12 PM

装饰器模式是一种结构型设计模式，允许动态添加对象功能，无需修改原始类。它通过抽象组件、具体组件、抽象装饰器和具体装饰器的协作实现，可以灵活扩展类功能，满足变化的需求。示例中，将牛奶和摩卡装饰器添加到Espresso，总价为2.29美元，展示了装饰器模式在动态修改对象行为方面的强大功能。

PHP 设计模式实战案例解析 May 08, 2024 am 08:09 AM

1.工厂模式:分离对象创建和业务逻辑，通过工厂类创建指定类型的对象。2.观察者模式:允许主题对象通知观察者对象其状态更改，实现松耦合和观察者模式。

设计模式如何应对代码维护难题 May 09, 2024 pm 12:45 PM

设计模式通过提供可重用和可扩展的解决方案来解决代码维护难题：观察者模式：允许对象订阅事件，并在事件发生时收到通知。工厂模式：提供了一种创建对象的集中式方式，而无需依赖具体类。单例模式：确保一个类只有一个实例，用于创建全局可访问的对象。

PHP设计模式：测试驱动开发实践 Jun 03, 2024 pm 02:14 PM

TDD用于编写高质量PHP代码，步骤包括：编写测试用例，描述预期功能并使其失败。编写代码，仅使测试用例通过，无需过分优化或详细设计。测试用例通过后，优化和重构代码以提高可读性、可维护性和可扩展性。

Guice框架中设计模式的应用 Jun 02, 2024 pm 10:49 PM

Guice框架应用了多项设计模式，包括：单例模式：通过@Singleton注解确保类只有一个实例。工厂方法模式：通过@Provides注解创建工厂方法，在依赖注入时获取对象实例。策略模式：将算法封装成不同策略类，通过@Named注解指定具体策略。

Java设计模式之适配器模式的妙用 May 09, 2024 pm 12:54 PM

适配器模式是一种结构型设计模式，允许不兼容对象协同工作，它将一个接口转换为另一个，使对象能够顺利交互。对象适配器通过创建包含被适配对象的适配器对象，并实现目标接口，实现适配器模式。在一个实战案例中，通过适配器模式，客户端（如MediaPlayer）可以播放高级格式的媒体（如VLC），尽管其本身仅支持普通媒体格式（如MP3）。

Spring MVC框架中设计模式的应用 Jun 02, 2024 am 10:35 AM

SpringMVC框架使用以下设计模式：1.单例模式：管理Spring容器；2.门面模式：协调控制器、视图和模型交互；3.策略模式：根据请求选择请求处理程序；4.观察者模式：发布和监听应用程序事件。这些设计模式增强了SpringMVC的功能和灵活性，使开发者可以创建高效、可维护的应用程序。

See all articles

JavaScript设计模式中构造函数模式的介绍

一、构造函数模式概念

二、构造函数模式的作用和注意事项

模式作用：

注意事项：

三、构造函数模式代码和实战总结

热AI工具

Undresser.AI Undress

AI Clothes Remover

Undress AI Tool

Clothoff.io

Video Face Swap

热门文章

热工具

记事本++7.3.1

SublimeText3汉化版

禅工作室 13.0.1

Dreamweaver CS6

SublimeText3 Mac版

热门话题