2016-02-07 4 views
-1

Так я придумал с основным решением проблемы, которая возвращает массив:объяснить простое обратное ключевое слово

function doubleAll(numbers) { 
      var result = [] 

      numbers.map(function(val, i){ 
      result.push(val*2); 
      }) 

      return result 
    } 

однако официальное решение просто использует двойные обратные Постулаты и я пытаюсь понять порядок операций и то, как он работает.

function doubleAll(numbers) { 
     return numbers.map(function double(num) { 
     return num * 2 
     }) 
    } 

Я отчасти заинтересован в том, что происходит за кулисами, и различия между этими двумя способами это делать.

+0

[RTFM] (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map) –

+1

'.map()' не '.forEach()' , –

ответ

2

карты() метода создает новый массив с результатами вызова предоставленной функцией для каждого элемента в этом массиве.

Таким образом, в вашем примере:

function doubleAll(numbers) {  
     return numbers.map(function double(num) { 
     return num * 2 
     }) //returns array 
} 

и

function doubleAll(numbers) { 
      var result = []; 
      numbers.map(function(val, i){ 
      result.push(val*2); //pushing value into result array 
      }); 
      return result; 
} 

Во втором примере ресурс попусту растрачивать, так как карта возвращает массив, и он никогда не использовал, который все еще может быть достигнуто с помощью forEach метод без потерь ресурс:

function doubleAll(numbers) { 
    var result = []; 
    numbers.forEach(function(val, i){ 
    result.push(val*2); //pushing value into result array 
    }); 
    return result; 
} 

Этот polyfill добавит больше ясности о .map:
Ref от MDN:

// 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

спасибо, что такое полипол и что это показывает мне? – codemonkey

+0

Polyfill - это фрагмент кода (или плагина), который работает так, как будто он является частью собственного кода, когда эти функции недоступны. Специально в старых браузерах. –

0

map метод массива будет выполнять обратный вызов по каждому члену массива и возвращает результирующий массив.

function doubleAll(numbers) {  
     return numbers.map(function double(num) { 
     return num * 2 
     }) //returns an array whose members have each been passed to double(num) 
} 

В этом случае doubleAll() возвращает результаты numbers.map(), который представляет собой массив, члены которого были мутировали с помощью функции обратного вызова дважды (NUM).

Смежные вопросы