В JavaScript при создании свойств, который является правильным или лучшим синтаксисом?

Question

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

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?

Answer 1

При использовании точечного синтаксиса имя Propery является идентификатором:

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

Поскольку имя свойства должно следовать правилам именования именования, оно может, например, не начинаться с цифры.

При использовании синтаксиса кронштейна имя свойства - это строка:

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

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

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

Если вы используете номер в качестве имени свойства, он автоматически будет преобразован в строку, поэтому они имеют тот же результат:

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

Вы также можете использовать буквальный объект, чтобы установить значения:

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

(Обратите внимание, что {} также является буквальным объектом, только без свойств.)

Использование прототипа объекта полезно только в том случае, если вы назвали типы объектов (или иным образом назначают прототип объекту). Когда вы создаете объекты, используя объект, буквальный, каждый объект имеет свой собственный прототип, поэтому в прототипе все что -то имеет тот же эффект, что и его в объект.

Answer 2

Дополнение к собственности должно быть либо myObj.myProp или же myObj["myProp"]. Анкет Это идеальный сценарий и хорошая практика при использовании в JavaScript.

Answer 3

В твоем случае, myObj.prototype.myProp3 = 'value3' должен нет Будьте использованы, потому что объектные литералы не имеют прототипов. Ну, они делают, но у них нет prototype собственность (вы увидите, что myObj.prototype не определен).

Прототипы используются на функции Чтобы установить свойства по умолчанию для всех объектов, построенных из этой функции, используя new ключевое слово. Он не предназначен для использования для назначения свойств отдельным объектам.

Answer 4

Для меня это зависит от того, как я буду использовать объект.

Если я собираюсь использовать его как ассоциативный массив, хэш -карту или где синтаксис DOT будет невозможным, я использую [ а также ].

Однако, если я обращаюсь к ним как к объекту, я использую . синтаксис.

Answer 5

По сути, нет никакой разницы между доступом к свойству объекта через «». синтаксис или через ключ.

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

Есть моменты, когда вы не можете использовать «». , потому что имя свойства, к которому вы пытаетесь получить доступ, не является допустимым именем переменной (как вы указали с помощью цифрового ключа):

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"

Большая разница в том, как браузер обрабатывает ваш синтаксис. Как вы видете здесь Мой друг провел некоторое тестирование, и кажется, что Chrome и IE работают намного быстрее с синтаксисом DOT, в то время как Firefox и Safari более "заинтересованы" ключевым синтаксисом.
В заключение вы можете использовать почти каждый раз, когда один из них, хотя существуют ситуации, когда «». Приходит немного "неподготовленным".

О синтаксисе прототипа, ну, когда вы определяете объект, вы можете прикрепить элементы к каждому экземпляру, но вы также можете прикрепить члены к прототипу объекта, что означает, что всякий раз, когда создается новый объект вашего определенного типа, он будет автоматически наследовать Этот член из его прототипа. Я думаю, что это лучше понято с примером:

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;
  };
}

Когда вы создаете new Point2, это toString Метод метод экземпляра и интерпретатор JavaScript выделяет память для этого метода.
Когда вы создаете «новую точку», это toString Метод будет прикован на свой свойство прототипа. Это означает, что для этого метода нет памяти.

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

Если вы проверяете это, вы увидите, что оба объекта работают идеально, но ваши Point2 Объекты зайдут немного больше памяти из вашей системы. Почему это?
Дело в том, что когда вы называете new Point()S. toString() Метод, объект понимает, что у него нет участника, называемого «ToString», и он начинает искать его в цепочке прототипа, и возвращает участника «ToString», найденного в объявлении объекта.
В приведенном выше примере все pпредметы будут указывать на их toString метод для того, что упоминается в прототипе, в то время как все p2Элементы будут указывать на каждую их копию метода.
Кроме того, если вы позже хотите изменить toString метод, будет очень легко изменить его для всех Point экземпляры:
Point.prototype.toString = function(){return "I'm a smarter point";};После этого каждый случай new Point Вернут «Я умнее», когда вы назовите это toString метод
Если вы попытаетесь изменить его для Point2 Примеры, это немного сложнее. Вы узнаете, что Point2.toString = function(){return "I'm a dumber point";} не будет работать, как и ожидалось, вам придется вручную изменить метод для каждого экземпляра:

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

Я позволю вам решить, какой метод лучше: P

Answer 6

var myObj = function () {

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

Это следует использовать, если вы хотите использовать MYOBJ в качестве конструкции для создания нескольких объектов. т.е.

var obj1 = new myObj();

Тогда OBJ1 также получит собственность MyProp3

редактировать: отредактировал приведенный выше пример. Чтобы использовать myOBJ в качестве конструктора, он должен быть объявлен как функция