الگوهای طراحی هر توسعه دهنده زاویه ای باید بداند

توسعه دهندگان جدید ممکن است در نظر نگیرد که چگونه کد با تغییرات آینده روبرو خواهد شد یا چگونه می توان از آن به راحتی استفاده کرد ، گسترش یا نگهداری کرد. در بدترین حالت ، توسعه دهندگان حتی ممکن است نیاز به بازسازی کامل این پروژه از ابتدا داشته باشند ، هنگامی که کارها برای رفع آن خیلی سخت می شود. برای جلوگیری از این مسائل ، الگوهای طراحی ایجاد شدند

الگوهای طراحی مانند طرح هایی است که باعث می شود کد شما با گذشت زمان مدیریت و تغییر کند.

الگوهای طراحی راه حل های آزمایش شده و آزمایش شده برای مسائل طراحی مشترک در توسعه نرم افزار است. آنها به جای ارائه راه حل کامل ، به عنوان بهترین روش ها برای حل چالش های طراحی نرم افزار مشترک عمل می کنند.

الگوهای طراحی در زاویه ای به شما کمک می کند تا کد تمیزتر و سازمان یافته تری بنویسید که باعث می شود برنامه شما برای ساخت ، رشد و اصلاح با گذشت زمان آسانتر شود.

چرا الگوهای طراحی مهم هستند

1. مقیاس پذیری

الگوهای طراحی به تجزیه برنامه شما به قطعات کوچک و قابل استفاده مجدد کمک می کند. این امر باعث می شود که بعداً بدون اینکه از ویژگی های موجود استفاده کنیم ، اضافه کردن ویژگی های جدید را آسان کنید.

2. قابلیت حفظ

الگوهای طراحی زیر تضمین می کند که کد شما دارای ساختار واضح و سازمان یافته ای است.

به عنوان مثال با استفاده از الگوهای مانند الگوی تک آهنگ برنامه را قابل حفظ تر می کند زیرا شما فقط باید یک قطعه کد را در سرویس تغییر دهید و تمام مؤلفه هایی که به آن بستگی دارند به طور خودکار سازگار می شوند.

3. قابلیت آزمایش

الگوهای طراحی باعث جداسازی نگرانی ها می شود که باعث می شود مسخره کردن و آزمایش اجزای آن آسان تر شود

4. قابلیت استفاده مجدد کد

الگوهای نوشتن کد قابل استفاده مجدد را تشویق می کنند.

به عنوان مثال ، الگوهای مانند کارخانه وت مجری به شما کمک می کند تا کارهای مشابه را در یک مکان سازماندهی کنید ، بنابراین می توانید به راحتی از آنها استفاده کنید بدون اینکه دوباره همان منطق را بازنویسی کنید.

1. الگوی Singleton

در الگوی تک آهنگ تضمین می کند که یک کلاس فقط داشته باشد یک نمونه و اجازه می دهد تا آن نمونه باشد مشترک در سطح جهان

در زاویه ای ، این اغلب برای استفاده می شود خدمات، اطمینان حاصل کنید که فقط یک نمونه از یک سرویس در کل برنامه استفاده می شود.

هنگامی که در آن ارائه می شود ، یک سرویس به یک مجرد تبدیل می شود سطح ریشهبشر برای انجام این کار ، شما از ارائه شده: “ریشه” تنظیم در ابرداده خدمات.

مثال:

import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root' // This makes the service a singleton
})
export class MyService {
  constructor() { }

  // Your service methods here
}

2. الگوی نمای

الگوی نمای ارائه می دهد رابط ساده برای تعامل با زیر سیستم های پیچیده.

وقتی از شما استفاده نمی کنید الگوی نمای ، مؤلفه ها مستقیماً با چندین سرویس برای انجام عملیات مختلف ارتباط برقرار می کنند. این باعث افزایش پیچیدگی می شود زیرا چندین مؤلفه ممکن است همان منطق را تکرار کنند و منجر به تکثیر کد شوند.

با الگوی نما به جای اینکه مؤلفه هایی که چندین سرویس را فراخوانی می کنند ، با نمای تعامل دارند. این امر باعث می شود که مؤلفه ها لاغر و آسان تر باشند ، در حالی که منطق کسب و کار در یک مکان متمرکز باقی مانده است (نمای)

نمونه

@Injectable({
  providedIn: 'root',
})
export class CartFacade {
  constructor(private cartService: CartService, private orderService: OrderService) {}

  // Add product to cart
  addToCart(product: Product) {
    this.cartService.addItem(product);
  }

  // Remove product from cart
  removeFromCart(product: Product) {
    this.cartService.removeItem(product);
  }

  // Process checkout using the current cart
  checkout() {
    const cart = this.cartService.getCart();
    this.orderService.processOrder(cart);
  }

  // Get the current items in the cart
  getCartItems() {
    return this.cartService.getCart();
  }
}

برای استفاده از الگوی نما در اجزای زاویه ای خود ، شما به سادگی سرویس نمای را تزریق کنید به مؤلفه

constructor(private cartFacade: CartFacade) {}

3 الگوی کارخانه

در الگوی کارخانه راهی برای ایجاد اشیاء بدون مشخص کردن کلاس دقیق شیء است که ایجاد می شود.

این روند فرآیند ایجاد شی را کنترل می کند و جزئیات نحوه فوری نمونه ها را پنهان می کند.

در الگوی کارخانه می تواند اشیاء را به صورت پویا ایجاد کند ، که از نظر شما مفید است از قبل اشیاء/خدمات دقیق برنامه شما در زمان اجرا نیاز خواهد داشت

نمونه

بیایید بگوییم که می خواهید انواع مختلفی از اعلان های کاربر ایجاد کنید (به عنوان مثال ، ایمیلبا اس ام اس). شما می توانید پیاده سازی کنید الگوی کارخانه به شرح زیر:

// src/app/notification.interface.ts // src/app/notification.interface.ts
export interface Notification {
  send(message: string): void;
}

// src/app/notification.service.ts
import { Injectable } from '@angular/core';
import { Notification } from './notification.interface';

@Injectable({
  providedIn: 'root',
})
export class EmailNotification implements Notification {
  send(message: string): void {
    console.log(`Email: ${message}`);
  }
}

@Injectable({
  providedIn: 'root',
})
export class SmsNotification implements Notification {
  send(message: string): void {
    console.log(`SMS: ${message}`);
  }
}

حال ، بیایید یک کارخانه

// src/app/notification.factory.ts
import { Injectable } from '@angular/core';
import { EmailNotification } from './notification.service';
import { SmsNotification } from './notification.service';
import { Notification } from './notification.interface';

@Injectable({
  providedIn: 'root',
})
export class NotificationFactory {
  constructor(
    private emailNotification: EmailNotification,
    private smsNotification: SmsNotification
  ) {}

  createNotification(type: string): Notification {
    if (type === 'email') {
      return this.emailNotification;
    } else if (type === 'sms') {
      return this.smsNotification;
    } else {
      throw new Error('Unknown notification type');
    }
  }
}

اکنون ، در مؤلفه خود می توانید از کارخانه مثل این:

// src/app/notification/notification.component.ts
import { Component } from '@angular/core';
import { NotificationFactory } from '../notification.factory';
import { Notification } from '../notification.interface';

@Component({
  selector: 'app-notification',
  template: `
    
    Send Email
    Send SMS
  `,
})
export class NotificationComponent {
  constructor(private notificationFactory: NotificationFactory) {}

  send(type: string) {
    const notification: Notification = this.notificationFactory.createNotification(type);
    notification.send(`This is a ${type} notification!`);
  }
}

4. الگوی استراتژی

الگوی استراتژی معامله با رفتارها (الگوریتم ها) و نحوه استفاده از آنها.

الگوهای استراتژی هنگامی که شما نیاز به جابجایی بین الگوریتم های مختلف یا ویژگی های مختلف بر اساس متن دارید ، مفید هستند.

نمونه

این سرویس به صورت پویا روش پرداخت را بر اساس انتخاب کاربر انتخاب می کند.

@Injectable({
  providedIn: 'root',
})
export class PaymentService {
  constructor(private paypalPayment: PayPalPayment, private creditCardPayment: CreditCardPayment) {}

  processPayment(method: 'paypal' | 'creditcard', amount: number): string {
    if (method === 'paypal') {
      return this.paypalPayment.processPayment(amount);
    } else {
      return this.creditCardPayment.processPayment(amount);
    }
  }
}

الگوهای طراحی از نظر مقیاس پذیری ، قابلیت حفظ ، قابلیت آزمایش و قابلیت استفاده مجدد کد مزایای اساسی دارند. در زاویه ای ، استفاده از الگوهای مانند Singleton ، نمای ، کارخانه و استراتژی به شما در ساخت برنامه هایی کمک می کند که مدیریت و گسترش آن آسان تر باشد. این الگوهای برای هر برنامه بزرگ یا رو به رشد که در آن کد تمیز ، سازمان یافته و قابل نگهداری در اولویت باشد ، ضروری است.

شیرجه های عمیق من را در → Gumroad بررسی کنید