En javascript, lors de la création des propriétés, ce qui est la bonne ou meilleure syntaxe?

StackOverflow https://stackoverflow.com/questions/4735004

  •  12-10-2019
  •  | 
  •  

Question

propriétés (clés) est accessible et réglé en utilisant la notation de points, ainsi que les crochets. des conseils quand utiliser la syntaxe prototype point

var myObj = {};   
myObj.myProp1 = 'value1'; //works, an expando property   
myObj[myProp2] = 'value2'; // FAILS, myProp2 is undefined
myObj["myProp2"] = 'value2'; // works, an expando property
myObj[2010]= 'value'; //note the key is number, still works, an expando property??   
myObj.2010 = 'value'; // FAILS. to use dot notation, key must be a string

myObj.prototype.myProp3 = 'value3' // whats the advantage?
Était-ce utile?

La solution

Lorsque vous utilisez la syntaxe de point, le nom de propery est un identifer:

var myObj = {};
myObj.myProp1 = "value1";
myObj.myProp2 = "value2";

Comme le nom de la propriété doit suivre les règles de dénomination des identifiants, il peut par exemple ne pas commencer par un chiffre.

Lorsque vous utilisez la syntaxe de support, le nom de la propriété est une chaîne:

var myObj = {};
myObj["myProp1"] = "value1";
myObj["myProp2"] = "value2";

Ce qui est utilisé dans les supports peuvent être une variable, ou tout autre type d'expression qui se traduit par une chaîne:

var myObj = {};
var prop1 = "myProp1";
myObj[prop1] = "value1";
myObj["myProp" + 2] = "value2";

Si vous utilisez un numéro comme nom de la propriété, il sera automatiquement converti en une chaîne, de sorte que ceux-ci ont le même résultat:

myObj[2010] = "value";
myObj["2010"] = "value";

Vous pouvez également utiliser un littéral d'objet pour définir les valeurs:

var myObj = { myProp1: "value1", myProp2: "value2" };

(Notez que {} est aussi un littéral d'objet, sans que les propriétés).

Utilisation du prototype d'un objet est seulement utile si vous avez nommé types d'objets (ou autrement affecter un prototype à l'objet). Lorsque vous créez des objets à l'aide d'un objet littéral chaque objet a son propre prototype, donc tout mettre dans le prototype a le même effet que de le mettre dans l'objet.

Autres conseils

L'ajout de la propriété doit être soit myObj.myProp ou myObj["myProp"]. Ceci est le scénario et une bonne pratique idéalement suivi lorsqu'il est utilisé en javascript.

Dans votre cas, myObj.prototype.myProp3 = 'value3' devrait pas être utilisé parce que littéraux objet ne sont pas des prototypes. Eh bien ils, mais ils n'ont pas une propriété de prototype (vous verrez que myObj.prototype est indéfini).

Prototypes sont utilisés sur les fonctions pour définir les propriétés par défaut pour tous les objets construits à partir de cette fonction à l'aide du mot-clé new. Il n'est pas destiné à être utilisé pour attribuer des propriétés à des objets individuels.

Pour moi, cela dépend de la façon dont je vais utiliser l'objet.

Si je vais l'utiliser comme un tableau associatif, une carte de hachage, ou si la syntaxe des points serait impossible, j'utilise [ et ].

Cependant, si je les traiter comme un objet, j'utiliser la syntaxe ..

En fait, il n'y a pas de différence entre l'accès à la propriété d'un objet via le « » syntaxe ou par la touche.

var obj = new function(){this.x = "value";}
alert(obj.x === obj['x']); //it will output true

Il y a des moments où vous ne pouvez pas utiliser le « » , Parce que le nom de la propriété que vous tentez d'accéder est pas un nom de variable valide (comme vous l'avez avec votre clé numérique):

var obj = new function(){this['my-value'] = "my value";}
alert(obj['my-value']); // it will output "my value"
alert(obj.my-value); // it will trigger an exception , because the javascript 
//interpretor interprets "obj.my-value" as the 
//property "my" of obj minus the variable "value"

La grande différence est la façon dont le navigateur gère la syntaxe. Comme vous pouvez le voir , un de mes amis a fait une tests et il semble que le travail Chrome et IE beaucoup plus rapide avec la syntaxe de points tandis que Firefox et Safari sont plus « vif sur » la syntaxe de la clé.
En conclusion, vous pouvez utiliser presque chaque fois que l'un d'eux, bien qu'il existe des situations où les « » vient un peu "mal préparés".

A propos de la syntaxe prototype, bien, lorsque vous définissez un objet que vous pouvez joindre les membres à chaque instance, mais vous pouvez également joindre des membres au prototype de l 'objet, ce qui signifie que chaque fois est créé un nouvel objet de votre type défini, il héritera automatiquement membre du prototype de lui. Je pense qu'il est mieux comprise par un exemple:

function Point(x,y){this.x = x;this.y = y;}
Point.prototype.toString = function(){
  return "I am a point with my x coord at "+this.x+" and my y coord at "+this.y;
}

function Point2(x,y){
  this.x = x;
  this.y = y;
  this.toString = function(){
    return "I'm a point too.I'm at x:"+this.x+", y:"+this.y;
  };
}

Lorsque vous créez un new Point2, il méthode de la toString une méthode d'instance et le javascript interpretor alloue de la mémoire pour cette méthode.
Lorsque vous créez un « nouveau point », il est la méthode de toString sera enchaînée sur la propriété de ce prototype. Cela signifie qu'aucune mémoire est allouée pour cette méthode.

var p = [], p2 = [];
for(var i = 0; i < 100000000; i++)
   {
     p.push(new Point(0,0));
     p2.push(new Point2(0,0));
   }

Si vous testez, vous verrez que les deux objets travaillent parfait, mais vos objets Point2 prendra un peu plus de mémoire de votre système. Pourquoi est-ce?
La chose est que lorsque vous appelez une méthode de new Point() de toString(), les réalise un objet qu'il ne dispose pas d'un membre appelé « toString » et il commence à le chercher jusqu'à ce chaîne de prototype et retourne le membre « toString » trouvé dans la déclaration de l'objet .
Dans l'exemple ci-dessus, tous les éléments du p pointeront leur méthode de toString à celui mentionné dans le prototype, alors que tous les éléments de p2 soulignerons leur chaque exemplaire de la méthode.
En outre, si vous voulez plus tard modifier la méthode de toString, il sera très facile de le modifier pour toutes les instances de Point:
Point.prototype.toString = function(){return "I'm a smarter point";}; Après cela, tous les cas de new Point retournera « Je suis un point plus intelligent » lorsque vous appelez la méthode de la toString.
Si vous essayez de le modifier pour les instances de Point2, il est un peu plus difficile. Vous découvrirez que Point2.toString = function(){return "I'm a dumber point";} ne fonctionnera pas comme prévu, vous devrez changer manuellement la méthode pour chaque instance:

for(var i in p2)
  p2[i].toString = function(){return "I'm a dumber point";};

Je vais vous laisser décider de la méthode est mieux: P

var myObj = function () {

};
myObj.prototype.myProp3 = 'value3' // whats the advantage?

Il doit être utilisé si vous souhaitez utiliser le myObj comme une construction pour créer plusieurs objets. c'est à dire .

var obj1 = new myObj();

alors obj1 sera également obtenir la propriété myProp3

modifier édité l'exemple ci-dessus. d'utiliser myObj comme constructeur, elle devrait être déclarée en fonction

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top