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:

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