Створити порожній об’єкт у JavaScript за допомогою {} або нового Object ()?

Існує два різних способи створення порожнього об’єкта в JavaScript:

var objectA = {}
var objectB = new Object()

Чи є якась різниця в тому, як рухається сценарій з ними? Чи є підстави використовувати одне над іншим?

Так само можна створити порожній масив, використовуючи різні синтаксиси:

var arrayA = []
var arrayB = new Array()

Об'єкти

Користі від використання немає new Object();- тоді як ви {};можете зробити ваш код більш компактним та читабельнішим.

Для визначення порожніх об'єктів вони технічно однакові. {}Синтаксис коротше, акуратніше (менш Java-МІГ), і дозволяє миттєво заповнити інлайн - наприклад , так:

var myObject = {
        title:  'Frog',
        url:    '/img/picture.jpg',
        width:  300,
        height: 200
      };

Масиви

Для масивів аналогічно майже немає користі від використання new Array();понад [];- за одним незначним винятком:

var emptyArray = new Array(100);

створює довгий масив 100 елементів з усіма слотами, що містять undefined- що може бути приємним / корисним у певних ситуаціях (наприклад, (new Array(9)).join('Na-Na ') + 'Batman!').

Моя рекомендація

1. Ніколи не використовуйте new Object();- це {};незграбніше і виглядає нерозумно.
2. Завжди використовуйте [];- за винятком випадків, коли вам потрібно швидко створити "порожній" масив із заданою довжиною.

Так, є різниця, вони не однакові. Це правда, що ви отримаєте однакові результати, але двигун працює по-різному для обох. Один з них - це об'єкт буквально, а інший - конструктор, два різні способи створення об’єкта в JavaScript.

var objectA = {} //This is an object literal

var objectB = new Object() //This is the object constructor

У JS все є об'єктом, але вам слід знати про наступну річ за допомогою нового Object (): Він може отримати параметр, і залежно від цього параметра він створить рядок, число або просто порожній об'єкт.

Наприклад:, new Object(1)поверне число. new Object("hello")поверне рядок, це означає, що конструктор об'єктів може делегувати -залежно від параметра- створення об'єкта іншим конструкторам, таким як рядок, число тощо. Це дуже важливо мати на увазі, коли ви керуєте динамічними даними створювати об'єкти ..

Багато авторів рекомендують не використовувати конструктор об'єктів, коли ви можете використовувати певну буквальну позначку замість цього, де ви будете впевнені, що те, що ви створюєте, те, що ви очікуєте мати у своєму коді.

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

У них такий самий кінцевий результат, але я просто додам, що використання синтаксису буквального типу може допомогти звикнути до синтаксису JSON (рядок із синтаксисом синтаксису літерального об’єкта JavaScript), тому може бути корисною практикою .

Ще одне: у вас можуть виникнути тонкі помилки, якщо ви забудете скористатися newоператором. Тож використання літералів допоможе вам уникнути цієї проблеми.

Зрештою, це буде залежати як від ситуації, так і від уподобань.

Синтаксис об'єкта і матричного літералу {} / [] був введений в JavaScript 1.2, тому він недоступний (і призведе до синтаксичної помилки) у версіях Netscape Navigator до 4.0.

Мої пальці все ще за замовчуванням говорять про новий масив (), але я дуже стара людина. На щастя, Netscape 3 - це не веб-переглядач, якому багато людей доводиться вважати сьогодні ...

var objectA = {}

набагато швидше і, на мій досвід, частіше використовується, тому, ймовірно, найкраще прийняти «стандарт» і заощадити набравши текст.

Я вважаю, що він {}був рекомендований в одному з видах Javascript тут, як хороша умова кодування. newнеобхідний для псевдокласичного успадкування. var obj = {};спосіб допомагає нагадати вам , що це не класичний об'єктно - орієнтована мова , а прототіпічного один. Таким чином, єдиний час, який вам дійсно знадобиться, newце коли ви використовуєте функції конструкторів. Наприклад:

var Mammal = function (name) {
  this.name = name;
};

Mammal.prototype.get_name = function () {
  return this.name;
}

Mammal.prototype.says = function() {
  return this.saying || '';
}

Тоді воно використовується так:

var aMammal = new Mammal('Me warm-blooded');
var name = aMammal.get_name();

Ще однією перевагою використання {}в якості протилежності new Objectє те, що ви можете використовувати його для того, щоб робити об'єктивні літерали в стилі JSON.

Продуктивність інстанції масиву

Якщо ви хочете створити масив без довжини:

var arr = []; швидше, ніж var arr = new Array();

Якщо ви хочете створити порожній масив з певною довжиною:

var arr = new Array(x);швидше, ніж var arr = []; arr[x-1] = undefined;

Для орієнтирів натисніть: https://jsfiddle.net/basickarl/ktbbry5b/

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

Це по суті те саме. Використовуйте все, що вам зручніше.

Гаразд , є лише два різних способи зробити те саме! Один називається, object literalа інший - це функція constructor!

Але читайте далі, я хочу поділитися кількома речами:

Використання {}робить ваш код більш читабельним, створюючи примірники Objectчи інші вбудовані функції, які не рекомендується ...

Крім того, функція Object отримує параметри, оскільки це функція, як Object(params)... але {}це чистий спосіб запустити об'єкт в JavaScript ...

Використання об'єктного літералу робить ваш код виглядає набагато чистішим та легшим для читання для інших розробників, і він відповідає кращим практикам роботи в JavaScript ...

Хоча Object in Javascript може бути майже будь-яким, {}лише вказує на об’єкти javascript, для перевірки того, як він працює, зробіть нижче у своєму коді JavaScript або консолі:

var n = new Object(1); //Number {[[PrimitiveValue]]: 1}

Дивно, але це створює число!

var a = new Object([1,2,3]); //[1, 2, 3]

І це створює масив!

var s = new Object('alireza'); //String {0: "a", 1: "l", 2: "i", 3: "r", 4: "e", 5: "z", 6: "a", length: 7, [[PrimitiveValue]]: "alireza"}

і цей дивний результат для String!

Отже, якщо ви створюєте об'єкт, рекомендується використовувати літеральний об'єкт, мати стандартний код і уникати будь-яких аварій з кодом, як вище, а також, {}на мій досвід, краща ефективність використання !