blob: c55e0e6eef67601f6f897aa4f9e455e5f8c3f127 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
|
---
title: Колбэк-функция
slug: Glossary/Callback_function
tags:
- Callback
- Колбэк-функция
translation_of: Glossary/Callback_function
original_slug: Словарь/функция_обратного_вызова
---
<p>Колбэк-функция (или обратный вызов) - это функция, переданная в другую функцию в качестве аргумента, которая затем вызывается по завершению какого-либо действия.</p>
<p>Вот краткий пример:</p>
<pre class="brush: js">function greeting(name) {
alert('Hello ' + name);
}
function processUserInput(callback) {
var name = prompt('Please enter your name.');
callback(name);
}
processUserInput(greeting);</pre>
<p>Выше приведён пример <a href="/en-US/docs/Glossary/Synchronous">синхронного</a> колбэка, поскольку функция <code>processUserInput</code> выполняется синхронно.</p>
<p>Колбэки часто используются для продолжения выполнения кода после завершения <a href="/ru/docs/%D0%A1%D0%BB%D0%BE%D0%B2%D0%B0%D1%80%D1%8C/Asynchronous">асинхронной</a> операции - они называются асинхронными колбэками.</p>
<pre class="brush: js">async function pageLoader(callback) {
const data = await fetch('/ru/docs/Словарь/функция_обратного_вызова')
callback(data)
}
function onPageLoadingFinished(pageData) {
console.log('Page was sucessfully loaded!')
console.log('Response:')
console.log(pageData)
}
pageLoader(onPageLoadingFinished)
</pre>
<p>Вот ещё один пример асинхронного обратного вызова: <a href="https://github.com/mdn/learning-area/blob/master/javascript/apis/introduction/maps-example.html">maps-example.html</a> (<a href="http://mdn.github.io/learning-area/javascript/apis/introduction/maps-example.html">живой пример</a>). Он использует Google Maps API и Geolocation API для отображения карты текущего местоположения вашего устройства.</p>
<pre class="brush: js">// maps-example.html
// Вызов асинхронной функции getCurrentPosition
// с передачей callback функции принимающей координаты
// в качестве параметра
navigator.geolocation.getCurrentPosition(function(position) {
var latlng = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.TERRAIN,
disableDefaultUI: true
}
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
});
</pre>
<p>Поскольку получение координат устройства из его GPS является асинхронным (мы точно не знаем, когда данные будут возвращены), метод <code>Geolocation.getCurrentPosition()</code> принимает анонимную колбэк-функцию в качестве параметра, которая получает найденные данные координат. Эта функция выполняется только по возвращению данных координат.</p>
<h2 id="Больше_информации"><strong>Больше информации</strong></h2>
<h3 id="Основное"><strong>Основное</strong></h3>
<ul>
<li><a href="https://en.wikipedia.org/wiki/Callback_(computer_programming)">Callback на Wikipedia</a></li>
<li><a href="https://learn.javascript.ru/custom-events">Колбэки и события на компонентах</a></li>
<li><a href="http://callbackhell.ru/">Ад обратных вызовов</a></li>
</ul>
|