Яка різниця між "Array ()" та "[]" при оголошенні масиву JavaScript?

Яка реальна різниця між оголошенням масиву таким:

var myArray = new Array();

і

var myArray = [];

Різниця є, але різниці в цьому прикладі немає.

Використовуючи більш багатослівний метод: 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()ви можете встановити розмір масиву, який впливає на розмір стека. Це може бути корисно, якщо ви отримуєте переповнення стека ( Performance of Array.push vs Array.unshift ). Це те, що відбувається, коли розмір масиву перевищує розмір стека, і його потрібно буде створити заново. Таким чином, насправді, залежно від випадку використання, може бути підвищення продуктивності при використанні, new Array()оскільки ви можете запобігти виникненню переповнення.

Як зазначено у цій відповіді , new Array(5)насправді undefinedдо масиву не буде додано п'ять елементів. Це просто додає місця для п’яти предметів. Майте на увазі, що використання Arrayцього способу ускладнює покладатися на array.lengthрозрахунки.

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

Коли ви створюєте масив, використовуючи

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().

Це, мабуть, найкраще просто використовувати, []якщо ви знаєте, що просто хочете масив. Я також не пропоную обійтись і переосмислити масив ...

Є важлива відмінність, яку жодна відповідь ще не згадала.

Від цього:

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

Ви можете подумати, що new Array(2)це рівнозначно [undefined, undefined], але НЕ!

Давайте спробуємо 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) .

BTW, 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 ]

Я вже надсилав проблему до Chromium і прошу їх виправити цю заплутану друк: https://bugs.chromium.org/p/chromium/isissue/detail?id=732021

ОНОВЛЕННЯ: Це вже виправлено. Зараз Chrome друкується як:

new Array(2)             // (2) [empty × 2]

Як не дивно, new Array(size)це майже в 2 рази швидше, ніж []у Chrome, і приблизно однакове у FF та IE (вимірюється створенням та заповненням масиву). Має значення лише якщо ви знаєте приблизний розмір масиву. Якщо додати більше елементів, ніж задана довжина, збільшення продуктивності втрачається.

Точніше: Array(це швидка операція постійного часу, яка не виділяє ніякої пам'яті, коли []це лінійна операція часу, яка встановлює тип і значення.

Для отримання додаткової інформації на наступній сторінці описано, чому вам ніколи не потрібно користуватисяnew Array()

Ніколи не потрібно використовувати new Object()JavaScript. Використовуйте {} замість цього об'єкт буквально . Аналогічно, не використовуйте new Array(), [] замість цього використовуйте літерал масиву . Масиви в JavaScript не мають нічого подібного до масивів на Java, а використання синтаксису, схожого на Java, вас не бентежить.

Не використовуйте new Number, new Stringабо new Boolean. Ці форми дають непотрібні обгортки об'єктів. Просто замість цього використовуйте прості літерали.

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

Щоб краще зрозуміти []і 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.

Перший - це виклик конструктора об'єктів за замовчуванням. Ви можете використовувати його параметри, якщо хочете.

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

Другий дає можливість створювати не порожній масив:

var array = [1, 2, 3]; // this array will contain numbers 1, 2, 3.

Я можу пояснити більш конкретний спосіб, починаючи з цього прикладу, який базується на гарному Фредріка.

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 як ВАРІАБЛЮЮЮЧИЙ тип масиву даних , і він трактує test2 як ОБ'ЄКТ з функціональністю масиву , і тут є кілька незначних відмінностей.

Перша відмінність полягає в тому, що, коли ми викликаємо test1, вона викликає змінну, не замислюючись, вона просто повертає значення, які зберігаються в цій змінній, не зважаючи на її тип даних! Але, коли ми викликаємо test2, він викликає функцію Array (), а потім він зберігає наші "Pushed" значення у його властивості "Value" , і те ж саме відбувається, коли ми попереджаємо test2, він повертає властивість "Value" об'єкта масиву.

Отже, коли ми перевіряємо, чи є test1 рівним test2, звичайно, вони ніколи не повернуть істину, одна - це функція, а інша - змінна (з типом масиву), навіть якщо вони мають однакове значення!

Щоб переконатися в цьому, спробуйте четверте сповіщення, додавши до нього значення .value; воно повернеться правдою. У цьому випадку ми кажемо JS "Не зважаючи на тип контейнера, будь то функціональний чи змінний, будь ласка, порівняйте значення, які зберігаються в кожному контейнері, і скажіть нам, що ви бачили!" саме так і відбувається.

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

Немає різниці, коли ви ініціалізуєте масив без будь-якої довжини. Так var a = []і те var b = new Array()саме.

Але якщо ви ініціалізуєте масив з довжиною на зразок var b = new Array(1);, він встановить довжину об’єкта масиву на 1. Отже, його еквівалент var b = []; b.length=1;.

Це буде проблематично, коли ви робите array_object.push, він додає елемент після останнього елемента та збільшує довжину.

var b = new Array(1);
b.push("hello world");
console.log(b.length); // print 2

проти

var v = [];
a.push("hello world");
console.log(b.length); // print 1

Перший - це конструктор об'єктів за замовчуванням call.mostly використовується для динамічних значень.

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

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

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

Немає великої різниці, вони в основному роблять те саме, але роблять їх по-різному, але читайте далі, дивіться на це твердження на W3C:

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

і

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

Два вищевказані приклади роблять точно так само. Не потрібно використовувати новий масив ().
Для простоти, читабельності та швидкості виконання використовуйте перший (метод прямого масиву).

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

Уникайте нового масиву ()

Немає необхідності використовувати вбудований конструктор масиву JavaScript новий Array ().
Використовуйте замість [].
Ці два різних оператора створюють новий порожній масив з назвою точок:

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

Нове ключове слово тільки ускладнює код. Це також може призвести до несподіваних результатів:

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)як це, що також не рекомендується.

Різниця використання

var arr = new Array(size);

Або

arr = [];
arr.length = size;

Як було досить обговорено в цьому питанні.

Я хотів би додати питання швидкості - поточний найшвидший спосіб, на google chrome- це другий.

Але зверніть увагу, ці речі, як правило, сильно змінюються з оновленнями. Також час роботи буде відрізнятися між різними браузерами.

Наприклад, другий варіант, про який я згадав, працює на рівні 2 мільйони [оп / секунду] chrome, але якби ви спробували його, mozilla dev.ви отримаєте напрочуд більший показник у 23 мільйони.

У будь-якому разі, я б пропонував вам перевіряти це раз у раз у різних браузерах (і на машинах), використовуючи сайт як такий

Як я знаю різницю і можна знайти шматочок (або інші Funcitons масиву) як code1 й Кодекса2 показати U масив і його екземпляри :

код1:

[].slice; // find slice here
var arr = new Array();
arr.slice // find slice here
Array.prototype.slice // find slice here

code2:

[].__proto__ == Array.prototype; // true
var arr = new Array();
arr.__proto__ == Array.prototype; // true

висновок:

як ви можете бачити []і new Array()створювати новий екземпляр Array. І всі вони отримують функції прототипуArray.prototype

Вони є лише різними примірниками Array.so цим пояснюють, чому [] != []

:)

Я зазнав дивної поведінки, використовуючи [].

У нас є "Класи" моделей з полями, ініціалізованими на деяке значення. Наприклад:

require([
  "dojo/_base/declare",
  "dijit/_WidgetBase",
], function(declare, parser, ready, _WidgetBase){

   declare("MyWidget", [_WidgetBase], {
     field1: [],
     field2: "",
     function1: function(),
     function2: function()
   });    
});

Я виявив, що коли поля ініціалізуються з []тоді, вони поділяться всіма об'єктами Model. Внесення змін до одного впливає на всіх інших.

Це не відбувається, ініціалізуючи їх new Array(). Те саме для ініціалізації об'єктів ( {}проти нових Object())

TBH Я не впевнений, чи це проблема з рамкою, яку ми використовували ( Dojo )

Тут є більше, ніж очі. Більшість інших відповідей правильні, Але ТАКОЖ ..

new Array(n)

• Дозволяє двигуну перерозподіляти місце для nелементів
• Оптимізовано для створення масиву
• Створений масив позначений рідкісним, який має найменш виконані операції з масивом, це тому, що кожен індексний доступ повинен перевіряти межі, бачити, чи існує значення, і ходити по прототипу ланцюга
• Якщо масив позначений рідкісним, немає шляху назад (принаймні, у V8), він завжди буде повільнішим протягом його життя, навіть якщо ви заповнюєте його вмістом (запакований масив) через 1 мс або 2 години пізніше, не має значення

[1, 2, 3] || []

• Створений масив позначений упакованим (якщо ви не використовуєте deleteабо [1,,3]синтаксис)
• Оптимізований для масиву операцій ( for .., forEach, mapі т.д.)
• Двигун повинен перерозподілити простір у міру зростання масиву

Це , ймовірно , це не так для старих браузерів версій / браузерів.

Я знайшов одну різницю між двома конструкціями, які мене дуже важко вкусили.

Скажімо, у мене є:

function MyClass(){
  this.property1=[];
  this.property2=new Array();
};
var MyObject1=new MyClass();
var MyObject2=new MyClass();

У реальному житті, якщо я це роблю:

MyObject1.property1.push('a');
MyObject1.property2.push('b');
MyObject2.property1.push('c');
MyObject2.property2.push('d');

Я закінчую це:

MyObject1.property1=['a','c']
MyObject1.property2=['b']
MyObject2.property1=['a','c']
MyObject2.property2=['d']

Я не знаю, що мовна специфікація говорить, що має відбутися, але якщо я хочу, щоб у моїх об’єктів були унікальні масиви властивостей, я повинен використовувати new Array().

Використання конструктора Array створює новий масив потрібної довжини і заповнює кожен з індексів невизначеним, присвоєний масив змінному створює індекси, для яких ви даєте йому інформацію.