Объекты
Создание нового объекта
Есть несколько способов создания нового объекта.
Первый способ заключается в использовании конструктора Object:
var user = new Object();
В данном случае объект называется user.
Он определяется также, как и любая обычная переменная с помощью ключевого слова var.
Выражение new Object() представляет вызов конструктора - функции,
создающей новый объект.
Второй способ создания объекта представляет использование фигурных скобок:
var user = {};
На сегодняшний день более распространенным является второй способ.
Свойства объекта
После создания объекта мы можем определить в нем свойства. Чтобы определить свойство, надо после названия объекта через точку указать имя свойства и присвоить ему значение:
var user = {};
user.name = "Tom";
user.age = 26;
После этого мы можем использовать эти свойства, например, вывести их значения в консоли:
console.log(user.name); console.log(user.age);
Также можно определить свойства при определении объекта:
var user = {
name: "Tom",
age: 26
};
В этом случае для присвоения значения свойству используется символ двоеточия, а после определения свойства ставится запятая (а не точка с запятой).
Cокращенный способ определения свойств:
var name = "Tom";
var age = 34;
var user = {name, age};
console.log(user.name); // Tom
console.log(user.age); // 34
В данном случае названия переменных также являются и названиями свойств объекта. И таким образом можно создавать более сложные конструкции:
var name = "Tom";
var age = 34;
var user = {name, age};
var teacher = {user, course: "JavaScript"};
console.log(teacher.user); // {name: "Tom", age: 34}
console.log(teacher.course); // JavaScript
Методы объекта
Методы представляют собой функции:
var user = {};
user.name = "Tom";
user.age = 26;
user.display = function(){
console.log(user.name);
console.log(user.age);
};
// вызов метода
user.display();
Как и в случае с функциями методы сначала определяются, а потом уже вызываются.
Также методы могут определяться непосредственно при определении объекта:
var user = {
name: "Tom",
age: 26,
display: function(){
console.log(this.name);
console.log(this.age);
}
};
Как и свойствам, методу присваивается ссылка на функцию с помощью знака двоеточия.
Чтобы обратиться к свойствам или методам объекта внутри этого объекта, используется ключевое слово this.
Также можно использовать сокращенный способ определения методов, когда двоеточие и слово function опускаются:
var user = {
name: "Tom",
age: 26,
display(){
console.log(this.name, this.age);
},
move(place){
console.log(this.name, "goes to", place);
}
};
user.display(); // Tom 26
user.move("the shop"); // Tom goes to the shop
Синтаксис массивов
Aльтернативный способ определения свойств и методов с помощью синтаксиса массивов:
var user = {};
user["name"] = "Tom";
user["age"] = 26;
user["display"] = function(){
console.log(user.name);
console.log(user.age);
};
// вызов метода
user["display"]();
При обращении к этим свойствам и методам можно использовать либо нотацию точки (user.name), либо обращаться так: user["name"]
Строки в качестве свойств и методов
Hазвания свойств и методов объекта всегда представляют строки. То есть мы могли предыдущее определение объекта переписать так:
var user = {
"name": "Tom",
"age": 26,
"display": function(){
console.log(user.name);
console.log(user.age);
}
};
// вызов метода
user.display();
С одной стороны, разницы никакой нет, но бывают случаи, где заключение названия в строку могут помочь. Например, если название свойства состоит из двух слов, разделенных пробелом:
var user = {
name: "Tom",
age: 26,
"full name": "Tom Johns",
"display info": function(){
console.log(user.name);
console.log(user.age);
}
};
console.log(user["full name"]);
user["display info"]();
B этом случае для обращении к подобным свойствам и методам мы должны использовать синтаксис массивов.
Удаление свойств
И как и в случае с добавлением мы можем удалять свойства двумя способами.
Певый способ - использование нотации точки:
delete объект.свойство
Либо использовать синтаксис массивов:
delete объект["свойство"]
Например, удалим свойство:
var user = {};
user.name = "Tom";
user.age = 26;
user.display = function(){
console.log(user.name);
console.log(user.age);
};
console.log(user.name); // Tom
delete user.name; // удаляем свойство
// альтернативный вариант
// delete user["name"];
console.log(user.name); // undefined