Javascript_Design Pattern
デザインモードとは?
設計モデルはソフトウェア開発における様々なホットな問題を解決するのに役立つ検証された技術である.
この場合,このモードを用いた方向性を与えた.
1. Singleton Patternモノトーンモードは、1つの特定のカテゴリオブジェクトのみを保持するモードである. 戦区からの接近を制限するために使用される. ファクトリモードは、ファクトリのように類似オブジェクトを繰り返し生成できるモードである. のコンパイルでは、特定のタイプ(クラス)が分からなくても、オブジェクトを作成できます. ファクトリモードの最も一般的な例は、オブジェクト()を使用してオブジェクトを作成し、所定の値タイプに基づいてString、Boolean、Numberなどのオブジェクトを生成することです.
コンストラクション関数モードを使用すると、同じオブジェクトの複数のインスタンスをインスタンス化できます.
プロトタイプモードでは、プロトタイプからオブジェクトの新しいインスタンスをコピーします.新しいオブジェクトの作成者を直接作成すると、複雑で非効率になる可能性があります.そのため、プロトタイプは補完できます.
Observerモードは、イベントが発生すると通知されるサブスクリプション・イベントのサブスクリプション・モードを提供します.
モジュールモードは、ソフトウェアモジュールの概念を体現するための設計モードである.このモードでは、より安全なアプリケーションを作成し、コードをカプセル化できます.
設計モデルはソフトウェア開発における様々なホットな問題を解決するのに役立つ検証された技術である.
この場合,このモードを用いた方向性を与えた.
1. Singleton Pattern
const utils=(function (){
let instance;
function initialize () {
return {
sum : function(a,b) {
return a+b;
}
};
}
return {
getInstance: function () {
if(!instance){
instance=initialize();
}
return instance;
}
};
})();
let sum = utils.getInstance().sum(3,5);//8
2.Factory Patternconst Vehicle= function(){};
const Car = function() {
this.say= function() {
console.log('I am a car');
}
};
const Truck = function(){
this.say=function(){
console.log('I am a truck');
}
};
const Bike = function(){
this.say=function(){
console.log('I am a bike');
}
};
const VehicleFactory = function(){
this.createVehicle=(vehicleType)=>{
let vehicle;
switch(vehicleType){
case 'car':
vehicle = new Car();
break;
case 'truck':
vehicle = new Truck();
break;
case 'bike':
vehicle = new Bike();
break;
default:
vehicle = new Vehicle();
3.Constructor Patternコンストラクション関数モードを使用すると、同じオブジェクトの複数のインスタンスをインスタンス化できます.
let person = {};
let person = new Object();
function Person (name,age) {
this.name=name;
this.age = age;
this.showName = () => console.log(this.name);
}
let person = new Person('Amy",28);
person.showName();
4.Prototype Patternプロトタイプモードでは、プロトタイプからオブジェクトの新しいインスタンスをコピーします.新しいオブジェクトの作成者を直接作成すると、複雑で非効率になる可能性があります.そのため、プロトタイプは補完できます.
function Book(title,price) {
this.title=title;
this.price=price;
this.printTitle = () =>console.log(this.title);
}
function BookPrototype(prototype){
this.prototype=prototype;
this.clone=()=>{
let book = new Book();
book.title = prototype.title;
book.price = prototype.price;
return book;
};
}
let sampleBook = new Book ('JavaScript',15);
let prototype = new BookProtoType(sampleBook);
let book = prototype.clone();
book.printTitle();
Javascriptには独自の組み込みプロトコルタイプ機能があるため、以下の方法でこのモードを有効に使用できます.let book = {
title : 'Javascript',
price:15
}
let anotherBook = Object.assign({},book);
5.Observer PatternObserverモードは、イベントが発生すると通知されるサブスクリプション・イベントのサブスクリプション・モードを提供します.
function Newsletter(){
this.observers=[];
}
Newsletter.prototype ={
subscribe: function (observer) {
this.observers.push(observer);
},
unsubscribe: function (observer){
this.observers = this.observers.filter(ob => ob !== observer);
},
notify:function(){
this.observers.forEach(observer =>console.log('Hello' + observer.toString()));
}
}
6.Module Patternモジュールモードは、ソフトウェアモジュールの概念を体現するための設計モードである.このモードでは、より安全なアプリケーションを作成し、コードをカプセル化できます.
const bookModule=(function() {
//private
let title='Javascript';
let price=15;
//public
return {
printTitle: function() {
console.log(title);
}
}
})();
bookModule.printTitle();
注意:https://sangcho.tistory.com/entry/%EC%9B%B9%EA%B0%9C%EB%B0%9C%EC%9E%90%EA%B0%80%EC%95%8C%EC%95%84%EC%95%BC%ED%95%A07%EA%B0%80%EC%A7%80%EB%94%94%EC%9E%90%EC%9D%B8%ED%8C%A8%ED%84%B4Reference
この問題について(Javascript_Design Pattern), 我々は、より多くの情報をここで見つけました https://velog.io/@chloeee/JavascriptDesign-Patternテキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol