Гарчиг[Нуух][Үзүүлэх]
- 1. Үндсэн мэдлэгээ дээшлүүл
- 2. Объект хандалтат стратегийг ашиглах
- 3. Функцийг жижиг байсан ч ашиглах
- 4. ==-ийн оронд ===-г ашиглана
- 5. JSLint ашиглана уу
- 6. Скриптийг хуудасныхаа доод талд байрлуулах ёстой
- 7. Утас хийх хамгийн хурдан арга
- 8. Коддоо тайлбар нэмнэ үү
- 9. Template Literals ашиглана уу
- 10. Давталт ба давталтын хувьд …
- 11. new Object()-ын оронд {}-г ашиглана уу.
- 12. Коддоо let болон const-ыг оруулах талаар бодож үзээрэй
- 13. eval() Сайн санаа биш
- 14. Spread Operator хэрэг болно
- 15. хүлээх ба асинхронгуй болгох
- 16. Javascript дээр include() аргыг ашигла
- 17. Splice ашиглан массиваас зүйлсийг устгана уу
- 18. Arrow функцийг ашиглана уу
- 19. Destructuring-ийн тусламжтайгаар та хувьсагчийн утгыг хурдан өгөх боломжтой
- 20. Хэд хэдэн төсөл хийх
- Дүгнэлт
Хэрэв та вэб хөгжүүлэлтийг сонирхож байсан бол JavaScript-тэй танилцсан байх. Объект хандалтат програмчлалын хэл нь JavaScript юм. Хөгжүүлэгчид үүнийг вэб хуудсуудыг үйлчлүүлэгч талдаа (front end) динамик, интерактив болгоход ашигладаг.
Энэ нь мөн HTML болон CSS-тэй вэб хуудас, вэб програм үүсгэхэд хэрэглэгддэг. Өнөөдөр интернэтэд JavaScript кодгүй вэб хуудас байхгүй. Энэ нь хөгжүүлэгчийн ажлын салшгүй хэсэг болсон.
Үнэндээ энэ нь тогтмол нэмэгдэж байна. Хэдийгээр JavaScript нь вэб хуудсуудыг функцээр хангадаг гэдгээрээ хамгийн сайн танигдсан боловч JavaScript бус орчинд бас ашиглагддаг. Node.js, Apache Couch-DB болон Adobe Acrobat нь эдгээр технологийн жишээ юм. JavaScript-г ажиллуулахын тулд орчин үеийн ихэнх вэб хөтчүүд нь JavaScript-ийг гүйцэтгэх хөдөлгүүртэй байдаг. Хэрэв та амжилттай вэб хөгжүүлэгч болохыг хүсч байвал JavaScript-тэй ажиллах хэрэгтэй болно.
Та өнөөдөр эсвэл маргааш үүнийг шийдэх ёстой. Цаг нь ирэхэд бэлтгэлтэй байхын тулд JavaScript-г яагаад өмнө нь сурч болохгүй гэж?
Энэ бол та энэ хичээлээс суралцах болно. Энэ нь JavaScript-ийг өнгөлж, бусад вэб хөгжүүлэгчдээс хэрхэн нэг алхам урагшлахыг тайлбарладаг.
Эхлээд эхэлье!
1. Үндсэн мэдлэгээ дээшлүүл
Таныг бага наснаасаа сонсож байсан хамгийн энгийн санаа, мэдэгдлээс би яриагаа эхэлье. Үндсэн зарчмуудыг сурч, практикт хэрэгжүүлээрэй. Олон удаа, та логикийг кодчилолоор ашиглах болно, гэхдээ та массивыг зүсэх гэх мэт суурилагдсан функц байгааг мартах болно. Та JavaScript кодыг ажиллуулах үед алдаа гарч болзошгүй бөгөөд үүний үр дүнд олон нэмэлт функц ажиллахаа болино.
Энэ нь нэг хоёр цэг эсвэл урвуу таслалаас үүдэлтэй байж болно. Эдгээр зүйлүүд нь үндсэн зарчмуудыг ойлгоогүйн үр дүнд үүсдэг. Олон удаа нэг программд for, which, do while зэрэг үндсэн давталт ажилладаг. Гогцоонууд нь програмчлалын хамгийн үндсэн бүтцийн нэг юм.
Хэрэв та гогцоо болон бусад үндсэн зарчмуудыг мэдэхгүй бол кодлох нь нэлээд хэцүү бөгөөд тэр ч байтугай пүүст ажиллах боломжтой болно. Шийдлийн нарийн төвөгтэй логик, нэр хүндийг бий болгох бат бөх суурийг бүрдүүлдэг тул үндсэн зарчмуудыг сайтар судлах нь чухал юм.
2. Объект хандалтат стратегийг ашиглах
Объект хандалтат арга нь өнөө үед хамгийн алдартай програмчлалын арга юм. C++ хэлээр эхэлсэн объект хандалтат арга нь түүнээс хойш асар их алдартай болсон. Өнөөдөр бүх үндсэн хэлийг бүтээхэд зөвхөн объект хандалтат програмчлалыг ашигладаг. Объект хандалтат стратеги нь тодорхой объектод чиглэсэн стратеги юм.
Дараа нь тухайн зүйл үндсэн нэгж болно. Дараа нь энэ объектыг хуудсанд суурь болгон шинж чанарууд болон функцуудыг нэмэхэд ашигладаг. Та мөн дээрээс доошоо код үүсгэх уламжлалт аргыг ямар ч функц, объектгүйгээр ашиглаж болно. Энэ нь хэтэрхий өргөн цар хүрээтэй бөгөөд хэзээ ч оролдох ёсгүй. Код боловсруулахдаа функциональ хандлагыг, хэрэв функцийг ашиглаж байгаа бол объектыг ашиглах ёстой.
Тиймээс, эхэндээ өргөн хүрээтэй кодоо объект хандалтат код руу хөрвүүлэхийг хичээж, кодоо үргэлж объект хандалтат загвараар бичээрэй. Та бусдын кодыг судлахдаа объект хандалтат техникийг байнга судалж байх болно. Хэрэв та JavaScript-ийг эзэмшихийг хүсч байвал үүнийг гартаа авах нь дээр.
3. Функцийг жижиг байсан ч ашиглах
Функциональ хандлагаар програмчлах нь гайхалтай арга юм. Яагаад? Энэ нь таны програм хангамжийг хамт ажилладаг боловч бие биенээсээ ялгаатай модулиудад хуваадаг. Ойлгож өгөхийн тулд нэг жишээ хэлье.
Бүхэл тоонуудын язгуурын квадратыг функц ашиглан тооцоолж болно. Үүнийг хийхийн тулд та бүхэл тоонуудын квадратыг гаргаж, дундажийг тооцоолж, дараа нь дундажийн квадрат язгуурыг тооцоолох хэрэгтэй. Үйл явц нь гурван үе шаттай. Үүний үр дүнд бид гурван функцийг ашиглаж болно. Гэхдээ таны харж байгаагаар эдгээр бүх функцууд хоорондоо холбоотой байдаг. Нэгнийх нь гаралтыг нөгөө рүү илгээдэг бөгөөд бид эцсийн үр дүнг хүлээн авдаг.
Олон хүчин зүйл дээр үндэслэн RMS-ийг тооцоолохын тулд гурван функц биш харин нэг функц хэрэгтэй гэж төсөөлье. Эцсийн шийдэл нь таны харж байгаагаар буруу байна. Энэ үед ийм том арга хэмжээнд юу буруу болсныг тодорхойлоход танд нэлээд хэцүү байх болно.
Нөгөө талаар гурван жижиг функцтэй байх нь танд хурдан дүн шинжилгээ хийх боломжийг олгоно. Үүний үр дүнд, функцууд нь даруухан байсан ч тэдгээрийг өөр өөр кодын модулиудыг тодорхойлоход ашиглаарай. Энэ техник нь таныг ид шидийн адил JavaScript мэргэжилтэн болоход тусална.
Одоо зарим JavaScript кодлох зөвлөмжийг харцгаая.
4. ==-ийн оронд ===-г ашиглана
JavaScript дээр тэгш байдлын хоёр төрлийн оператор байдаг: хатуу тэгш байдлын операторууд === ба !==, тэгш байдлын хатуу бус операторууд == ба !=. Харьцуулахдаа яг тэгш байдлыг үргэлж ашиглах нь хамгийн сайн туршлага гэж үздэг. == болон !=-тэй ажиллах үед та өөр өөр төрлүүдтэй ажиллахад асуудалтай тулгарах болно.
Таны харьцуулж буй утгуудын төрлүүд өөр байх үед хатуу бус операторууд үнэ цэнийг нь шахах гэж оролдох бөгөөд энэ нь гэнэтийн үр дүнд хүргэж болзошгүй юм.
5. JSLint ашиглана уу
Дуглас Крокфорд дибаг хийгч JSLint бүтээжээ. Зүгээр л өөрийн скриптийг хайрцагт хийнэ үү, энэ нь ямар ч алдаа, дутагдлыг хурдан сканнердах болно.
JSLint нь JavaScript эх файлыг шалгадаг. Асуудал илэрсэн тохиолдолд тухайн асуудлын тайлбар болон эх сурвалж доторх ойролцоо байрлалтай мессеж илгээдэг. Асуудал нь үргэлж синтаксийн алдаа биш ч гэсэн байнга тохиолддог.
JSLint нь хэв маягийн хэм хэмжээ болон бүтцийн асуудлыг хоёуланг нь судалдаг. Энэ нь таны програм хангамж үнэн зөв гэсэн үг биш юм. Энэ нь асуудлыг илрүүлэхэд туслах өөр нэг хос нүдийг нэмдэг. Скрипт дээр гарахаасаа өмнө JSLint-ээр дамжуулан алдаа гаргаагүй эсэхээ шалгаарай.
6. Скриптийг хуудасныхаа доод талд байрлуулах ёстой
Хэрэглэгчийн гол зорилго бол хуудсыг аль болох хурдан ачаалах явдал юм. Бүрэн файлыг ачаалах хүртэл хөтөч скриптийг үргэлжлүүлэн ачаалах боломжгүй. Үүний үр дүнд хэрэглэгч ахиц дэвшлийг харахын тулд илүү удаан хүлээх хэрэгтэй болно.
Хэрэв танд зөвхөн функцийг хангахад ашигладаг JS файлууд байгаа бол (жишээлбэл, нэг товчлуур дарахад) тэдгээрийг хуудасны доод талд, хаалтын үндсэн шошгоны өмнө байрлуулна уу. Энэ бол маргаангүй хамгийн сайн дадлага юм.
7. Утас хийх хамгийн хурдан арга
Массив эсвэл объектын эргэн тойронд давталт хийх шаардлагатай үед Trusty for loop мэдэгдлийг үргэлж бүү ашигла. Төсөөлөлдөө ашигласнаар даалгаврын хамгийн хурдан шийдлийг олоорой. Би танд тоо авчрахгүй; Та зүгээр л надад итгэх хэрэгтэй болно (эсвэл өөрийгөө туршиж үзээрэй).
Энэ бол хамгийн хурдан техник юм.
8. Коддоо тайлбар нэмнэ үү
Энэ нь эхэндээ утгагүй мэт санагдаж магадгүй, гэхдээ та кодоо аль болох олон удаа тайлбар хийх хэрэгтэй гэж хэлэхэд надад итгээрэй. Хэрэв та хэдэн сарын дараа төсөлдөө буцаж ирээд анхны бодлын үйл явцаа санахгүй байвал яах вэ?
Хэрэв таны кодыг хамтран ажиллагсад тань шинэчлэх шаардлагатай бол яах вэ? Таны кодын чухал хэсгүүдэд үргэлж тайлбар өгөх ёстой.
9. Template Literals ашиглана уу
Давхар эсвэл ганц хашилтаар үүсгэсэн мөрүүдийн хязгаарлалт нь маш олон байдаг. Тэдэнтэй ажиллахад илүү хялбар болгохын тулд та өөрийн зарим мөрийг загварын литералаар сольж болно.
Backtick тэмдэгт (') нь загварын литерал үүсгэхэд ашиглагддаг бөгөөд энэ нь хэд хэдэн давуу талтай. Та тэдгээрийг илэрхийлэл хадгалах эсвэл олон мөрт мөр үүсгэхэд ашиглаж болно.
Таны харж байгаагаар, дан эсвэл давхар хашилтаар бүтээгдсэн ердийн мөрт бичгээс ялгаатай нь бид загвартаа дахин дахин орж гарах шаардлагагүй байсан. Энэ нь бичих алдаа гарах магадлалыг багасгаж, илүү цэвэр код бичих боломжийг бидэнд олгодог.
10. Давталт ба давталтын хувьд …
Давталт нь JavaScript-д дараагийн утгыг дарааллаар нь хадгалдаг объектыг буцаах дараагийн () аргыг хэрэгжүүлдэг объектууд бөгөөд өөр утга үлдсэн эсэхээс хамаарч үнэн эсвэл худал юм. Энэ нь хэрэв та давталтын протоколыг хэрэгжүүлбэл өөрийн давталтын объектуудыг бүтээх боломжтой гэсэн үг юм.
JavaScript-д String, Array, Map гэх мэт суулгасан давталтууд байдаг. Та гогцоонуудыг давтахдаа for … ашиглаж болно. Энгийн for гогцоотой харьцуулахад энэ нь илүү товч бөгөөд алдаа багатай байдаг. Бид массивын бүтэн урт эсвэл одоогийн индексийг for…of давталт ашиглан хянах шаардлагагүй. Үүрлэсэн гогцоонуудыг зохион бүтээхдээ энэ нь кодыг хялбарчлахад тусална.
11. new Object()-ын оронд {}-г ашиглана уу.
JavaScript дээр та янз бүрийн аргаар объект хийж болно. Зурагт үзүүлсэн шиг шинэ бүтээгчийг ашиглах нь илүү уламжлалт арга юм. Нөгөө талаар энэ стратеги нь "муу туршлага" гэж тэмдэглэгдсэн.
Энэ нь хор хөнөөлтэй биш ч бага зэрэг үг хэллэг, өвөрмөц юм. Би үүний оронд объектын шууд утгын техникийг ашиглахыг санал болгож байна.
12. Коддоо let болон const-ыг оруулах талаар бодож үзээрэй
Бид let түлхүүр үгийг ашиглан өөрийн блокийн хэмжээнд хүрээлэгдсэн локал хувьсагчдыг гаргаж болно. Бид const түлхүүр үгийг ашиглан өөрчлөх боломжгүй локал блокийн хамрах хүрээтэй хувьсагчдыг бүтээж болно.
Хувьсагчдыг зарлахдаа боломжтой үед let болон const түлхүүр үгсийг ашиглах талаар бодох хэрэгтэй. const түлхүүр үг нь зөвхөн дахин хуваарилалтыг идэвхгүй болгодог гэдгийг санаарай. Энэ нь хувьсагчийг өөрчлөх боломжгүй болгодоггүй.
13. eval() Сайн санаа биш
Мэдэхгүй хүмүүст зориулсан eval() арга нь бидэнд JavaScript-ийн хөрвүүлэгч рүү хандах боломжийг олгодог. Үндсэндээ бид мөрийн үр дүнг оролт () болгон нийлүүлэхийн тулд eval-г ашиглаж болно.
Энэ нь таны скриптийг мэдэгдэхүйц удаашруулаад зогсохгүй, дамжуулсан текстэд хэт их эрх мэдэл өгдөг тул аюулгүй байдлын чухал ач холбогдолтой юм. Ямар ч байсан үүнээс зайлсхий!
14. Spread Operator хэрэг болно
Танд массив дахь бүх зүйлийг бие даасан элемент болгон өөр функц рүү дамжуулах шаардлагатай байсан уу, эсвэл нэг массивын бүх утгыг нөгөө рүү оруулах шаардлагатай юу? Энэ нь яг л тархалтын оператор (...) бидэнд хүрэх боломжийг олгодог. Энд жишээ үзүүлэв.
15. хүлээх ба асинхронгуй болгох
Үргэлж тодорхой эсвэл далд байдлаар амлалтыг буцаадаг асинхрон түлхүүр үгийг ашиглан асинхрон функцуудыг үүсгэ.
Хүлээж буй түлхүүр үгийг асинхрон функцэд ашиглаж, амлалтуудыг буцааж өгөх хүртэл гүйцэтгэлийг зогсоож болно. Таны асинхрончлолын функцээс гадуур код нь хэвийн ажиллах болно.
16. Javascript дээр include() аргыг ашигла
JavaScript-д include() функц нь мөр нь өгсөн тэмдэгтүүдийг агуулж байгаа эсэхийг эсвэл массив нь заасан элементийг агуулж байгаа эсэхийг тодорхойлдог.
Энэ арга нь мөр эсвэл элемент илэрсэн тохиолдолд үнэнийг буцаана; эс бөгөөс худал буцаана. Strings contain() функц нь том жижиг үсгээр харгалздаг гэдгийг дурдах нь зүйтэй. Хэрэв та ямар ч тохиолдолд мөрийг тааруулахыг хүсвэл эхлээд зорилтот текстийг жижиг үсгээр бичнэ үү.
17. Splice ашиглан массиваас зүйлсийг устгана уу
Массиваас нэг зүйлийг устгахын тулд хөгжүүлэгчид устгах функцийг ашиглаж байгааг би харсан. Устгах арга нь объектыг устгахын оронд тодорхойгүй гэж орлуулдаг тул энэ нь алдаа юм.
JavaScript дахь утгаас хамааран массиваас элементийг устгах хамгийн хялбар арга бол indexOf() функцийг ашиглан массив дахь тухайн утгын индексийн дугаарыг авч, дараа нь уг индексийн утгыг splice() аргаар устгах явдал юм.
18. Arrow функцийг ашиглана уу
Сумны функцууд нь JavaScript-д саяхан нэмэгдсэн өөр нэг чухал функц юм.
Тэд маш их давуу талтай. Эхлээд тэд JavaScript-ийн функциональ хэсгүүдийг илүү үзэмжтэй болгож, бичихэд хялбар болгодог. Гэсэн хэдий ч сумны функцийг ашиглах нь үүнийг илүү ойлгомжтой бөгөөд товч болгодог.
19. Destructuring-ийн тусламжтайгаар та хувьсагчийн утгыг хурдан өгөх боломжтой
Энэ нийтлэлийн эхэнд бид JavaScript дахь тархалтын операторын талаар олж мэдсэн. Бүтцийн өөрчлөлт нь массив дотор агуулагдаж буй өгөгдлүүдийг задалдаг гэдгээрээ бүтцийг устгахтай төстэй юм.
Ялгаа нь эдгээр задлагдаагүй утгуудыг ялгаатай хувьсагчдад оноож болдогт оршино. Синтакс нь массив үүсгэх үед [] товчлолтой ижил байна. Гэхдээ энэ удаад хаалтуудыг томилох операторын зүүн талд байрлуулна. Энд жишээ үзүүлэв.
20. Хэд хэдэн төсөл хийх
Аливаа авъяас нь байнгын дадлага шаарддаг тул чадвараа дээшлүүлж, янз бүрийн програмчлалын хувилбараар туршлага хуримтлуулахын тулд төрөл бүрийн төсөл хэрэгжүүлэхийг хичээгээрэй.
Төсөл дээр ажиллах явцад та хэд хэдэн бэрхшээл, алдаатай тулгарах бөгөөд энэ нь танд шаардлагатай мэдлэгийг өгөх болно. Тиймээс төсөл боловсруулахыг хичээгээрэй, интернетэд танд туслах олон санаа, жишээ бий. Кодоо үргэлжлүүлэн хөгжүүл, тэгвэл таны чадвар сайжирна.
Дүгнэлт
JavaScript шиг компьютерийн хэл сурахад хэцүү байж магадгүй. Хэрэв та сайн програмист болж, анхны ажлаа баталгаажуулна гэж нухацтай бодож байгаа бол эдгээр JavaScript сурах стратеги нь сургалтын үйл явцыг хурдасгахад тусална.
Тогтмол код бичих дадлага хийж, шинэ санаа сурахдаа сайтар тэмдэглэл хөтөлж, өөрт байгаа бүх хэрэгслийг ашигла. Хамгийн гол нь тэнд гарч, хөгжилтэй байх зуураа код бичиж эхлээрэй.
хариу үлдээх