2015-04-26 2 views
1

Я пытаюсь понять, как работает обратный вызов в этом случае.Как предыдущая функция передает свой результат для обратного вызова

Например дал этот код:

var images = jQuery.map((1234567 + '').split(''), function(n) { 
    return '<img src="' + n + '.png" />' 
}) 

анонимная функция передается в качестве обратного вызова но как «п» волшебно получить заселена после каждого разделения ?? Как он передается в n param? Я имею в виду, я бы не стал предполагать, что раскол введет его значение в n ... как он это даже знает?

Давайте возьмем другой пример, но на этот раз, мы явно пропусканием параметров функции обратного вызова

function randomGenerator(min, max, callback) 
{ 
    var myNumber = Math.floor(Math.random() * (max - min + 1)) + min; 
    setTimeout(function() { callback(myNumber); }, 500); 
} 

это довольно прямо вперед, это очевидно, как MyNumber в настоящее время подключен вверх (принят явно) для callback();

Вопрос заключается в том, как он неявно делать это в моем первом примере? Я имею в виду, могу ли я предположить, что карта() имеет чертовски много больше под капотом, чем я знаю? Возможно, мне пришлось бы погрузиться в реализацию Map() в библиотеке jQuery, я думаю ... или есть общие общие знания о том, как неявное присвоение работает в JS?

+0

Мой вопрос по-прежнему на самом деле не отвечает. Мне интересно, как JS делает это под капотом. Как в функции карты JS передается номер параметру обратного вызова. Я имею в виду, что это не может быть волшебством, но как это делается на очень низком уровне? Я не просто воспринимаю вещи по достоинству для этого, поэтому я пытаюсь понять, как он работает в JS. И я уже понимаю, что я посылаю функцию обратного вызова, я это сказал. Я просто не понимаю, насколько магически это связано с номером до n (я думаю, на очень низком уровне JS) – PositiveGuy

+0

Я имею в виду, могу ли я создать свою собственную функцию, которая выполняет обратный вызов, где обратный вызов имеет параметр, и каким-то образом моя первоначальная функция волшебным образом отображает что-то к этому параметру обратного вызова? Я не понимаю, как – PositiveGuy

+0

Я не пытаюсь понять определение функции карты на верхнем уровне, я хочу знать, как JS работает под капотом, чтобы это произошло! – PositiveGuy

ответ

2

Вы указали анонимную функцию с сигнатурой, принимающей параметр «n». Внутренняя функция карты вызывает анонимный объект, предоставляющий конкретный объект для параметра «n». Если u удаляет параметр, который он не будет работать

3

Вот что делает .map() функция. Вызов .split() просто строит массив, по которому будет выполняться итерация .map().

Функция, переданная в .map(), вызывается один раз для каждого элемента массива (первый аргумент). Каждый вызов выполняется с тремя параметрами: значением элемента в массиве; индекс элемента и сам массив. У вашей анонимной функции есть только один аргумент (что является общим), так что это будет значение элемента.

0

указанная функция карты вызывается для каждого элемента массива. Строка - это всего лишь массив символов.

0

Функции - это объекты, подобные любым другим в JavaScript. Вы можете передать их как аргументы другим функциям, тогда другая функция может делать с ней все, что ему нравится.

function do_something_with_two_numbers(something, num1, num2) { 
 
    return something(num1, num2); 
 
} 
 

 
function add(a,b) { return a + b }; 
 
function subtract(a,b) { return a - b }; 
 

 
alert(do_something_with_two_numbers(add, 2, 1)); 
 
alert(do_something_with_two_numbers(subtract, 2, 1));

MDN has a polyfill, который служит полным примером map:

// Production steps of ECMA-262, Edition 5, 15.4.4.19 
// Reference: http://es5.github.io/#x15.4.4.19 
if (!Array.prototype.map) { 

    Array.prototype.map = function(callback, thisArg) { 

    var T, A, k; 

    if (this == null) { 
     throw new TypeError(' this is null or not defined'); 
    } 

    // 1. Let O be the result of calling ToObject passing the |this| 
    // value as the argument. 
    var O = Object(this); 

    // 2. Let lenValue be the result of calling the Get internal 
    // method of O with the argument "length". 
    // 3. Let len be ToUint32(lenValue). 
    var len = O.length >>> 0; 

    // 4. If IsCallable(callback) is false, throw a TypeError exception. 
    // See: http://es5.github.com/#x9.11 
    if (typeof callback !== 'function') { 
     throw new TypeError(callback + ' is not a function'); 
    } 

    // 5. If thisArg was supplied, let T be thisArg; else let T be undefined. 
    if (arguments.length > 1) { 
     T = thisArg; 
    } 

    // 6. Let A be a new array created as if by the expression new Array(len) 
    // where Array is the standard built-in constructor with that name and 
    // len is the value of len. 
    A = new Array(len); 

    // 7. Let k be 0 
    k = 0; 

    // 8. Repeat, while k < len 
    while (k < len) { 

     var kValue, mappedValue; 

     // a. Let Pk be ToString(k). 
     // This is implicit for LHS operands of the in operator 
     // b. Let kPresent be the result of calling the HasProperty internal 
     // method of O with argument Pk. 
     // This step can be combined with c 
     // c. If kPresent is true, then 
     if (k in O) { 

     // i. Let kValue be the result of calling the Get internal 
     // method of O with argument Pk. 
     kValue = O[k]; 

     // ii. Let mappedValue be the result of calling the Call internal 
     //  method of callback with T as the this value and argument 
     //  list containing kValue, k, and O. 
     mappedValue = callback.call(T, kValue, k, O); 

     // iii. Call the DefineOwnProperty internal method of A with arguments 
     // Pk, Property Descriptor 
     // { Value: mappedValue, 
     // Writable: true, 
     // Enumerable: true, 
     // Configurable: true }, 
     // and false. 

     // In browsers that support Object.defineProperty, use the following: 
     // Object.defineProperty(A, k, { 
     // value: mappedValue, 
     // writable: true, 
     // enumerable: true, 
     // configurable: true 
     // }); 

     // For best browser support, use the following: 
     A[k] = mappedValue; 
     } 
     // d. Increase k by 1. 
     k++; 
    } 

    // 9. return A 
    return A; 
    }; 
} 
0

Читать documentation на карту JQuery, в частности ту часть, где он говорит о обратном вызове.

В JavaScript функция может вызываться с любым количеством аргументов, независимо от того, как она была определена.Таким образом, внутри определения jquery.map он вызывает предоставленный обратный вызов n раз, где n - количество элементов в массиве, и в каждом вызове проходит два аргумента, первый из которых является элементом массива в форме объекта, второй - индексом элемента в массиве, который является Integer.

Ваш обратный вызов может иметь технически нулевые аргументы, если вы просто хотите сгенерировать новый массив длины n из функции с нулевым аргументом.

0
var images = jQuery.map((1234567 + '').split(''), function(n) { 
    return '<img src="' + n + '.png" />' 
}) 

У вас есть этот кусок кода: (1234567 + ''). Он преобразует число в строку. Затем split('') просто разделит все цифры в элементах массива. Функция callback вызывается для каждого элемента, а n получает каждое значение в массиве. Характер $.map состоит в том, чтобы сохранить верхнюю часть элементов из исходного массива независимо от возвращаемого обратного вызова. В этом случае у вас будет массив, похожий на ["1","2","3","4","5","6","7"]. После того, как вы запустите карту, вы получите массив изображений

images=[ 
     '<img src="1.png" />', 
     '<img src="2.png" />', 
     '<img src="3.png" />', 
     '<img src="4.png" />', 
     '<img src="5.png" />', 
     '<img src="6.png" />', 
     '<img src="7.png" />' 
    ] 
Смежные вопросы