dev-resources.site
for different kinds of informations.
Chain of Responsibility O'zbek tilida
Published at
12/24/2024
Categories
Author
Ismoil Turdaliyev
Categories
1 categories in total
open
Chain of Responsibility pattern (Behavioral pattern, 1-pattern)
Tasavvur qiling, siz kredit olish uchun ariza topshirdingiz. Bu ariza bir necha bosqichdan o‘tadi:
- Operator sizning hujjatlaringizni tekshiradi. Agar hamma narsa joyida bo‘lsa, u keyingi bosqichga yuboradi.
- Kredit bo‘limi boshlig‘i kreditni tasdiqlaydi yoki qo‘shimcha tekshiruv uchun o‘z bo‘limiga yuboradi.
- Agar masala murakkab bo‘lsa, bosh direktor qaror qabul qiladi.
**Bu jarayonda har bir bo‘g‘in o‘z vazifasini bajaradi va masalani keyingi bo‘g‘inga yuboradi. Agar muammo birinchi bo‘g‘inda hal bo‘lsa, keyingi bo‘g‘inlar jalb qilinmaydi.
**
React va Frontendda Chain of Responsibilit
Bu patternni React’da ishlatishning bir usuli — form validatsiyasi. Har bir qadamda validatsiya qilish, xatolikni aniqlash va kerak bo‘lsa keyingi bosqichga yuborish orqali amalga oshiriladi.
// 1. Validatsiya funksiyalarini aniqlash
const validateRequired = (value, next) => {
if (!value) {
return "Maydon majburiy";
}
return next(value);
};
const validateEmail = (value, next) => {
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
if (!emailRegex.test(value)) {
return "Email noto‘g‘ri formatda";
}
return next(value);
};
const validateLength = (value, next) => {
if (value.length < 5) {
return "Maydon uzunligi kamida 5 ta belgidan iborat bo‘lishi kerak";
}
return next(value);
};
// 2. Chain of Responsibility’ni amalga oshirish
const createValidatorChain = (...validators) => {
return (value) => {
const process = (index, val) => {
if (index >= validators.length) return null;
return validators[index](val, (newVal) => process(index + 1, newVal));
};
return process(0, value);
};
};
// 3. Form validatsiyasi
const validate = createValidatorChain(validateRequired, validateEmail, validateLength);
export default function App() {
const [value, setValue] = React.useState("");
const [error, setError] = React.useState("");
const handleSubmit = () => {
const validationError = validate(value);
if (validationError) {
setError(validationError);
} else {
alert("Form yuborildi!");
}
};
return (
<div style={{ padding: "20px" }}>
<input
type="text"
value={value}
onChange={(e) => setValue(e.target.value)}
placeholder="Emailingizni kiriting"
style={{ padding: "10px", marginBottom: "10px" }}
/>
{error && <p style={{ color: "red" }}>{error}</p>}
<button onClick={handleSubmit}>Yuborish</button>
</div>
);
}```
## Qanday foyda beradi?
• Validatsiya bosqichlarini mustaqil sinflar/funksiyalar sifatida tashkil qilish imkonini beradi.
• Kodni modulli va qayta ishlatish mumkin bo‘lgan holga keltiradi.
• Kengaytirish oson: yangi validatsiya qo‘shish uchun faqat yangi funksiyani yozish va zanjirga qo‘shish kifoya.
🎞 https://www.youtube.com/watch?v=gpSQDpy6Zq4
#DESIGN_PATTERN #CHAIN_OF_RESPONSIBILITY
Articles
6 articles in total
Chain of Responsibility O'zbek tilida
currently reading
Command design pattern 🥷 O'zbek tilida
read article
Iterator design pattern O'zbek tilida
read article
Mediator design pattern O'zbek tilida
read article
Memento Design Pattern O'zbek tilida
read article
Observer Design Pattern O'zbek tilida
read article
Featured ones: