В чем разница между "Array ()" и "[]" при объявлении массива JavaScript? - PullRequest
776 голосов
/ 31 мая 2009

В чем реальная разница между объявлением массива следующим образом:

var myArray = new Array();

и

var myArray = [];

Ответы [ 16 ]

881 голосов
/ 31 мая 2009

Есть разница, но в этом примере нет никакой разницы.

Используя более подробный метод: new Array() имеет одну дополнительную опцию в параметрах: если вы передадите число конструктору, вы получите массив такой длины:

x = new Array(5);
alert(x.length); // 5

Чтобы проиллюстрировать различные способы создания массива:

var a = [],            // these are the same
    b = new Array(),   // a and b are arrays with length 0

    c = ['foo', 'bar'],           // these are the same
    d = new Array('foo', 'bar'),  // c and d are arrays with 2 strings

    // these are different:
    e = [3]             // e.length == 1, e[0] == 3
    f = new Array(3),   // f.length == 3, f[0] == undefined

;

Другое отличие состоит в том, что при использовании new Array() вы можете установить размер массива, который влияет на размер стека. Это может быть полезно, если вы получаете переполнения стека ( Производительность Array.push против Array.unshift ), что происходит, когда размер массива превышает размер стека, и это должно быть воссоздан. Таким образом, на самом деле, в зависимости от варианта использования, может быть увеличение производительности при использовании new Array(), поскольку вы можете предотвратить переполнение.

Как указано в в этом ответе , new Array(5) фактически не добавит пять undefined элементов в массив. Это просто добавляет место для пяти предметов. Имейте в виду, что использование Array таким образом затрудняет использование array.length для расчетов.

756 голосов
/ 13 августа 2009

Разница между созданием массива с неявным массивом и конструктором массива невелика, но важна.

Когда вы создаете массив, используя

var a = [];

Вы говорите интерпретатору создать новый массив времени выполнения. Никакой дополнительной обработки не требуется вообще. Готово.

Если вы используете:

var a = new Array();

Вы говорите интерпретатору, я хочу вызвать конструктор "Array" и сгенерировать объект. Затем он просматривает ваш контекст выполнения, чтобы найти конструктор для вызова, и вызывает его, создавая ваш массив.

Вы можете подумать: «Ну, это совсем не важно. Они одинаковые!». К сожалению, вы не можете этого гарантировать.

Возьмите следующий пример:

function Array() {
    this.is = 'SPARTA';
}

var a = new Array();
var b = [];

alert(a.is);  // => 'SPARTA'
alert(b.is);  // => undefined
a.push('Woa'); // => TypeError: a.push is not a function
b.push('Woa'); // => 1 (OK)

В приведенном выше примере, первый звонок предупредит 'SPARTA', как и следовало ожидать. Второго не будет. В итоге вы увидите неопределенное. Вы также заметите, что b содержит все встроенные функции объекта Array, такие как push, а другие нет.

Хотя вы можете ожидать, что это произойдет, это просто иллюстрирует тот факт, что [] не совпадает с new Array().

Вероятно, лучше всего использовать [], если вы знаете, что хотите просто массив. Я также не предлагаю обходить и переопределять Array ...

75 голосов
/ 10 июня 2017

Существует огромная разница, о которой никто не упоминал.

Вы можете подумать, что new Array(2) эквивалентно [undefined, undefined] раньше, потому что у нас есть

new Array(2).length           // 2
new Array(2)[0] === undefined // true
new Array(2)[1] === undefined // true

НО ЭТО НЕ!

Давайте попробуем map():

[undefined, undefined].map(e => 1)  // [1, 1]
new Array(2).map(e => 1)            // "(2) [undefined × 2]" in Chrome

См? Это другое! Но почему это так?

Согласно ES6 Spec 22.1.1.2, Array(len) создает только новый массив с length, установленным на len, и ничего более. Таким образом, внутри нового массива нет реального элемента.

Хотя функция map() в соответствии со спецификацией 22.1.3.15 сначала проверяет HasProperty, а затем вызывает обратный вызов, но оказывается, что:

new Array(2).hasOwnProperty(0) // false
[undefined, undefined].hasOwnProperty(0) // true

Поэтому нельзя ожидать, что какие-либо итерационные функции будут работать как обычно с массивом, созданным из new Array(len).

Кстати, Safari и Firefox имеют гораздо лучшее выражение для этого:

// Safari
new Array(2)             // [](2)
new Array(2).map(e => 1) // [](2) 
[undefined, undefined]   // [undefined, undefined] (2) 

// Firefox
new Array(2)             // Array [ <2 empty slots> ]
new Array(2).map(e => 1) // Array [ <2 empty slots> ]
[undefined, undefined]   // Array [ undefined, undefined ]

Я уже представил проблему в Chrome, чтобы попросить ее исправить этот запутанный журнал: https://bugs.chromium.org/p/chromium/issues/detail?id=732021

ОБНОВЛЕНИЕ: это уже исправлено. Chrome теперь регистрируется как

new Array(2)             // (2) [empty × 2]
49 голосов
/ 28 июня 2010

Как ни странно, new Array(size) почти в 2 раза быстрее, чем [] в Chrome, и примерно так же в FF и IE (измеряется путем создания и заполнения массива). Это имеет значение, только если вы знаете приблизительный размер массива. Если вы добавите больше элементов, чем указано, увеличение производительности будет потеряно.

Точнее: Array( - это быстрая операция с постоянным временем, которая не выделяет память, тогда как [] - это линейная операция с временем, которая устанавливает тип и значение.

38 голосов
/ 31 мая 2009

Для получения дополнительной информации на следующей странице описано, почему вам никогда не нужно использовать new Array()

Вам никогда не нужно использовать new Object() в JavaScript. Используйте литерал объекта {} вместо. Точно так же не используйте new Array(), использовать литерал массива [] вместо. Массивы в JavaScript работают ничего похожего на массивы в Java, и использование Java-подобного синтаксиса сбить вас с толку.

Не использовать new Number, new String или new Boolean. Эти формы производят ненужные обертки объекта. Просто используйте вместо этого простые литералы.

Также просмотрите комментарии - форма new Array(length) не служит какой-либо полезной цели (по крайней мере, в сегодняшних реализациях JavaScript).

9 голосов
/ 28 июля 2012

Чтобы лучше понять [] и new Array():

> []
  []
> new Array()
  []
> [] == []
  false
> [] === []
  false
> new Array() == new Array()
  false
> new Array() === new Array()
  false
> typeof ([])
  "object"
> typeof (new Array())
  "object"
> [] === new Array()
  false
> [] == new Array()
  false

Приведенный выше результат получен с консоли Google Chrome в Windows 7.

8 голосов
/ 31 мая 2009

Первый - это вызов конструктора объекта по умолчанию. Вы можете использовать его параметры, если хотите.

var array = new Array(5); //initialize with default length 5

Второй дает вам возможность создать не пустой массив:

var array = [1, 2, 3]; // this array will contain numbers 1, 2, 3.
5 голосов
/ 06 мая 2013

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

var test1 = [];
test1.push("value");
test1.push("value2");

var test2 = new Array();
test2.push("value");
test2.push("value2");

alert(test1);
alert(test2);
alert(test1 == test2);
alert(test1.value == test2.value);

Я просто добавил еще одно значение в массивы и сделал четыре предупреждения: Первый и второй должны дать нам значение, хранящееся в каждом массиве, чтобы быть уверенным в значениях. Они вернутся так же! Теперь попробуйте третий, он возвращает ложь, потому что

JS рассматривает test1 как VARIABLE с типом данных массива , а test2 - как OBJECT с функциональностью массива и здесь есть несколько небольших отличий.

Первое различие заключается в том, что когда мы вызываем test1, он вызывает переменную, не задумываясь, он просто возвращает значения, которые хранятся в этой переменной, независимо от ее типа данных! Но когда мы вызываем test2, он вызывает функцию Array () , а затем сохраняет наши значения "Pressed" в своем свойстве "Value" , и то же самое происходит, когда мы предупреждаем test2, он возвращает свойство "Value" объекта массива.

Поэтому, когда мы проверяем, равно ли test1 равным test2, они, конечно, никогда не вернут true, один - функция, а другой - переменная (с типом массива), даже если они имеют одинаковое значение!

Чтобы быть уверенным в этом, попробуйте 4-е предупреждение с добавленным .value; это вернет истину. В этом случае мы сообщаем JS «Независимо от типа контейнера, будь то функция или переменная, сравните значения, хранящиеся в каждом контейнере, и скажите нам, что вы видели!» это именно то, что происходит.

Надеюсь, я четко сформулировал эту идею, и извините за мой плохой английский.

2 голосов
/ 26 мая 2017

Большой разницы нет, они в основном делают одно и то же, но делают это по-разному, но читайте дальше, посмотрите на это утверждение на W3C:

var cars = ["Saab", "Volvo","BMW"];

и

var cars = new Array("Saab", "Volvo", "BMW");

Два приведенных выше примера делают то же самое. Там нет необходимости использовать новый массив ().
Для простоты, читабельности и скорости выполнения используйте первый (метод литерала массива).

Но в то же время создание нового массива с использованием синтаксиса new Array считается плохой практикой:

Избегать нового массива ()

Нет необходимости использовать встроенный в JavaScript конструктор массива новый массив ().
Вместо этого используйте [].
Эти два разных оператора создают новый пустой массив с именем указывает:

var points = new Array();         // Bad
var points = [];                  // Good 

Эти два разных оператора создают новый массив, содержащий 6 Номера:

var points = new Array(40, 100, 1, 5, 25, 10); // Bad    
var points = [40, 100, 1, 5, 25, 10];          // Good

Ключевое слово new только усложняет код. Он также может производить некоторые неожиданные результаты:

var points = new Array(40, 100);  // Creates an array with two elements (40 and 100)

Что если я удалю один из элементов?

var points = new Array(40);       // Creates an array with 40 undefined elements !!!!!

Так что в принципе это не считается лучшей практикой, также есть одно незначительное отличие, вы можете передать длину new Array(length), как это, что также не рекомендуется.

2 голосов
/ 31 августа 2016

Первый - это конструктор объекта по умолчанию call.mossly используется для динамических значений.

var array = new Array(length); //initialize with default length

второй массив используется при создании статических значений

var array = [red, green, blue, yellow, white]; // this array will contain values.
...