Table of Contents
1. Concept of constructor pattern
2. The functions and precautions of the constructor pattern
Pattern functions:
Notes:
3. Constructor pattern code and practical summary
Home Web Front-end JS Tutorial Introduction to Constructor Pattern in JavaScript Design Patterns

Introduction to Constructor Pattern in JavaScript Design Patterns

Jul 03, 2018 pm 03:17 PM
javascript Design Patterns

This article mainly introduces the constructor pattern of JavaScript design patterns, and analyzes the concept, function, definition and usage of the constructor pattern in the form of examples. Friends in need can refer to the following

Examples of this article Introduced the constructor pattern of JavaScript design patterns. Share it with everyone for your reference, as follows:

1. Concept of constructor pattern

Constructor is used to create objects of a specific type - not only declares the used object, the constructor also Can accept parameters to set the object's member values ​​when the object is first created. You can customize your own constructor and declare properties or methods of custom type objects in it.

In JavaScript, constructors are usually used to implement instances. JavaScript does not have the concept of classes, but there are special constructors. The custom constructor is called through the new keyword. Inside the constructor, the this keyword refers to the newly created object.

2. The functions and precautions of the constructor pattern

Pattern functions:

1. Used to create objects of specific types

2.First Assign a value to the object when declaring it for the first time

3. Declare the constructor yourself, assign properties and methods

Notes:

1. Process business logic when declaring a function

2. Distinguish the difference between singleton and singleton, and implement initialization with singleton

3. Constructor function begins with a capital letter

3. Constructor pattern code and practical summary

<!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>
Copy after login

The operation effect is as follows:

##The above is the entire content of this article, I hope it will be helpful to everyone's learning. For more related content, please pay attention to the PHP Chinese website!

Related recommendations:

Introduction to factories in JavaScript design patterns

Introduction to proxy patterns in JavaScript design patterns

The above is the detailed content of Introduction to Constructor Pattern in JavaScript Design Patterns. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

The difference between design patterns and architectural patterns in Java framework The difference between design patterns and architectural patterns in Java framework Jun 02, 2024 pm 12:59 PM

In the Java framework, the difference between design patterns and architectural patterns is that design patterns define abstract solutions to common problems in software design, focusing on the interaction between classes and objects, such as factory patterns. Architectural patterns define the relationship between system structures and modules, focusing on the organization and interaction of system components, such as layered architecture.

Analysis of the Decorator Pattern in Java Design Patterns Analysis of the Decorator Pattern in Java Design Patterns May 09, 2024 pm 03:12 PM

The decorator pattern is a structural design pattern that allows dynamic addition of object functionality without modifying the original class. It is implemented through the collaboration of abstract components, concrete components, abstract decorators and concrete decorators, and can flexibly expand class functions to meet changing needs. In this example, milk and mocha decorators are added to Espresso for a total price of $2.29, demonstrating the power of the decorator pattern in dynamically modifying the behavior of objects.

PHP design pattern practical case analysis PHP design pattern practical case analysis May 08, 2024 am 08:09 AM

1. Factory pattern: Separate object creation and business logic, and create objects of specified types through factory classes. 2. Observer pattern: allows subject objects to notify observer objects of their state changes, achieving loose coupling and observer pattern.

How design patterns deal with code maintenance challenges How design patterns deal with code maintenance challenges May 09, 2024 pm 12:45 PM

Design patterns solve code maintenance challenges by providing reusable and extensible solutions: Observer Pattern: Allows objects to subscribe to events and receive notifications when they occur. Factory Pattern: Provides a centralized way to create objects without relying on concrete classes. Singleton pattern: ensures that a class has only one instance, which is used to create globally accessible objects.

The wonderful use of the adapter pattern in Java design patterns The wonderful use of the adapter pattern in Java design patterns May 09, 2024 pm 12:54 PM

The Adapter pattern is a structural design pattern that allows incompatible objects to work together. It converts one interface into another so that the objects can interact smoothly. The object adapter implements the adapter pattern by creating an adapter object containing the adapted object and implementing the target interface. In a practical case, through the adapter mode, the client (such as MediaPlayer) can play advanced format media (such as VLC), although it itself only supports ordinary media formats (such as MP3).

PHP Design Patterns: Test Driven Development in Practice PHP Design Patterns: Test Driven Development in Practice Jun 03, 2024 pm 02:14 PM

TDD is used to write high-quality PHP code. The steps include: writing test cases, describing the expected functionality and making them fail. Write code so that only the test cases pass without excessive optimization or detailed design. After the test cases pass, optimize and refactor the code to improve readability, maintainability, and scalability.

Application of design patterns in Guice framework Application of design patterns in Guice framework Jun 02, 2024 pm 10:49 PM

The Guice framework applies a number of design patterns, including: Singleton pattern: ensuring that a class has only one instance through the @Singleton annotation. Factory method pattern: Create a factory method through the @Provides annotation and obtain the object instance during dependency injection. Strategy mode: Encapsulate the algorithm into different strategy classes and specify the specific strategy through the @Named annotation.

What are the advantages and disadvantages of using design patterns in java framework? What are the advantages and disadvantages of using design patterns in java framework? Jun 01, 2024 pm 02:13 PM

The advantages of using design patterns in Java frameworks include: enhanced code readability, maintainability, and scalability. Disadvantages include complexity, performance overhead, and steep learning curve due to overuse. Practical case: Proxy mode is used to lazy load objects. Use design patterns wisely to take advantage of their advantages and minimize their disadvantages.

See all articles