DEV Community

Cover image for Chain of Responsibility O'zbek tilida
Ismoil Turdaliyev
Ismoil Turdaliyev

Posted on

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
Enter fullscreen mode Exit fullscreen mode

Image of Timescale

🚀 pgai Vectorizer: SQLAlchemy and LiteLLM Make Vector Search Simple

We built pgai Vectorizer to simplify embedding management for AI applications—without needing a separate database or complex infrastructure. Since launch, developers have created over 3,000 vectorizers on Timescale Cloud, with many more self-hosted.

Read more →

Top comments (0)

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more