Créer un objet vide en JavaScript avec {} ou un nouvel objet ()?

Il y a deux différents façons de créer un objet vide en JavaScript:

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

Y a-t-il une différence dans la façon dont le moteur de script les gère? Y a-t-il une raison d'utiliser l'un sur l'autre?

De même, il est également possible de créer un tableau vide en utilisant une syntaxe différente:

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

Objets

Il n'y a aucun avantage à utiliser new Object();- alors qu'il {};peut rendre votre code plus compact et plus lisible.

Pour définir des objets vides, ils sont techniquement les mêmes. le{} syntaxe est plus courte, plus nette (moins Java-ish), et vous permet de remplir instantanément l'objet en ligne - comme ceci:

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

Tableaux

Pour les tableaux, il n'y a de même presque aucun avantage à utiliser new Array();Over [];- à une exception près:

var emptyArray = new Array(100);

crée un tableau de 100 éléments avec tous les emplacements contenant undefined- ce qui peut être agréable / utile dans certaines situations (comme (new Array(9)).join('Na-Na ') + 'Batman!').

Ma recommandation

1. N'utilisez jamais new Object();- c'est plus maladroit que {};et semble idiot.
2. Utilisez toujours [];- sauf lorsque vous devez créer rapidement un tableau "vide" avec une longueur prédéfinie.

Oui, il y a une différence, ce ne sont pas les mêmes. Il est vrai que vous obtiendrez les mêmes résultats mais le moteur fonctionne de manière différente pour les deux. L'un d'eux est un objet littéral, et l'autre est un constructeur, deux façons différentes de créer un objet en javascript.

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

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

Dans JS, tout est un objet, mais vous devez être conscient de la chose suivante avec new Object (): il peut recevoir un paramètre, et en fonction de ce paramètre, il créera une chaîne, un nombre ou simplement un objet vide.

Par exemple new Object(1):, renverra un nombre. new Object("hello")retournera une chaîne, cela signifie que le constructeur d'objet peut déléguer - en fonction du paramètre - la création d'objet à d'autres constructeurs comme la chaîne, le nombre, etc ... Il est très important de garder cela à l'esprit lorsque vous gérez des données dynamiques à créer des objets ..

De nombreux auteurs recommandent de ne pas utiliser le constructeur d'objet lorsque vous pouvez utiliser une certaine notation littérale à la place, où vous serez sûr que ce que vous créez est ce que vous attendez d'avoir dans votre code.

Je vous suggère de faire une lecture supplémentaire sur les différences entre la notation littérale et les constructeurs sur javascript pour trouver plus de détails.

Ceux-ci ont le même résultat final, mais j'ajouterais simplement que l'utilisation de la syntaxe littérale peut aider à s'habituer à la syntaxe de JSON (un sous-ensemble de chaînes de syntaxe d'objet littéral JavaScript), il pourrait donc être une bonne pratique d'entrer dans .

Une autre chose: vous pourriez avoir des erreurs subtiles si vous oubliez d'utiliser l' newopérateur. Ainsi, l'utilisation de littéraux vous aidera à éviter ce problème.

En fin de compte, cela dépendra de la situation ainsi que des préférences.

La syntaxe littérale objet et tableau {} / [] a été introduite dans JavaScript 1.2, elle n'est donc pas disponible (et produira une erreur de syntaxe) dans les versions de Netscape Navigator antérieures à 4.0.

Mes doigts par défaut continuent de dire new Array (), mais je suis un très vieil homme. Heureusement, Netscape 3 n'est pas un navigateur que beaucoup de gens doivent considérer aujourd'hui ...

var objectA = {}

est beaucoup plus rapide et, selon mon expérience, plus communément utilisé, il est donc préférable d'adopter le «standard» et d'économiser de la frappe.

Je crois que cela a {}été recommandé dans l'une des vidéos Javascript ici comme une bonne convention de codage. newest nécessaire pour l'héritage pseudoclassique. le var obj = {};chemin permet de vous rappeler qu'il ne s'agit pas d'un langage classique orienté objet mais d'un langage prototypique. Ainsi, le seul moment dont vous auriez vraiment besoin newest lorsque vous utilisez des fonctions constructeurs. Par exemple:

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

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

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

Ensuite, il est utilisé comme suit:

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

Un autre avantage à utiliser {}comme opposé new Objectest que vous pouvez l'utiliser pour faire des littéraux d'objet de style JSON.

Performances d'instanciation de la baie

Si vous souhaitez créer un tableau sans longueur:

var arr = []; est plus rapide que var arr = new Array();

Si vous souhaitez créer un tableau vide d'une certaine longueur:

var arr = new Array(x);est plus rapide que var arr = []; arr[x-1] = undefined;

Pour les repères, cliquez sur ce qui suit: https://jsfiddle.net/basickarl/ktbbry5b/

Je ne connais cependant pas l'empreinte mémoire des deux, je peux imaginer que cela new Array()prend plus de place.

C'est essentiellement la même chose. Utilisez ce que vous trouvez plus pratique.

OK , il n'y a que 2 façons différentes de faire la même chose! L'un appelé object literalet l'autre est une fonction constructor!

Mais lisez la suite, il y a quelques choses que je voudrais partager:

L'utilisation {}rend votre code plus lisible, tout en créant des instances de Objectou d'autres fonctions intégrées non recommandées ...

De plus, la fonction Object obtient des paramètres car c'est une fonction, comme Object(params)... mais {}est un moyen pur de démarrer un objet en JavaScript ...

L'utilisation du littéral objet rend votre code beaucoup plus propre et plus facile à lire pour les autres développeurs et il est conforme aux meilleures pratiques en JavaScript ...

Alors que Object en Javascript peut être presque n'importe quoi, {}ne pointe que vers des objets javascript, pour tester son fonctionnement, faites ci-dessous dans votre code javascript ou votre console:

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

Étonnamment, cela crée un numéro!

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

Et cela crée un tableau!

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

et ce résultat bizarre pour String!

Donc, si vous créez un objet, il est recommandé d'utiliser le littéral objet, d'avoir un code standard et d'éviter tout accident de code comme ci-dessus, également en termes de performances, {}c'est mieux selon mon expérience!