درک روش زنجیر در جاوا اسکریپت: یک نمونه عملی با ماشین حساب

روش زنجیر در JavaScript وقتی چندین روش را در یک شیء در یک خط کد واحد صدا می کنید. هر روش خود شیء را برمی گرداند ، بنابراین می توانید روش بعدی را درست پس از آن “زنجیر” کنید. این باعث می شود کد شما تمیزتر و خواندنی تر شود.
مثال:
// Invoking the below chainable calc function should output the result 20
calculator().add(7).subtract(5).multiply(20).divide(2).getResult();
به جای نوشتن چندین خط برای انجام عملیات ، زنجیر سازی روش به شما امکان می دهد تا آنها را در یک دنباله صاف جمع کنید.
ساخت یک ماشین حساب زنجیره ای در JavaScript
بیایید با ساختن یک ماشین حساب با زنجیره ای ساده در JavaScript ، روش را در عمل زنجیر کنیم. این ماشین حساب به ما امکان می دهد تا عملیات ریاضی مانند افزودن ، تفریق ، ضرب و تقسیم را به روشی تمیز و قابل خواندن زنجیر کنیم.
رویکرد 1: استفاده از کلاس
ما یک کلاس ماشین حساب با عملیات حسابی اساسی ایجاد خواهیم کرد که نمونه (این) را برمی گرداند و باعث می شود زنجیره ای.
class Calculator {
constructor() {
this.result = 0;
}
add(value) {
this.result += value;
return this;
}
subtract(value) {
this.result -= value;
return this;
}
multiply(value) {
this.result *= value;
return this;
}
divide(value) {
if (value === 0) {
return this;
}
this.result /= value;
return this;
}
getResult() {
return this.result;
}
}
آزمایش ماشین حساب
const calc = new Calculator();
const result = calc.add(5).subtract(2).multiply(3).divide(4).getResult();
console.log(result); // Output: 2.25
رویکرد 2: استفاده از توابع
در این روش ، ما توابعی را برای هر عملیاتی ایجاد می کنیم که یک شی را به روز می کند و آن را باز می گرداند ، بنابراین می توانید عملیات را به هم زنجیر کنید. حالت شی در داخل عملکرد نگه داشته می شود.
function calculator() {
let result = 0; // Start with 0
return {
add(value) {
result += value;
return this;
},
subtract(value) {
result -= value;
return this;
},
multiply(value) {
result *= value;
return this;
},
divide(value) {
if (value === 0) {
return this;
}
result /= value;
return this;
},
getResult() {
return result;
}
};
}
// Usage
const result = calculator().add(10).subtract(5).multiply(20).divide(2).getResult();
console.log(result); // Output: 50
موارد استفاده عملی برای زنجیر کردن روش
در اینجا چند نمونه روزمره وجود دارد که در آن زنجیر کردن روش می تواند بسیار مفید باشد.
1. برقراری تماس های API (به عنوان مثال ، با Axios)
زنجیر سازی روش کار با درخواست های API را ساده می کند. به جای رسیدگی به پاسخ ، خطا و مراحل نهایی به طور جداگانه ، می توانید آنها را مانند یک عمل مداوم در کنار هم قرار دهید.
axios.get('/user')
.then(response => {
console.log(response.data);
})
.catch(error => {
console.error(error);
})
.finally(() => {
console.log('Request completed');
});
هر قسمت از این فرآیند زنجیر شده است ، بنابراین نیازی نیست کد خود را با چندین تماس تلفنی به هم بزنید.
2. پرس و جو یک پایگاه داده MongoDB
با استفاده از MongoDB ، می توانید نمایش داده شدگان را با هم زنجیر کنید تا نتایج خود را فیلتر ، مرتب و محدود کنید. این رویکرد به شما امکان می دهد تا به تدریج نمایش داده شدگان خود را بسازید ، قدم به قدم ، و روند کار را صاف و آسان کنید.
const result = await users.find()
.filter({ age: { $gt: 18 } }) // Filter users where age > 18
.sort({ name: 1 }) // Sort by name in ascending order
.limit(10) // Limit results to 10
.toArray(); // Convert the result to an array
شما یک بار یک چیز را اضافه می کنید ، اما همه چیز در یک جریان صاف اتفاق می افتد.
3. دستکاری دام (مانند jQuery)
هنگامی که با DOM کار می کنید ، می توانید چندین عمل را با هم زنجیر کنید تا یک عنصر را در یک حرکت دستکاری کنید. مثل این است که به مرورگر بگویید ، “این کار را انجام دهید ، پس از آن.”
$('#element')
.css('color', 'red')
.fadeIn(500)
.slideUp(300)
.text('Hello, World!');
به جای نوشتن خطوط جداگانه برای هر عمل ، فقط آنها را در کنار هم زنجیر می کنید و کد خود را مختصر تر و خواندنی تر می کنید.
پایان
در این پست ، ما مفهوم را بررسی کرده ایم method chaining
در جاوا اسکریپت و ساخت chainable calculator
برای نشان دادن آن با استفاده از روش زنجیره ای ، ما توانسته ایم چندین عملیات ریاضی را به روشی تمیز و قابل خواندن انجام دهیم و کد را بصری تر کنیم.
زنجیر سازی روش یک ویژگی قدرتمند است که معمولاً در کتابخانه ها و چارچوب های جاوا اسکریپت استفاده می شود. این نه تنها پیچیدگی کد را کاهش می دهد بلکه باعث افزایش خوانایی می شود و درک و حفظ آن را آسان تر می کند.
اگر این پست را مفید پیدا کردید ، احساس راحتی کنید که 👍 ، به اشتراک بگذارید ، و با من در LinkedIn 👥 ارتباط برقرار کنید!