Chain of Responsibility O'zbek tilida

Chain of Responsibility pattern (Behavioral pattern, 1-pattern)

Tasavvur qiling, siz kredit olish uchun ariza topshirdingiz. Bu ariza bir necha bosqichdan o‘tadi:

1. Operator sizning hujjatlaringizni tekshiradi. Agar hamma narsa joyida bo‘lsa, u keyingi bosqichga yuboradi.
2. Kredit bo‘limi boshlig‘i kreditni tasdiqlaydi yoki qo‘shimcha tekshiruv uchun o‘z bo‘limiga yuboradi.
3. 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