Компонентийн бусад амьдралын циклүүдийг судлахын өмнө функционал компонентийг ердийн буюу Component классаас удамшсан компонент болгож суръя. Манай төслийн Car компонент jsx кодийг буцаах ердийн функц хэлбэрийн хэрэгжүүлэлттэй.

C# -д аргад параметрийг утгаар ба холбоосоор дамжуулах гэсэн хоёр арга байдаг.

Параметрийг утгаар дамжуулах

Параметрийг дамжуулах хамгийн энгийн арга бол утгаар нь дамжуулах юм. Энэ бол параметрийг дамжуулах ердийн арга.

void Increment(int n)
{
    n++;
    Console.WriteLine($"Increment аргад дамжуулсан параметрийн утга: {n}");
}

int number = 5;
Console.WriteLine($"Increment аргын өмнөх number хувьсагч: {number}");
Increment(number);
Console.WriteLine($"Increment аргын дараах number хувьсагч: {number}");

Консолийн гаралт

react компонентийн амьдралын циклийн талаар судлая. react компонентийн амьдралын цикл гэдэг нь компонентийн тодорхойлолтын тодорхой үе шатууд юм. Суурь Component класст амьдралын циклийн аргууд тодорхойлогдсон байдаг тул түүнээс удамшсан компонентуудад амьдралын цикл байдагийг сануулъя. Хичээлээр компонентийн инициализац хийгдэх үед түүнд үүсэх амьдралын суурь циклүүдийн талаар авч үзье. Амьдралын циклүүд бүгд react компонентийн инициализацийн тодорхой үеүдэд ашиглаж болох ердийн функцууд байдаг.

Арга утга эсхүл ямар нэгэн үр дүнг буцааж болно. Өмнөх хичээлүүдэд тодорхойлсон аргууд void төрлийн буюу ямар нэгэн утга буцаахгүйгээр тодорхой үйлдлүүдийг хийж байсан. Аргаас утга буцаахдаа return операторийг хэрэглэх бөгөөд операторийн араас буцаах утгыг өгдөг.

return буцаах_утга;

Жишээ нь string төрлийн утга буцаах аргыг тодорхойльё.

string GetMessage()
{
    return "Hello";
}

GetMessage аргын тодорхойлолтод string төрлийг заасан учраас арга мөр буцаах ёстой. Иймээс аргын биед return операторийг ашиглаад араас нь буцаах мөрийг заасан.

class түлхүүр үгээр үүсгэгддэг react компонентод байдаг бас нэгэн онцлогийг авч үзье. Өмнөх хичээлүүдэд бид App компонентийн төлвийг state обьектоор тодорхойлон ашигласан. react компонентийн төлвийг өөрөөр тодорхойлж болдогийг мэдэж байх хэрэгтэй. Javascript -ийн class түлхүүр үгээр үүсгэсэн класс байгуулагч /constructor/ гэсэн тусгай аргатай байдаг.

Аргууд хичээлд тодорхойлсон SayHello арга

void SayHello()
{
    Console.WriteLine("Hello");
}
 
SayHello(); // Hello

консолд мэдээллийг үзүүлдэг. Арга консолд нэг ижил мэдээлэл үзүүлж байгаа нь түүний сул тал. Аргаас консолд үзүүлэх мэдээллийг түүнд гаднаас дамжуулан динамикаар тодорхойлбол илүү байхаар. C# -д үүнийг параметрүүд ашиглан шийддэг.

Жич: C# хэл ОХП-ийн аргачллалыг бүрэн дэмждэг тул кодийг голдуу классууд дээр суурилан бичдэг. Класс дотор зарлагдсан функцуудийг арга /method/ гэж нэрлэдэг тул ердийн функцийг ч арга гэж нэрлээд байгаа шүү.

Өмнөх хичээлүүдэд бид react -ийг нилээд сайн судлан энгийн төслийг үүсгэн ажлуулж сурсан. Одоо react компонентуудийн талаар цааш гүнзгийрүүлэн судлах цаг болсон. Хичээлээр Component классаас удамшсан класс хэлбэрээр үүсгэгдсэн компонентод параметр дамжуулахыг авч үзье. Үүнийг төслийн App компонент дээр харцгаая. App компонентийг index.js файлд

ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById('root')
);

ReactDOM сангийн render аргаар DOM -д оруулан өгч байгаа.

Хувьсагчид утгыг хадгалдаг бол аргууд тодорхой үйлдлийг хийх командуудын багцыг агуулдаг. Үнэндээ арга гэдэг нь тодорхой үйлдлийг хийх нэрлэгдсэн кодийн блок.
Аргын ерөнхий иодорхойлолт

[модификатор] буцаах_утгын_төрөл аргын_нэр([параметрүүд])
{
    // аргын бие
}

байна. Модификатор, параметрүүд заавал байх албагүй.

react програмд css препроцессорийг /CSS preprocessor/ хэрхэн ашиглах талаар авч үзье. css препроцессор /CSS preprocessor/ гэдэг нь тусгай бичлэгийн дүрмээр бичигдсэн кодоос ердийн css кодийн генераци хийдэг програмууд юм. Sass, Less, PostCss гээд олон тооны препроцессорууд байдаг ба эдгээрийн ихэнх нь css -ийн боломжуудыг нэмэгдүүлэн кодийн удирдагыг сайжруулдаг. react-scripts -ийн 2 -оос дээшхи хувилбарт css препроцессорийг оруулан ирэх ажиллагааг амархан болгон өгсөн. react програмд css препроцессорийг ашиглахын тулд эхлээд препроцессорийг суулгах хэрэгтэй.

Хувьсагч, нөхцөлт бүтэц, цикл, массив ойлголтуудтай танилцсан тул жижиг хэмжээний програмийг зохиох боломжтой болсон. Иймээс массивуудтай ажиллах хэдэн бодлогыг авч үзье.

Санамж. Програмчлалын хэлийг сурахад дадлага чухал үүрэгтэй. Жижиг гэлтгүй асуудлуудыг өөрөө шийдэхээс л дадлагажин код бичиж сурдаг. Эхлэн суралцагсад асуудлыг бэлэн сангууд ашиглан шийдэх гэдэг нь цаашид асуудал үүсгэх үндэс болдог. Хичээлийн жишээнүүдийг бэлэн сан ашиглан маш хурдан шийдэж болох ч чухам ямар ажиллагаануудыг хийсэнг мэдэлгүй өнгөрнө. Өөрөөр хэлбэл кодийн алгоритмийг ойлголгүй ажиллагааг шийднэ гэсэн үг. Ийм аргаар бүх асуудлыг шийдэх боломжгүй гэдэг нь тодорхой. Ер код бичих суурь бол асуудлыг шийдэх алгоритмыг зохиож сурах. Үүнд суралцахгүйгээр код бичиж сурахгүй гэдгийг сануулъя.