Observer pattern
·
Frontend/JS Patterns
With the observer pattern,we can subscribe certain objects, the observers, to another object, called the observable. Whenever an event occurs, the observable notifies all its observers! observers: an array of observers that will get notified whenever a specific event occursAn observable object usually contains 3 important parts: subscribe(): a method in order to add observers to the observers li..
Module pattern
·
Frontend/JS Patterns
The module pattern allows you to split up your code into smaller, reusable pieces.modules allow you to keep certain values within your file private. Declarations within a module are scoped (encapsulated) to that module , by default.// export exampleexport function add(x, y) { return x + y;}export function multiply(x) { return x * 2;}export function subtract(x, y) { return x - y;}export functi..
Mixin pattern
·
Frontend/JS Patterns
An object used to Add reusable functionality to another object or class, without using inheritance.Simply, adding functionalities to the target prototype!We can add the dogFunctionality mixin to the Dog prototype with the Object.assign method. We can add animalFunctionality to the dogFunctionality prototype, using Object.assign. In this case, the target object is dogFunctionality.class Dog { co..
Middleware Pattern
·
Frontend/JS Patterns
실제로 요청과 응답 사이에 위치하는 미들웨어 기능 체인으로,하나 이상의 미들웨어 함수를 통해 요청 객체부터 응답까지 추적하고 수정할 수 있습니다. const app = require("express")(); const html = require("./data"); app.use( "/", (req, res, next) => { req.headers["test-header"] = 1234; next(); }, (req, res, next) => { console.log(`Request has test header: ${!!req.headers["test-header"]}`); next(); } ); app.get("/", (req, re..
Flyweight Pattern
·
Frontend/JS Patterns
Flyweight 패턴은 비슷한 객체를 대량으로 생성할 때 메모리를 보존하는 데 유용한 방법입니다. class Book { constructor(title, author, isbn) { this.title = title; this.author = author; this.isbn = isbn; }}const books = new Map(); // 중복된 책은 제외됨const bookList = []; // 중복된 책 포함 - 즉, 복사본이 있음.const addBook = (title, author, isbn, availability, sales) => { const book = { ...createBook(title, author, isbn), sales, avail..
Factory Pattern
·
Frontend/JS Patterns
The term “Factory Pattern” in JavaScript (and in software design in general) comes from the concept of a “factory” in real life, where a factory isa place where objects (products) are created.In the context of software design, the Factory Pattern is a creational design pattern that provides an interface for creating objects without specifying the exact class of object that will be created. 즉, ne..