Coding for Future in Lutsk. JavaScript. Part 9

Об’єкти
У JavaScript об’єкт є набором
найменованих властивостей і методів-
функцій. Об’єкти можуть зберігатись у
змінних, доступ до властивостей і методів
– через “крапковий” синтаксис.

Створення об’єктів
Два способи:
1. o = new Object();
2. o = {}; // пусті фігурні дужки
Приклади:
var rak = {};
var koza = {
name: "Дереза",
age: 12,
talk: function () { alert("Заколю тебе рогами..."); }
};
alert( koza.name ); // Дереза
koza.talk(); // Заколю тебе рогами...

Додавання властивості:
rak.name = "Неборак";
rak.age = 60;
koza.color = "white";
Видалення:
delete koza.color;
Перевірка наявності властивості – in:
if ("name" in koza) {
alert( "Властивість name існує" );
}
Якщо властивості нема:
alert( koza.color ); // undefined

Інший спосіб доступу до властивостей:
об’єкт['властивість'].
var person = {};
person['name'] = 'Колобок';
alert( person['name'] ); // Колобок
person.name = 'Солом'яний бичок';
alert( person['name'] ); //
Солом'яний бичок

Квадратні дужки дозволяють використовувати як ім’я
властивості будь-який рядок:
var person = {};
person['колір волосся'] = 'темний';
Допустимі обидва способи:
var menuSetup = {
width: 300,
'height': 200, // можна в лапках, можна без
title: "Menu"
};
var menuSetup = {};
menuSetup.width = 300;
menuSetup.height = 200;
menuSetup.title = 'Menu'

Значенням може бути навіть інший об’єкт
var character = {
name: "Баба Яга",
age: 700,
transport: {
name: "ступа",
capacity: 1,
maxSpeed: 200
}
}
alert( character.name ); // Баба Яга
alert( character.transport.name ); // Ступа

Задача 35
Виконайте таку послідовність дій:
1. Створіть порожній об’єкт user.
2. Додайте властивість name зі
значенням Вася.
3. Додайте властивість surname зі
значенням Дмитрук.
4. Поміняйте значення name на Сергій.
5. Видаліть властивість name з об’єкта.
6. Виведіть властивість surname.

Перебір властивостей об‘єкта
for (key in obj) {
/* ... якісь дії з obj[key] ... */
}
Зазвичай змінну key оголошують прямо
в циклі:
for (var key in menu) {
// ...
}
Можна використовувати й інші імена для
змінної: for(var propName in menu)

Приклад ітерації по властивостях:
var character = {
name: "Баба Яга",
age: 700,
transport: {
name: "ступа",
capacity: 1,
maxSpeed: 200
}
}
for (var key in character) {
alert("ключ: " + key + "nзначення: " +
character[key]);
}

Задача 36
Напишіть функцію countProp для
підрахунку кількості властивостей об’єкта
character.

Розв’язок
function countProp (obj){
var counter = 0;
for (var key in obj) {
counter++;
}
return counter;
}
alert( countProp(character) );
P.S. Можливий коротший спосіб підрахунку:
Object.keys(character).length (див. Масиви).

Задача 37
Напишіть функцію isEmpty(obj), яка
повертає true, якщо в об’єкті нема
властивостей і false – якщо є хоч одна
властивість.
Приклад роботи:
var schedule = {};
alert( isEmpty(schedule) ); // true
schedule["8:30"] = "підйом";
alert( isEmpty(schedule) ); // false

Розв’язок
function isEmpty(obj) {
return false;
}
return true;
}

Задача 38
Є об’єкт salaries з зарплатами.
var salaries = {
"Ахванасій ": 5000,
"Савка": 6000,
"Соломон": 2500
};
Напишіть код, який виведе суму всіх
зарплат.

Розв’язок
var salaries = {
"Ахванасій ": 5000,
"Савка": 6000,
"Соломон": 2500
};
var sum = 0;
for (var key in salaries) {
sum += salaries[key];
}
alert( sum );

Задача 39
Є об’єкт salaries з зарплатами. Напишіть
код, який виведе ім’я персонажа, у якого
найбільша зарплата.
Якщо об’єкт порожній, має виводитись
“Ніхто нічого не заробив”.

Розв’язок
var leader = "", maxValue = 0;
for (var key in salaries) {
if (salaries[key] > maxValue) {
maxValue = salaries[key];
leader = key;
}
}
alert( leader || "Ніхто не працював" );

Задача 40
Напишіть функцію multiplyNumeric, яка множить всі числові властивості на 2. Наприклад:
var salaries = { // lдо виклику
"Ахванасій": 5000,
"Савка": 6000,
"Соломон": 2500,
"Митродора Пилипівна": "багато"
};
multiplyNumeric(menu);
var salaries = {// lпісля виклику
"Ахванасій": 10000,
"Савка": 12000,
"Соломон": 5000,
"Митродора Пилипівна": "багато"
};
P. S. Для перевірки на число використовуйте функцію:
function isNumeric(n) {
return !isNaN(parseFloat(n)) && isFinite(n)
}

Розв’язок
function multiply(obj) {
//if( +obj[key] > 0) {
if( isNumeric(obj[key]) ) {
obj[key] *= 2;
}
}
}
function isNumeric(n) {
return !isNaN(parseFloat(n)) && isFinite(n)
}
multiply( salaries );

Відмінності об’єктів від змінних
У змінній, якій надається об’єкт, зберігається
лише посилання на нього!
var user = { name: 'Вася' };
var admin = user;
admin.name = 'Люда';
alert(user.name); // 'Люда'
alert(admin.name); // 'Люда'
Зі звичайними змінними:
var user = 'Вася';
var admin = user;
admin = 'Люда';
alert( user ); // 'Вася'

Coding for Future in Lutsk. JavaScript. Part 9

More Related Content

More from Олег Вілігурський (20)

Coding for Future in Lutsk. JavaScript. Part 9