Шинэ аргууд

EcmaScript 6 -гийн зарим обьектуудад шинээр бий болсон аргуудын талаар хичээлд авч үзье.

Обьектыг өргөжүүлэх

Обьектын өргөжүүлэлтийг хийх аргыг

let obj1 = {a: 1};
let obj2 = {b: 2, c: 3};

обьектууд дээр авч үзье. obj1 -ийг obj2 -оор өргөжүүлье гэвэл ES6 -д бий болсон assign аргыг

Object.assign(obj1,obj2);

ашигладаг. Аргад эхний параметрээр өргөжих /target/ обьектыг харин хоёрдахь параметрээр өргөжүүлэх /source/ обьектыг өгнө. Дээрх командын дараа

console.log('Obj1', obj1);
console.log('Obj2', obj2);

obj1 , obj2 обьектууд хэрхэн өөрчлөгдсөнг консолд харвал

гэж харагдана. source буюу obj2 обьект өөрчлөлтгүй харин target буюу obj1 обьект obj2 обьектоор өргөжсөн байгаа. assign аргаар обьектуудыг нэгтгэн шинэ обьектыг

let obj1 = {a: 1};
let obj2 = {b: 2, c: 3};
let obj4 = {d: 2, e: 3};

let obj3 = Object.assign({}, obj1, obj2, obj4);

console.log('Obj1', obj1);
console.log('Obj2', obj2);
console.log('Obj3', obj3);

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

консолд дээрх үр дүнг харуулна. Нэгтгэлд орж буй обьектуудад ямар нэгэн өөрчлөлт орохгүйгээр үр дүнгийн обьектод аргад өгсөн бүх обьектууд нэгдэн орсон байгаа.

Массивын аргууд

Массивт бий болсон find буюу хайлт хийдэг аргыг

let findedItem = [1, 2, 3, 4].find(x => x>2);
console.log(findedItem);

жишээгээр харцгаая. find арга [1, 2, 3, 4] массиваас 2 -оос их утгатай элементийг хайна гэдгийг ES6 -гийн сумаар тодорхойлогдох x => x>2 функцээр өгсөн. Хуудсаа шинэчилбэл консолд

үр дүнг харуулна. find арга нөхцөлд тохирсон эхний утгыг буцааж байгаад анхаарна уу.

Мөрийн аргууд

Мөр төрлийн өгөгдөлд шинээр бий аргуудтай

let str = 'Hello!';

console.log('Repeat:', str.repeat(3));
console.log('StartsWith:', str.startsWith('Hel'));
console.log('StartsWith:', str.startsWith('Hel', 1));
console.log('Includes:', str.includes('Hel'));
console.log('Includes:', str.includes('Hel', 1));

жишээгээр танилцая. Аргуудын ажиллагаа нэрнээсээ л ойлгомжтой тул тайлбарлах шаардлага байхгүй тул хуудсаа шиэчлээд үр дүнг харвал

гэж харуулна. repeat арга параметрээр өгөгдсөн хэмжээгээр мөрийг олшруулна. startsWith арга параметрээр өгөгдсөн утгаа мөр эхлэж байгааг шалгана. startsWith аргад хоёрдахь параметрээр мөрийн индексийг заавал тухайн индексээс мөр өгөгдсөн утгаар эхлэсэнг шалгана. Иймээс үр дүнд эхний startsWith арга true харин хоёрдахь нь false өгнө. Учир нь эхний аргад индексийг өгөөгүй тулд түүнийг 0 гэж үзээд str мөр Hel гэж эхлэж байгааг шалган true харин хоёрдахь удаад 1 -р индекс буюу ello! г Hel гэж эхлэж байгааг шалган false өгнө. includes аргын ажиллагаа startsWith аргатай ижилхэн боловч арга эхлэж буйг биш агуулж буйг шалгадагаараа ялгаатай.
Хичээлд EcmaScript 6 -д шинээр бий болсон үндсэн аргууд тэдгээрийг ашиглахтай танилцлаа. Аргуудыг ашиглах мэдлэгтэй болсон тул бусад аргуудын талаар та интернетээс судлан мэдэн авахад хүндрэл үүсэхгүй.

Мэдээлэл таалагдсан бол найзуудтайгаа хуваалцаарай.

  Нээгдсэн тоо: 430 Төлбөртэй

Програмийн хэрэглэгч талын интерфейсийг css -ээр хэвжүүлэн ашиглахад эвтэйхэн, ойлгомжтой болгодог. Иймээс энэ хичээлээс react компонентийн элементүүдийг хэрхэн хэвжүүлэх талаар авч үзье. Манай төслийн интерфейс

зурагт үзүүлсэн хэлбэртэй болоод байгаа.

  Нээгдсэн тоо: 846 Төлбөртэй

Javascript дээр бичигдсэн RxJs сан нь програмчлалыг рейктив /reactive/ аргачлалаар боловсруулахад зориулагдсан. RxJs санг ашиглан массив, мөрүүд, тоонууд, промис /promise/, үйл явцууд /event/ гэх мэтийн өгөгдлийн төрлүүдээс гадна дурын синхрон зүйлүүдтэй амархан харьцан ажиллах боломжтой. Стримүүдийг нэгтгэх I хичээлд RxJs санг ашиглан өөр стримүүдийг нэг стримд нэгтгэх аргуудтай танилцаж ба энэ хичээлээр аргуудыг үргэлжлүүлэн авч үзнэ.

concatMap арга

Арга mergeMap аргатай тун адилхан. Аргыг ажиллагааг

Rx.Observable.range(1, 5)
    .concatMap((x, i) => {
        return Rx.Observable.interval(100)
            .take(x)
            .map(c => i)
    })
    .subscribe(createSubscribe('concatMap'));

кодоос харцгаая.

  Нээгдсэн тоо: 580 Бүртгүүлэх

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

  Нээгдсэн тоо: 1134 Төлбөртэй

Програмчлалын хэлүүдийг хамгийн сайн, хүчирхэг гэх мэтээр рейтенг гарган сургалтад ашиглах гээд байх шиг харагддаг. Эрэлт өндөртэй хэлүүдийг сургалтын суурь болгон ашиглах ёстой. Гэхдээ юунаас эхлэх, ямар програмаар яван хир бэлтгэгдсэн мэрэгжилтэн гаргах төлөвлөгөөтэй байхгүй бусдын жишгээр эсхүл моод хөөцөлдвөл ямарч чадваргүй мэргэжилтэнээр л дүүрэх байх. Гол анхаарах зүйл бол ямар хэлийг эзэмшсэн мэрэгжилтэн өндөр эрэлттэй, цалин хөлс сайтай, ирээдүйтэй вэ гэдгийг л сайн ажиглаж байх хэрэгтэй. Сүүлийн жилүүдэд програм зохиох технологид олон зүйлүүд шинээр орон ирснээр frontend програм зохиогчидын эрэлт тасралтгүй нэмэгдсээр байгаа. Энэ бол та javascript хэлийг судлах ёстойг зааж буй чиг. Иймээс сайтын javascript хэлний хичээлүүдийг үзэхийг санал болгоё.

Хуудас дээрх формоос хэрэглэгч жагсаалтаас сонголт хийн ажиллах тохиолдол олон. Иймээс энэ хичээлээр формын бас нэгэн чухал элемент болох сонголтын select тегийг

<template>
  <div>
    <h2>Form inputs</h2>
    <select>
      <option v-for="s in socialsList"> {{ s }}</option>
    </select>
  </div>
</template>

<script>
export default {
  data () {
    return {
      socialsList: ['instagram', 'twitter', 'facebook']
    }
  }
}
</script>

жишээгээр авч үзье.

Үйл явдал /event/ тодорхой үйлдэл хийгдсэн талаар системд мэдэгддэг. Хэрвээ бид энэхүү үйлдлийг ажиглах хэрэгтэй бол яг энд…

Нээгдсэн тоо : 361

 

Манай төсөл олон хуудсуудтай болон тэдгээрийн хооронд динамикаар шилжилт хийж байгаа ч тухайн үед шилжилт хийгдсэн хуудаст тохирох…

Нээгдсэн тоо : 452

 

Зочин (Visitor) паттерн классуудыг өөрчлөхгүйгээр тэдгээрийн обьектуудын үйлдлийг тодорхойлох боломжийг олгоно. Зочин хэвийг ашиглахдаа классуудын хоёр ангилалыг тодорхойлно.…

Нээгдсэн тоо : 432

 

Лямбда-илэрхийлэл нь нэргүй аргын хураангуй бичилтийг илэрхийлнэ. Лямбда-илэрхийлэл утга буцаадаг, буцаасан утгыг өөр аргын…

Нээгдсэн тоо : 502

 

Кодийн сайжруулалт /рефакторинг/ хичээлээр програмийн кодоо react -ийн зарчимд нийцүүлэн компонентод салгасан.…

Нээгдсэн тоо : 573

 

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

Нээгдсэн тоо : 566

 

Делегаттай нэргүй арга нягт холбоотой. Нэргүй аргуудыг делегатийн хувийг үүсгэхэд ашигладаг.
Нэргүй аргуудын тодорхойлолт delegate түлхүүр үгээр…

Нээгдсэн тоо : 707

 

Математикт харилцан урвуу тоонууд гэж бий. Ямар нэгэн тооны урвуу тоог олохдоо тухайн тоог сөрөг нэг зэрэг дэвшүүлээд…

Нээгдсэн тоо : 840

 

Төсөлд react-router-dom санг оруулан чиглүүлэгчдийг бүртгүүлэн тохируулсан Санг суулган тохируулах хичээлээр бид хуудас…

Нээгдсэн тоо : 835

 
Энэ долоо хоногт

тэгшитгэлийн нэг язгуур нь эерэг, нөгөө язгуур нь сөрөг байх параметрийн бүх утгыг ол.
Тэнцэтгэл бишийн нэг шийд нь M -ээс бага нөгөө шийд нь M -ээс их байх гарцаагүй ба хүрэлцээтэй нөхцөлийг ашиглавал болох бөгөөд энэ тэнцэтгэл бишийг бодвол үед манай тэнцэтгэл бишийн шийдийн нэг нь эерэг нөгөө нь сөрөг байна.

Нээгдсэн тоо : 1579

 

функц [1;9] завсарын аль хэсэгт буурах вэ?

Нээгдсэн тоо : 689

 

функцийн хамгийн бага утгыг ол.

Нээгдсэн тоо : 767