კონტექსტის მიბმა call მეთოდის საშუალებით JavaScript-ში

ამრიგად, ჩვენ გავერკვიეთ, თუ როგორ მუშაობს რეალურად this. ახლა მოდით განვიხილოთ მეთოდები, რომლებიც საშუალებას გვაძლევს ჯაჭვურად მივუთითოთ, რა კონტექსტში იწვევს ფუნქცია (ანუ ჯაჭვურად ვთქვათ, რას უდრის this).

პირველ მეთოდს, რომელსაც განვიხილავთ, ეწოდება call. მოდით ვნახოთ მისი მუშაობა მაგალითზე. მოდით გვქონდეს ინპუტი:

<input id="elem" value="text">

მოდით მივიღოთ ბმული ამ ინპუთზე და ჩავწეროთ იგი ცვლადში elem:

let elem = document.querySelector('#elem');

მოდით ახლა გავაკეთოთ ფუნქცია func, რომლის შიგნითაც გამოვიტანთ this.value:

function func() {
	console.log(this.value);
}

ჯერ-ჯერობით ჩვენი ფუნქცია არ იცის, რას მიუთითებს this. აი, თუ მას მივბამდით addEventListener-ის საშუალებით, მაშინ კი. მაგრამ ჩვენ ამას არ გავაკეთებთ. ამის ნაცვლად ჩვენ უბრალოდ გამოვიძახებთ ჩვენს ფუნქციას, ვუთხრათ მას, რომ this უნდა იყოს ტოლი elem-ის.

ეს კეთდება ასე: func.call(elem). ეს კოდი ექვივალენტურია ფუნქციის უბრალო გამოძახებისა func ასე: func(), მხოლოდ იმ პირობით, რომ this ტოლია elem-ის.

ასე რომ, call მეთოდის სინტაქსი ასეთია: ფუნქცია.call(ობიექტი). მოდით შევკრიბოთ ყველაფერი ერთად:

let elem = document.querySelector('#elem');

function func() {
	console.log(this.value); // გამოიტანს ინპუთის value-ს
}
func.call(elem);

მოცემულია ფუნქცია:

function func() {
	console.log(this.value);
}

მოცემულია სამი ინპუთი:

<input id="elem1" value="text1">
<input id="elem2" value="text2">
<input id="elem3" value="text3">

call მეთოდის და func ფუნქციის საშუალებით გამოიტანეთ ეკრანზე თითოეული ინპუთის value.