Асуултын хариултыг үзүүлэх компонентийг Хариултын хувилбарууд хичээлээр хэрэгжүүлэхдээ Quiz компонентийн quiz массивт зөвхөн хариулт хэсгийг тодорхойлоод асуултыг ActiveQuiz компонентод статик байдлаар тавин өгсөн байгаа. Одоо сорилгын төлвийн quiz массивийг бүрэн хэмжээний болгох ажиллагааг хийцгээе. quiz массивт асуултыг оруулая. quiz массивт асуултууд обьектуудийн массив хэлбэрээр тодорхойлогдож байгаа тул

  const [quiz, setQuiz] = useState(
    [      
      {
        question: "Дэлхийд хэдэн улс байдаг вэ?",
        answers: [
          { text: "210", id: 1 },
          { text: "190", id: 2 },
          { text: "250", id: 3 },
          { text: "180", id: 4 },
        ],        
      }
    ])

quiz массивийн обьектод question талбарыг нэмээд түүнд асуултыг оруулсан.

Загвар (Prototype) хэв өмнө нь үүсгэсэн загвар обьектоос үндэслэн обьектыг үүсгэх боломжийг олгодог. Өөрөөр хэлбэл хэв обьектуудын хуулбар /клон/ үүсгэх техникийг хэрэгжүүлдэг.

Хэвийг хаана ашиглах

Шинээр үүсгэгдэх обьектын төрлийг програмын ажиллагааны үед динамикаар тодорхойлох хэрэгцээтэй үед

• Классын зэрэгцээ шатлалаас бүтээгдхүүн обьектуудыг үүсгэхийн тулд тусдаа классын үйлдвэрийн шатлалыг үүсгэхийг хүсэхгүй үед. Жишээ нь абстракт үйлдвэр хэвийг ашиглахад үүнийг хийдэг.
• Обьектыг байгуулагчаар үүсгэн, утга олгохоос илүү хувилбар обьектын хуулбарлалт байх үед. Ялангуяа обьект хязгаарлагдмал цөөн тооны боломжит төлөвийг авч болох тохиолдолд.

React сан компонентод суурилан ажилладаг тул асуултын хариултын хувилбаруудыг ActiveQuiz компонентоос салган тусд нь компонент болгоё. Үүний тулд төслийн ActiveQuiz компонентийг хадгалж буй хавтаст AnswersList шинэ хавтсыг үүсгээд түүнд AnswersList.js, AnswersList.module.css файлуудыг үүсгэн өгье.

C# -д ердийн классуудаас гадна абстракт классууд гэж бий. Ийм классууд ямар хэрэгтэй вэ? Классууд тодорхой төрлийн обьект эсхүл биетийн ерөнхий хэвийг голдуу илэрхийлдэг. Жишээ нь машинийг төлөөлөх Car эсхүл хүнийг илэрхийлэх Person гэх мэтээр классуудыг тодорхойлоод эдгээрт тухайн обьектийг тодорхойлох талбар, шинж, аргуудыг оруулан өгч болно. Гэтэл тодорхой дүрслэлгүй зарим нэгэн зүйлүүдийг програмчлалын хэлээр илэрхийлэх хэрэгцээ гардаг. Жишээ нь яг энэ гээд хэлэх геометрийн дүрс бодитоор оршдоггүй. Тойрог, тэгш өнцөгт, квадрат гэж байдаг ч зүгээр дүрс гэж байхгүй. Гэхдээ тойрог, тэгш өнцөгтүүдэд зарим нэгэн ерөнхий зүйлүүд байх бөгөөд энэ нь дүрс юм. Тодорхой биелэлгүй үүнтэй төстэй зүйлүүдийг тодорхойлоход абстракт классууд зориулагдсан.

Програмчлалын c# хэл өргөн боломжтой, обьект хандлагат парадигмийг дэмждэг, том төслүүдийн боловсруулалтад өргөнөөр ашиглагддаг, маш универсал хэл. Хэлийг Microsoft хөгжүүлдэг нь л өөрөө ихийг хэлнэ. Миний бодлоор c# -ийн зарим шийдлүүдийг шууд ойлгоход хүндрэлтэй байдаг нь хэлний хийсвэрлэлттэй холбоотой байдаг болов уу. Хэлний боломжийг сайн судлан мэдэхгүйгээр сайн, хүчирхэг гэсэн утгаар төслийн үндсэн хэлээр ашиглах нь зөв биш шийдэл болов уу. Та c# хэл дээр код бичдэг, бичихээр суралцаж байгаа бол хэлний боломж, бололцоог сайн судлахыг зөвлөе.      

Виртуал аргууд, шинжүүд, Далд арга, шинжүүд хичээлүүдээр суурь классаас өвлөн авсан аргуудын ажиллагааг өөрчлөх нуух, дахин тодорхойлох гэсэн хоёр аргыг үзсэн. Эдгээр аргууд хоорондоо ямар ялгаатайг харцгаая.

Сорилго явуулах төслийн үндсэн хуудсны компонентийг Нүүр хуудас зохиох хичээлд зохиохдоо түүнд локал төлвийг үүсгэн өгсөн. Сорилго нэг эсхүл олон тооны асуултуудыг агуулж байх боломжтой учраас төлвийн массивийн сонгогдсон буюу тухайн үеийн элементүүдийг үзүүлэх компонентийг төслийн components хавтаст үүсгэе. Үүний тулд components хавтаст ActiveQuiz нэртэй хавтас үүсгээд түүнд компонентийн ActiveQuiz.js болон хэвжүүлэлтийн ActiveQuiz.module.js файлуудыг үүсгэн өгөөрэй.

Абстракт үйлдвэр (Abstract Factory) хэв өөр хоорондоо холбоотой тодорхой интерфейстэй обьектуудын бүлгийг тухайн обьектуудын төрлийг заахгүйгээр үүсгэх боломжийг олгодог.

Хэвийг хаана ашиглах

• Систем шинэ обьектын бүрдүүлэгч ба үүсгэх аргаас хамааралгүй байх хэрэгтэй үед
• Үүсгэгдэж буй обьектууд өөр хоорондоо холбоотойн дээр хамтдаа ашиглагдах үед

Виртуал аргууд, шинжүүд хичээлд виртуал аргуудыг тодорхойлох, дахин тодорхойлохыг үзсэн. Суурь классаас өвлөн авсан функцтоналуудыыг өөрчлөх өөр арга бол нуух (shadowing / hiding) юм. Арга, шинжүүдийг нуух нь үнэндээ суурь классийн арга эсхүл шинжүүдтэй нэр, параметрүүдийн багцаар тохирох арга, шинжийг удамшсан класст тодорхойлох юм. Классийн гишүүнийг нуухдаа new түлхүүр үгийг хэрэглэдэг.

Хичээлээр төслийн үндсэн хуудсыг зохиоё. Эхлээд төслийн src хавтаст өөрийн төлөв бүхий төслийн хэмжээнд суурь болох компонентуудийг хадгалах containers хавтасыг үүсгэе. Үүний зэрэгцээ функционал компонентуудийг хадгалах components хавтасыг бас үүсгэн өгье. containers хавтаст Quiz хавтасыг үүсгээд түүнд

Классийн компонентийн код

import React, { Component } from "react";

class Quiz extends Component {
  render() {
    return (
      <div>
        <h3>Сорилго</h3>
      </div>
    );
  }
}

export default Quiz;

Үйлдвэрийн арга (Factory Method) хэв нь ямар нэгэн классын обьектыг үүсгэх интерфейсийг тодорхойлдог. Гэхдээ яг ямар классын обьектыг үүсгэх шийдлийг дэд класс шууд гаргадаг. Өөрөөр хэлбэл суурь класс хүүхэд классуудад обьект үүсгэхийг дамжуулахыг энэхүү хэвээр хийдэг.