Manipulating Context.hy.md

Ֆունկցիայի կանչը՝ հստակորեն նշված կոնտեքստով: call և apply մեթոդների տարբերությունը:

Մենք գիտենք, որ this-ը դա հղում է դեպի օբյեկտ, որի կոնտեքստում կանչվել է մեթոդը՝ կետ օպերատորի միջոցով։ this-ը նաև հղում է դեպի նոր օբյեկտ, եթե այն ստեղծվել է new օպերատորի օգնությամբ՝ կոնստրուկտոր ֆունկցիաների կանչի արդյունքում։ Մենք ծանոթացել ենք նաև ֆունկցիայի շաղկապմանը this-ի հետ՝ ֆունկցիաների bind մեթոդի օգնությամբ։ Այսօր կխոսենք այն մասին, թե ի՞նչպես կանչել ֆունկցիաները՝ հստակորեն նշելով this-ը, այսինքն ի՞նչպես պարտադրել ֆունկցիաներին աշխատել՝ տալով մեր ուզած կոնտեքստը։

Ֆունկցիաների call մեթոդն ունի հետևյալ ընդհանրական սինթաքսը՝

• func.call(context, arg1, arg2, ...)

call մեթոդն աշխատեցնում է func ֆունկցիան՝ context անունով արգումենտին հաղորդելով this-ը, այսինքն այն օբյեկտը՝ որի կոնտեքստում մենք ուզում ենք ֆունկցիան աշխատեցնել։ arg1, arg2 ... argn-ն արդեն անմիջականորեն func ֆունկցիայի արգումենտներն են։ Խճճված ստացվե՞ց, ոչինչ, կդիտարկենք օրինակի վրա, և ամեն ինչ պարզ կլինի։

Ստեղծենք greeting ֆունկցիան, որը որպես արգումենտ կստանա ողջույնի խոսք, և կախված թե որ օբյեկտի կոնտեքստում կկանչենք նրան, alert կանի ողջույն՝ ուղղված տվյալ օբյեկտին։

"use strict";

function greeting(greet) {
  alert(greet + " " + this.firstName + " " + this.lastName);
}

Ֆունկցիայի greet արգումենտը կարող է լինել մարդկանց ողջունելու տարբեր բառեր։ Օրինակ "hi", "hello", "bonjour", "բարև" և այլն։

greeting("hello"); // Uncaught TypeError

Հիմա եթե կանչենք այս ֆունկցիան, կստանանք սխալ, քանի-որ այն չի կանչվում որևէ օբյեկտի կոնտեքստում, հետևաբար this-ն անորոշ է։ Ընդհանրապես մինչև խիստ ռեժիմի ի հայտ գալը՝ ցանցային դիտարկիչների միջավայրում գլոբալ ստեղծված ֆունկցիան սկզբնապես հանդիսանում էր window գլոբալ օբյեկտի մեթոդ, և նրա կանչի ժամանակ this-ը հանդիսանում էր հենց window օբյեկտը։ Խիստ ռեժիմն աշխատում է բոլորովին այլ տրամաբանության մեջ, և գլոբալ ստեղծված ֆունկցիան այլևս կապված չէ գլոբալ օբյեկտի հետ, և նրա this-ի արժեքը undefined է։

Ֆունկցիայի կանչի ժամանակ սխալն առաջանում է հենց այն պահին, երբ ինտերպրետատորը փորձում է «կարդալ» this.firstName-ը։ Քանի-որ this-ը undefined է, այսինքն արժեքի հատուկ պրիմիտիվ տիպ՝ նա ուղղակի չի կարող ունենալ ոչ մի հատկություն, այդ թվում նաև firstName անունով։

Այժմ ստեղծենք երկու տարբեր օբյեկտներ, և փորձենք greeting ֆունկցիան կանչել այդ օբյեկտների կոնտեքստում։

const person1 = {
  firstName: "John",
  lastName: "Smith",
};

const person2 = {
  firstName: "Joseph",
  lastName: "Biden",
};

Ունենք երկու միանման օբյեկտներ, և այժմ ուզում ենք greeting ֆունկցիան կանչել նրանց կոնտեքստում, որպեսզի դիտարկիչի պատուհանում alert արվի ողջույնի խոսք՝ ուղղված այդ օբյեկտներին։ Ենթադրենք ուզում ենք ողջունել "hello" բառով։ Դրա համար կարող ենք օգտագործել ֆունկցիաների ներդրված call մեթոդը։ Վերևում արդեն ծանոթացել ենք այդ մեթոդի օգտագործման ընդհանրական սինթաքսին։ Այսինքն գրում ենք ֆունկցիայի անունը, ապա կետ, հետո call մեթոդը։ call մեթոդին որպես առաջին արգումենտ տալիս ենք this-ը, օրինակ person1-ը, դրանով մենք հասկացնում ենք greeting ֆունկցիային, որ իր ներսում գրված this-ի արժեքը այժմ հանդիսանում է person1 օբյեկտը։ Իսկ որպես հաջորդ արգումենտ, call մեթոդին հաղորդում ենք greeting ֆունկցիայի արգումենտը, մեր պարագայում քանի-որ ուզում ենք ողջույնի խոսքը սկսվի "hello" բառով, ուղղակի տալիս ենք "hello" տեքստը։

greeting.call(person1, "hello"); // hello John Smith

Մենք greeting ֆունկցիային call մեթոդի օգնությամբ կանչեցինք person1 օբյեկտի կոնտեքստում։ Ոչինչ մեզ չի խանգարում նույն greeting ֆունկցիան կանչել նաև person2 օբյեկտի կոնտեքստում՝ ընդ որում մեկ այլ պարամետրով։ Բերեք այս անգամ թող ողջույնի խոսքը սկսվի "hi" բառով։

greeting.call(person2, "hi"); // hi Joseph Biden

apply մեթոդը շատ նման է call մեթոդին։ Միակ տարբերությունն այն է, որ call մեթոդի մեջ մենք ֆունկցիայի արգումենտները տալիս ենք իրարից ստորակետերով բաժանելով, իսկ apply-ի մեջ՝ զանգվածի տեսքով։ Բացի զանգվածից՝ կարելի է նաև տալ զանգվածանման օբյեկտներ՝ այսինքն այնպիսի օբյեկտներ, որոնց հատկությունների բանալիները կարող են փոխակերպվել թվերի` նմանակելով զանգվածների ինդեքսները, և որոնք կունենան length հատկություն՝ որը հստակորեն ցույց կտա օբյեկտի հատկությունների քանակը։ Ի տարբերություն զանգվածների՝ apply մեթոդի մեջ զանգվածանման օբյեկտների օգտագործումը կարող է հասկանալի լինել ոչ բոլոր ցանցային դիտարկիչների, մասնավորապես դեռևս օգտագործվող և բոլորի կողմից «սիրելի» Internet Explorer 9-րդ տարբերակի համար։

greeting.apply(person1, ["bonjour"]); // bonjour John Smith
greeting.apply(person2, ["բարև"]); // բարև Joseph Biden

Այս բոլոր թեմաները այն հիմքն է, որը հասկանալով կարելի է լիարժեք պատկերացնել JavaScript ծրագրավորման լեզվում this-ի վարքագիծը։ Մնացած նյուանսները հեշտությամբ կընկալվեն ժամանակի ընթացքում: