JavaScript бол обьект хандлагатай хэл. Нөхцөл ба циклийн үйлдлүүд гээд хэлний үндсэн бүтцээс бусад бараг бүх боломжууд ямар нэгэн байдлаар обьектыг ашиглан хийгдэнэ. Зарим нэгэн тодорхой шийдлүүдийг жишээ нь HTML, XML гэх мэтийн хуудасны боловсруулалтыг хуудасны обьектын моделыг шууд ашиглах замаар хийдэг бол зарим зорилгод жишээ нь ердийн мөрийн өгөгдлүүдийг String обьектыг ашиглах гэх мэтээр. Обьект энэ бол өгөгдлийн хүнд төрөл. Гэсэн хэдий ч энэ ойлголтыг сайн ойлгохгүйгээр Javascript -ын хүч чадлыг гаргах боломжгүй. Энэ хичээлээр бид JavaScript -ын өгөгдлийн төрлийн нэг болох хэрэглэгчийн обьектын талаар авч үзнэ.

Програмчлалын аль ч хэл дээр програм боловсруулахдаа тодорхой сан, хэрэгслүүдийг ашиглахгүйгээр хийнэ гэсэн ойлголт байхгүй. Javascript хэлний боломжийг илүү үр дүнтэй ашиглах үндсэн арга бол javascript фреймворкийг судлан суралцах явдал. Иймээс сайтад Vuejs фреймворкийн хичээлүүдийг багц болгон нийтэлж байгаатай танилцаарай. Энэ удаад директивт аргумент дамжуулан ашиглахыг авч үзье. Аргумент гэдгийг юу гэж ойлгох вэ? Үүнийг өмнөх хичээлүүдэд ашиглаж сурсан директивийн жишээнээс харцгаая. Жишээ нь бид товч дээр даралт хийх үйл явцын сонсогчийг

<button @click="title = 'New title'">Change title</button>

гэж тавин өгдөг. @ тэмдэгт бол v-on: бичлэгийн хураангуй бичилт гэдгийг сануулъя. Иймээс @click гэдгийг v-on:click гэж бичиж болно. Бичлэгийн тодорхойлох цэгийн араас өгөгдсөн (манай тохиоллдолд click) зүйлийг аргумент гэж нэрлэдэг бөгөөд энэ нь директивт дамжигдан очдог.

useMemo хукийн судалгааг

import React, {useState} from 'react'

function App() {
  const [number, setNumber] = useState(40)
  
  return (
      <div className="container">
        <h1>Тооцоологдох шинж: {number}</h1>
        <button className={'btn btn-success mx-3'} onClick={() => setNumber(prev => prev + 1)}>Нэмэх</button>
        <button className={'btn btn-danger'} onClick={() => setNumber(prev => prev - 1)}>Хасах</button>
      </div>
  );
}

export default App;

код дээр харцгаая. useState -ээр 40 гэсэн анхны утгатай number хувьсагчийг үүсгээд хуудаст h1 гарчигаар number хувьсагчийн утгыг харуулаад Нэмэх, Хасах хоёр товч дээр дарахад setNumber функцээр number хувьсагчийн утгыг өөрчилнө. Кодийг ажлуулбал

хуудас нээгдэнэ.

Хичээлээр ES6 -гийн кодыг ES5 кодоор компиляц хийх талаар авч үзье. Юуны түрүүнд үүнийг ямар учраас хийх хэрэгтэй вэ? гэдгийг тайлбарлая. ES бол EcmaScript -ийн хураангуйлсан бичлэг бөгөөд 6 нь Javascript -ийн хувилбарын дугаар. ES6 гараад удаагүй байгаа ч түүнийг олон хөтөчүүд дэмжин ажилладаг болоод байгаа. Жишээ нь Chrome хөтөч ES6 дээр бичигдсэн кодыг шууд ажиллуулна. Гэвч олон хэрэглэгчид ES6 -г шууд дэмждэггүй хуучин хөтөчүүдийг жишээ нь Internet Explorer, Firefox -ийн хуучин хувилбарыг хэрэглэсээр байгаа. Харин эдгээр хуучин хөтөчүүд ES5 -ийг бүрэн дэмжин ажилладаг тул програмыг бүх хэрэглэгчид ямар нэгэн асуудалгүйгээр ашиглах боломжийг бүрдүүлэх зорилгоор ES6 -гийн кодыг ES5 кодоор компиляц хийх хэрэгцээ бий.