الگوی ترکیب توابع در جاوا اسکریپت

Summarize this content to 400 words in Persian Lang

const compose = (…fns) => (data) => fns.reduce((acc, fn) => fn(acc), data);
// This is not just a single line of code it is called the functional // composition pattern

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

بگذار در عمق وجودم

سناریو

تصور کنید در حال ساختن یک پلت فرم تجارت الکترونیک جایی که باید یک سری اقدامات را در لیست قیمت محصول پردازش کنید. وظایفی که باید انجام دهید عبارتند از:

فیلتر کنید هر محصولی که زیر 20 دلار است.

10 درصد تخفیف اعمال کنید روی محصولات باقی مانده
را محاسبه کنید قیمت کل از محصولات با تخفیف

شکستن آن:

ما می توانیم این منطق را به سه تابع ساده تقسیم کنیم:

هر تابع یک کار واحد را انجام می دهد و هنگامی که با هم ترکیب شوند (یا “ترکیب”) راه حل نهایی را تشکیل می دهند.

مرحله -1

// Filters out products below $20
const filterByPrice = (products) => products.filter(product => product.price >= 20);

// Applies a 10% discount to each product
const applyDiscount = (products) => products.map(product => ({
…product,
price: product.price * 0.9, // 10% discount
}));

// Sums up the total price of all products
const calculateTotal = (products) => products.reduce((total, product) => total + product.price, 0);

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

هر تابع مسئول بخش خاصی از خط لوله پردازش است. توابع خالص هستند (آنها ورودی را تغییر نمی دهند) و به راحتی قابل ترکیب هستند.

مرحله 2

const compose = (…fns) => (data) => fns.reduce((acc, fn) => fn(acc), data);

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

در اینجا تابع compose یک سری توابع (…fns) می گیرد و تابعی را برمی گرداند که این توابع را از چپ به راست اجرا می کند و نتیجه یک تابع را به عنوان ورودی به تابع بعدی می دهد.

مرحله 3: از تابع ترکیبی استفاده کنید

حالا بیایید یک تابع ترکیبی برای تغییر قیمت محصول ایجاد کنیم و از آن با لیستی از محصولات استفاده کنیم.

const processPrices = compose(
filterByPrice,
applyDiscount,
calculateTotal
);

// Example product list
const products = [
{ id: 1, name: “Laptop”, price: 1000 },
{ id: 2, name: “Mouse”, price: 15 },
{ id: 3, name: “Keyboard”, price: 25 },
{ id: 4, name: “Monitor”, price: 200 }
];

// Process the prices
const totalPrice = processPrices(products);
console.log(totalPrice); // Output: 1102.5

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

توضیح:

فیلتر بر اساس قیمت: ابتدا محصولاتی که کمتر از 20 دلار هستند را فیلتر می کنیم (در این مورد ماوس).
اعمال تخفیف: سپس برای بقیه محصولات (لپ تاپ، کیبورد و مانیتور) 10 درصد تخفیف اعمال می کنیم.
محاسبه کل: در نهایت قیمت محصولات تخفیف خورده را جمع می کنیم تا قیمت کل را بدست آوریم.

این فرآیند در مقایسه با انجام همه کارها در یک عملکرد بزرگ و پیچیده بسیار تمیزتر و قابل نگهداری تر است. هر تابع قابل استفاده مجدد است و درک جریان آسان است.

const compose = (...fns) => (data) => fns.reduce((acc, fn) => fn(acc), data);
// This is not just a single line of code it is called the functional // composition pattern

// Filters out products below $20
const filterByPrice = (products) => products.filter(product => product.price >= 20);

// Applies a 10% discount to each product
const applyDiscount = (products) => products.map(product => ({
  ...product,
  price: product.price * 0.9, // 10% discount
}));

// Sums up the total price of all products
const calculateTotal = (products) => products.reduce((total, product) => total + product.price, 0);

const compose = (...fns) => (data) => fns.reduce((acc, fn) => fn(acc), data);

const processPrices = compose(
  filterByPrice,
  applyDiscount,
  calculateTotal
);

// Example product list
const products = [
  { id: 1, name: "Laptop", price: 1000 },
  { id: 2, name: "Mouse", price: 15 },
  { id: 3, name: "Keyboard", price: 25 },
  { id: 4, name: "Monitor", price: 200 }
];

// Process the prices
const totalPrice = processPrices(products);
console.log(totalPrice); // Output: 1102.5