Статьи

ECMAScript.next: Array.from () и Array.of ()


9 июля Брендан Айх
объявил, что Рик Уолдрон прототипировал [1] два новых метода для
ECMAScript.next : Array.from () и Array.of (). Оба метода также полезны в текущем JavaScript.

Array.from ()


Array.from (arrayLike)

преобразует массивоподобный объект в истинный массив. Исходный код:

    // Unary Array.from()
    Array.from = function( arrayish ) {
        return [].slice.call( arrayish );
    };

Пример [1]: преобразование массива-подобного результата DOM в массив.

    var divs = document.querySelectorAll("div");
    Array.from( divs ).forEach(function( node ) {
        console.log( node );
    });

Пояснения:

  • Массив типа объектов: Некоторые объекты в JavaScript являются массив типа , они имеют индексированный доступ и свойство длины как массивы, но ни один из методов массива. Подобные массиву объекты включают в себя специальные переменные аргументы (дающие индексированный доступ ко всем аргументам, которые были переданы функции) и большинство результатов DOM. Отсутствие стандартных методов массива особенно прискорбно в ECMAScript 5, в котором есть такие полезности, как Array.prototype.forEach. Канонический способ преобразования объекта, подобного массиву, в массив можно увидеть выше. Array.from () просто делает эту функцию доступной как встроенный метод.
  • [] как ярлык: [] .foo часто используется как ярлык для Array.prototype.foo. То есть вы получаете доступ к свойству прототипа через экземпляр. Мне не особенно нравится этот ярлык, потому что он менее явный и менее производительный (хотя многие механизмы JavaScript, вероятно, оптимизируют его, чтобы не создавать новый экземпляр). Таким образом, я написал бы этот метод следующим образом:
        Array.from = function(arrayLike) {
            return Array.prototype.slice.call(arrayLike);
        };
    
  • Общие методы: некоторые методы являются общими . Хотя они непосредственно доступны экземплярам своего прототипа, они также могут быть заимствованы другими экземплярами. Чтобы заимствовать универсальный метод, вызывается один из следующих двух методов:
    • Function.prototype.call (thisValue, [arg1], [arg2], …)
    • Function.prototype.apply (thisValue, [arrayWithArguments])

    Экземпляр заимствования является первым аргументом и становится его значением. Общие методы должны быть написаны так, чтобы они требовали, чтобы они имели только минимальный набор методов. Например, большинству универсальных методов массива это нужно только для обеспечения длины и индексированного доступа. Array.prototype.slice является универсальным и позволяет превратить любую часть объекта, подобного массиву, в массив.

    Пример: общий вызов Array.prototype.map () для объекта аргументов в виде массива.

        function prefixHello(prefix) {
            return Array.prototype.map.call(arguments, function(elem) {
                return "Hello "+elem;
            });
        }
    

    Взаимодействие:

        > prefixHello("Jane", "John")
        [ 'Hello Jane', 'Hello John' ]
    

Array.of ()


Array.of ([elem1], [elem2], …)

возвращает elem1, elem2 и т. д. в массиве. Исходный код:

    // Variable arity Array.of()
    Array.of = function() {
        return [].slice.call( arguments );
    };

Пример использования:

    > Array.of("red", "green", "blue")
    [ 'red', 'green', 'blue' ]

Этот метод не нужен очень часто — литералы массива обычно являются лучшим решением. Однако, когда вам нужна функция конструктора (например, чтобы передать ее другой функции) для массивов, этот метод полезен. Этот метод позволяет избежать потенциальной ловушки функции конструктора Array: если она имеет несколько аргументов, она ведет себя как литерал массива. Если он имеет один аргумент, он создает пустой массив заданной длины.

    > new Array(3, 4, 5)
    [ 3, 4, 5 ]
    > new Array(3)
    []

Array.of также гарантирует, что ваши массивы не будут случайно иметь дыры (но я не уверен, что эта функция очень важна).

    > [1,,3]
    [1,,3]
    > Array.of(1,,3)
      Syntax error:
      Array.of(1,,3)
      ...........^

Связанное чтение

  1. Массив лакомство из твиттера рэпа с Дэвидом Херманом [относится к чирикать оборачивание вещей вверх]
  2. Краткая история версий ECMAScript (включая Harmony и ES.next)