JavaScript дахь функцуудыг тодорхойлох. Барилгачид болон шинэ

Функц нь үйлдэл хийх эсвэл утгыг буцаадаг кодын блок юм. Функцууд нь дахин ашиглах боломжтой тусгай код юм; Тиймээс функцүүдийн ачаар програмууд модульчлагдсан, илүү бүтээмжтэй болдог.

Энэхүү заавар нь JavaScript дээр функцийг тодорхойлох, дуудах, функцийн параметрүүдийг ашиглах хэд хэдэн аргыг санал болгодог.

Функцийн тодорхойлолт

Функцуудыг функцийн түлхүүр үг ашиглан тодорхойлсон эсвэл зарладаг. JavaScript дахь функцийн синтакс дараах байдалтай байна.

функцын нэрOfFunction() (
// Гүйцэтгэх код
}

Функцийн зарлал нь функцийн нэрээр дараа нь функц гэсэн түлхүүр үгээр эхэлдэг. Функцийн нэр нь хувьсагчийн нэртэй ижил дүрмийг баримталдаг: үсэг, тоо, доогуур зураас, долларын тэмдэг агуулсан байж болох бөгөөд ихэвчлэн тэмээний үсгээр бичдэг. Нэрийн араас нэмэлт параметрүүдэд ашиглаж болох хаалтны багц байна. Функцийн код нь for эсвэл if хэллэг гэх мэт буржгар хаалтанд агуулагддаг.

Таны анзаарсанчлан нэрийн параметрийн утгыг кодонд өгөөгүй бөгөөд энэ нь функцийг дуудах үед хийгддэг. Функцийг дуудах үед хэрэглэгчийн нэрийг аргумент болгон дамжуулдаг. Аргумент нь функцэд дамжуулагдсан бодит утга юм (энэ тохиолдолд хэрэглэгчийн нэр, жишээ нь 8host).

// "8host"-той мэндчилгээний функцийг аргумент болгон дуудна
мэндлэх("8 хост");

8host утгыг нэр параметрээр дамжуулан функцэд дамжуулдаг. Одоо нэрийн параметр нь энэ функцэд энэ утгыг илэрхийлэх болно. greetUser.js файлын код дараах байдалтай байна.

// Захиалгат мэндчилгээний функцийг эхлүүлэх
мэндлэх функц (нэр) (
console.log(`Сайн уу, $(нэр)!`);
}
// "8host"-той мэндчилгээний функцийг аргумент болгон дуудна
мэндлэх("8 хост");

Энэ програмыг ажиллуулах үед та дараах үр дүнг авах болно.

Одоо та функцийг хэрхэн дахин ашиглахаа мэддэг болсон.

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

Буцах утгууд

Та функцэд нэгээс олон параметр ашиглаж болно. Та функцэд олон утгыг дамжуулж, утгыг буцаах боломжтой. Жишээлбэл, sum.js файл үүсгэж, дотор нь x ба y гэсэн хоёр утгын нийлбэрийг олох функцийг зарлана.

// Нэмэх функцийг эхлүүлэх
функц нэмэх(x, y) (
буцах x + y;
}

нэмэх(9, 7);

Энэ код нь x ба y параметр бүхий функцийг тодорхойлдог. Дараа нь функц 9 ба 7 утгыг авна. Програмыг ажиллуулна уу:

Програм нь 9 ба 7 гэсэн үр дүнгийн утгыг нэмж, 16 үр дүнг буцаана.

Хэзээ хэрэглэх вэ түлхүүр үгбуцах үед функц ажиллахаа больж, илэрхийллийн утгыг буцаана. Энэ тохиолдолд хөтөч нь утгыг консолд харуулах боловч энэ нь консол руу гаргахдаа console.log()-ыг ашиглахтай адил биш юм. Функцийг дуудах үед утгыг хаанаас дуудсан руу гаргана. Энэ утгыг хувьсагчид ашиглаж эсвэл байрлуулж болно.

Функцийн илэрхийллүүд

Өмнөх хэсэгт та хоёр тоог нэмж, үр дүнгийн утгыг буцаадаг функцийг зарласан. Мөн хувьсагчид функц оноож функцийн илэрхийлэл үүсгэж болно.

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

// Нэмэх функцийг нийлбэр тогтмолд онооно
const нийлбэр = функц нэмэх(x, y) (
буцах x + y;
}
// Нийлбэрийг олохын тулд функцийг дуудна
нийлбэр(20, 5);
25

Одоо тогтмол нийлбэр нь функц юм. Энэ илэрхийллийг нэргүй функц болгон хувиргаснаар богиносгож болно (нэрийн параметргүй функцийг ингэж нэрлэдэг). Одоогоор функцийг нэмэх гэж нэрлэдэг боловч функцын илэрхийлэлд нэрийг ихэвчлэн орхигдуулдаг.

// нийлбэр тогтмолт функц оноох
тогтмол нийлбэр = функц (x, y) (
буцах x + y;
}
// Нийлбэрийг олохын тулд функцийг дуудна
нийлбэр(100, 3);
103

Одоо функц нь нэргүй болж, нэргүй болсон.

Нэрлэсэн функцийн илэрхийлэлийг дибаг хийхэд ашиглаж болно.

Сумны функцууд

Өнөөг хүртэл функцуудыг function түлхүүр үгээр тодорхойлж ирсэн. Гэсэн хэдий ч функцийг тодорхойлох шинэ бөгөөд илүү товч арга байдаг - ECMAScript 6 сум функцууд. Сумны функцийг тэнцүү тэмдгээр, дараа нь түүнээс их тэмдгээр илэрхийлнэ: =>.

Сумны функцууд нь үргэлж нэргүй байдаг бөгөөд функцийн илэрхийллийн нэг төрөл юм. Хоёр тооны нийлбэрийг олохын тулд үндсэн сум функцийг үүсгэж үзээрэй.

// Үржүүлэх функцийг тодорхойлно
тогтмол үржүүлэх = (x, y) => (
буцах x * y;
}

үржүүлэх(30, 4);
120

Бичих функцийн оронд та зүгээр л => тэмдэг ашиглаж болно.

Хэрэв функц нь зөвхөн нэг параметртэй бол хашилтыг орхиж болно. Дараах жишээнд функц нь x-ийн квадраттай тул аргумент болгон зөвхөн нэг тоо хэрэгтэй.

// Квадрат функцийг тодорхойлно
тогтмол квадрат = x => (
буцах x * x;
}
// Бүтээгдэхүүнийг олохын тулд функцийг дуудна
квадрат(8);
64

Анхаарна уу: Хэрэв сум функц ямар ч параметргүй бол хоосон хаалт () нэмэх шаардлагатай.

Зөвхөн буцах мэдэгдлээс бүрдэх сумны функцийг богиносгож болно. Хэрэв функц нь зөвхөн нэг буцах шугамаас бүрдэх бол доорх жишээн дээрх шиг буржгар хаалт болон буцах мэдэгдлийг орхиж болно.

// Квадрат функцийг тодорхойлно
const квадрат = x => x * x;
// Бүтээгдэхүүнийг олохын тулд функцийг дуудна
квадрат(10);
100

Дүгнэлт

Энэхүү заавар нь танд функц зарлах, функцийн илэрхийлэл болон сумны функцууд, утгыг буцаах, хувьсагчид функцийн утгыг оноох.

Функц нь утгыг буцаадаг эсвэл үйлдэл хийдэг кодын блок юм.

Шошго:

JavaScript дахь хувьсагч ба тогтмолууд. Хувьсагчдыг зарлаж, тэдэнд утга оноох. Глобал болон орон нутгийн хувьсагчид. Тогтмолуудыг ашиглах

JavaScript дээр хувьсагчдыг зарлах

JavaScript дахь хувьсагчийн нэр нь үсэг, тоо, $ тэмдэг, _ тэмдгээс бүрдэх ба хувьсагчийн нэр нь тоогоор эхэлж болохгүй. JavaScript нь жижиг жижиг том үсгийг мэдэрдэг бөгөөд a1 болон A1 хувьсагч нь өөр хувьсагч гэдгийг санаарай. Хэдийгээр боломжтой ч кирилл үсэг хэрэглэхийг зөвлөдөггүй.
JavaScript дахь хувьсагчдыг var түлхүүр үгээр зарладаг:

Var Peremennaya_1 var Peremennaya_2

JavaScript-д хувьсагчдыг мэдэгдэлгүйгээр ашиглахыг зөвлөдөггүй. Энэ нь боломжтой боловч алдаа гаргахад хүргэж болзошгүй юм.

Хувьсагчдад утга оноох

JavaScript дээр зарласан хувьсагчдад утгыг оноож байна:

Peremennaya_1 = 25 Peremennaya_2 = "Тогтоосон текстийг шулуун хашилтанд оруулсан"

Та мэдэгдлийн дараа шууд хувьсагчид утгыг оноож болно:

Var Peremennaya_1 = 25 var Peremennaya_2 = "Тогтоосон текстийг шулуун хашилтанд оруулсан"

JavaScript дахь хувьсагчийн утга нь програмыг ажиллуулах явцад өөрчлөгдөж болно. Хувьсагч руу текст бичихдээ шууд хашилтанд оруулах ёстой.

Орон нутгийн болон глобал хувьсагчид

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

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

JavaScript дахь тогтмолууд

ТогтмолуудДавхардсан утга эсвэл илэрхийлэл ашиглах шаардлагатай үед кодтой ажиллахад хялбар болгох зорилготой. Тогтмол утгыг нэг удаа тохируулахад хангалттай бөгөөд та үүнийг програмынхаа кодонд оруулан хүссэн хэмжээгээрээ ашиглах боломжтой. JavaScript-д тогтмол тоонуудыг зарлах түлхүүр үг байдаггүй бөгөөд тогтмолуудын оронд тогтмол хувьсагчдыг ашигладаг. Тогтмолыг хувьсагчаас ялгахын тулд тэдгээрийг ихэвчлэн тэмдэглэдэг том үсгээр, шаардлагатай бол доогуур зураас ашиглан:

Var DRUG_CHELOVEKA = "Нохой"

Тогтмол тоонуудын өгөгдсөн жишээ нь бүрэн гүйцэд биш, учир нь "Нохой" гэдэг үгийг санахад хялбар, шаардлагатай газарт оруулах боломжтой. Санахад хэцүү код, тэмдэгтийн багц, урт текст, вэб хаяг, хаяг гэх мэт илүү төвөгтэй утгыг бичиж оруулахын тулд та JavaScript дээр тогтмолуудыг ашиглаж болно. Имэйл, утасны дугаарууд, янз бүрийн коэффициентүүд.

JavaScript дээр тогтмолуудыг хувьсагч болгон дахин бичиж болох боловч хэрэв та үүнийг хийвэл тогтмолуудын утга алдагдана.

Энэ өгүүллээс та хэрхэн тодорхойлох талаар сурах болно const түлхүүр үг ашиглан JavaScript дахь тогтмолууд.

ES6Түлхүүр үг ашиглан тогтмол тоонуудыг зарлах шинэ аргыг санал болгож байна const. Түлхүүр үг constзөвхөн унших боломжтой утгын лавлагаа үүсгэдэг.

Const VARIABLE_NAME = утга;

Зөвшилцлийн дагуу, JavaScript тогтмол танигч нь том үсгээр байна.

Түлхүүр үг constтүлхүүр шиг харагдаж байна зөвшөөрөх гэдэг үгЭнэ нь блокийн хамрах хүрээтэй хувьсагчдыг үүсгэдэг боловч утгууд нь зарлагдсан байдаг const, өөрчлөх боломжгүй.

Түлхүүр үгээр зарласан хувьсагч зөвшөөрөхбайна өөрчлөгдөх боломжтой. Энэ нь та дараах жишээнд үзүүлсэн шиг тэдгээрийн утгыг хүссэн үедээ өөрчлөх боломжтой гэсэн үг юм.

v = 10;
v = 20;
v = v + 5;
console.log(v); // 35

Гэхдээ түлхүүр үгээр үүсгэгдсэн хувьсагчид const, өөрчлөгдөхгүй. Өөрөөр хэлбэл, та тэдгээрийг өөр утгад дахин оноож болохгүй. Тогтмол хувьсагчийг дахин хуваарилахыг оролдох нь төрлийн алдаа гарах болно Төрөл алдаа .

Const TAX = 0.1;
TAX = 0.2 ; //TypeError

Нэмж хэлэхэд, түлхүүр үг ашиглан зарласан хувьсагч const,утгаар нэн даруй эхлүүлэх ёстой. Дараах жишээг дуудаж байна Синтаксийн алдаа(синтаксийн алдаа) тогтмол хувьсагчийг зарлахад эхлүүлэгч байхгүйгээс үүдэлтэй.

Const RED; // Синтаксийн алдаа

Өмнө дурьдсанчлан, түлхүүр үгээр зарласан хувьсагчтай адил зөвшөөрөх, хувьсагчдыг түлхүүр үгээр зарласан const,блок хамрах хүрээтэй.

Энэ бол бүх зүйл, дараагийн өгүүллээр бид түлхүүр үгийг ашиглах талаар ярих болно constобъектын шууд утгуудтай JavaScript.

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

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

Тогтмолууд

Тогтмол гэдэг нь зүгээр л утгын бэлгэдлийн нэр юм. Тогтмол нь утгыг нэрээр нь дурдах боломжийг олгодог бөгөөд энэ нь програм тогтмол тоонуудын нэрийг зааж өгөхөд оронд нь утгыг орлуулдаг гэсэн үг юм. Тогтмолууд нь программыг гүйцэтгэх явцад өөрчлөгдөх ёсгүй өгөгдлийг хадгалахад ашиглагддаг.

Тогтмолыг ашиглахын өмнө үүнийг зарлах ёстой. Тогтмолыг const түлхүүр үгийн дараа тогтмолын нэрийг ашиглан зарлана. Програмын код дахь тогтмолуудыг хувьсагчдаас ялгахын тулд том үсгээр бичсэн тогтмолуудын нэрийг өгөхөөр тохиролцсон.

Const MAX = 10;

Тогтмол үүсгэсний дараа түүнийг хувьсагчаар дахин тодорхойлох оролдлого эсвэл одоо байгаа тогтмолд утга оноохыг оролдох нь алдаа гаргах болно.

Хувьсагч ба тогтмолууд яагаад хэрэгтэй вэ?

Хувьсагч ба тогтмолууд танд тусална програмын кодилүү тодорхой. Жижиг жишээг харцгаая:

Нийт үнэ = 2.42 + 4.33; // Нийт үнэ

Энд байгаа тоонууд нь юуг ч илэрхийлж болно. Энд яг юуг нэгтгэн дүгнэж байгааг тодорхой болгохын тулд 2.42 утгыг candyPrice (эсвэл тогтмол) хувьсагчид (чихрийн үнэ), 4.33-ыг хувьсах (эсвэл тогтмол) тосны үнэд (газрын тосны үнэ) оноож болно.

Нийт үнэ = чихрийн үнэ + тосны үнэ;

Одоо эдгээр үнэ цэнэ нь юу гэсэн үг болохыг санахын оронд скрипт нь цөцгийн тосны үнэ дээр чихрийн үнийг нэмж байгааг харж болно.

Мөн хувьсагч болон тогтмолууд нь скриптийг дибаг хийхэд цаг хэмнэхэд тусалдаг. Хаа сайгүй ижил үсэг ашиглахын оронд та үүнийг скриптийн эхэнд байгаа хувьсагч (эсвэл тогтмол)-д оноож, дараа нь скрипт кодын үлдсэн хэсэгт literal-ийн оронд хувьсагч (эсвэл тогтмол)-ыг ашиглаж болно. Хэрэв дараа нь утгыг өөрчлөх шийдвэр гарвал кодын өөрчлөлтийг хэд хэдэн газар биш, харин хувьсагч (эсвэл тогтмол) -д утгыг оноож өгсөн нэг газар хийх шаардлагатай болно.

Тогтмолуудын хамрах хүрээ

Let түлхүүр үгээр зарласан хувьсагчтай адил дүрэм тогтмолуудад хамаарна:

Const MAX = 5; // Глобал тогтмол ( const MAX = 10; // Блок тогтмол console.log(MAX); // 10 ) console.log(MAX); // 5 foo(); // 15 console.log(MAX); // 5 функц foo() ( const MAX = 15; // Орон нутгийн тогтмол console.log(MAX); )

Тогтмол ба лавлагааны төрлүүд

Тогтмолд лавлагааны төрлийн утгыг оноох үед утгын лавлагаа өөрчлөгдөхгүй, утга нь өөрөө өөрчлөгдөх боломжтой хэвээр байна:

Const obj = (a: 5); obj.a = 10; console.log(obj.a); // 10

Зохиогчоос:Магадгүй энэ нь гайхмаар байх болно, гэхдээ JavaScript удаан хугацааны туршид тогтмолуудыг дэмждэггүй байсан. таны скриптийг бүхэлд нь гүйцэтгэх явцад өөрчлөгддөггүй бүртгэгдсэн утгууд. Альтернатив хувилбар байхгүй тохиолдолд ихэнх тогтмолуудыг хувьсагч ашиглан зарласан.

Хувьсагч ашиглан тогтмолыг зарлах жишээ:

var DAYSINWEEK = 7;

var DAYSINWEEK = 7 ;

Энэ нь танд скрипт дэх DAYSINWEEK хувьсагчийн утгыг хүссэн үедээ өөрчлөх боломжийг олгодог тул аюултай бөгөөд боломжгүй юм. Хөгжүүлэгчид JavaScript-ийн ердийн хувьсагчдаас тогтмол хувьсагчийг ялгах олон янзын аргуудыг гаргаж ирсэн бөгөөд хувьсагчдыг ЗӨВХӨН ТОМ ҮСГЭЭР (хамгийн сайн туршлага) нэрлэхээс эхлээд миний дараа ярих шийдлүүд хүртэл. Аз болоход, онд Хамгийн сүүлийн үеийн хувилбар ECMAScript (стандарт болох тодорхойлолт) энэ тогтмолыг нэвтрүүлсэн:

JavaScript. Хурдан эхлэл

const DAYSINWEEK = 7;

const DAYSINWEEK = 7 ;

Одоо DAYSINWEEK-д хувьсагчаар хандах боломжтой, гэхдээ та түүний утгыг хэзээ ч өөрчлөх боломжгүй:

console.log(DAYSINWEEK); > ДОЛОО ХОНОГИЙН 7 ӨДӨР = 8; > алдаа

консол. бүртгэл(DAYSINWEEK);

DAYSINWEEK = 8;

> алдаа

Тогтмолыг зарласны дараа (тогтмолуудыг const түлхүүр үгээр эхлүүлж, дараа нь хувьсагчийг нэрлэх дүрмийн дагуу тогтмол нэр оруулах ёстой) түүний нэр хадгалагдах болно: та DAYSINWEEK хувьсагчийг цаашид нэрлэх боломжгүй бөгөөд ижил нэртэй тогтмол байх болно. , эсвэл эсрэгээр.

const түлхүүр үг байна сайн дэмжлэгорчин үеийн хөтөч дээр: IE11 болон Spartan, Firefox 31+, Opera 12+, Safari 5.1.7+, iOS 7 ба түүнээс дээш хувилбарууд, Chrome 36+-ийн хамт. Гэсэн хэдий ч хэд хэдэн чухал анхааруулга байдаг:

Тогтмолыг дарж бичихийг оролдох үед Chrome нь алдаа харуулахыг дэмждэггүй. Тогтмол утгыг ямар ч тохиолдолд өөрчлөхгүй, гэхдээ туршлагагүй хөгжүүлэгч алдаа гаргаагүй тул шинэ утгыг ашигласан гэж бодож болно.

JavaScript. Хурдан эхлэл

Хэрхэн вэб програм үүсгэх практик жишээгээр JavaScript-ийн үндсийг сур.

Тогтмолууд үүсдэггүй шинэ газар Webkit дээр харагдах байдал. Тэдгээр. тогтмолууд одоогийн хамрах хүрээнээс гадуур харагдах боломжтой.

Firefox 35 ба түүнээс доош хувилбарууд нь const-ийн утгыг шууд өөрчлөх боломжийг олгодог. Үүнийг Firefox 36+ дээр зассан.

Зөвхөн хатуу горимыг ашиглаагүй тохиолдолд л Webkit-тэй холбоотой асуудал гардаг гэдгийг тэмдэглэх нь зүйтэй (энэ талаар цаашдын нийтлэлд хэлэлцэх болно).

Одоо бодит төслүүдэд const түлхүүр үгийг ашиглах боломжтой юу?

Коддоо const түлхүүр үгийг ашиглах эсэх нь хэд хэдэн хүчин зүйлээс шалтгаална: хамгийн чухал зүйл бол таны сайтад зочлогчид ямар хөтчүүдийг ашиглаж байгаа вэ, учир нь const түлхүүр үгийг ашиглах нь IE10 зэрэг хөтчүүдэд алдаа гэж тооцогддог. . Хэрэв та const түлхүүр үгийг хөгжүүлэлтдээ ашиглахыг хүсч байгаа ч бодит төслүүдэд ашиглахад бэлэн биш байгаа бол танд хэд хэдэн сонголт байна:

Сонголт 1: дамжуулагч ашиглах ("шилжүүлэгч")

Transpilers нь нэрнээс нь харахад хөрвүүлэлтийн үед таны кодыг өөр хэл рүү хөрвүүлдэг: энэ тохиолдолд ES6 техникийн хувилбараас (const түлхүүр үгийг нэвтрүүлсэн) ES5 хүртэл. Энэ нь танд илүү олон код бичих боломжийг олгоно шинэ хувилбархэл, гэхдээ бодит төсөл нь илүү өргөн хүрээний хөтөчтэй нийцтэй хувилбарыг ашиглах болно. Эдди Османи зохиосон