Обєкти JavaScript. Частина 4

4

Від автора: вітаю вас, друзі. У цій статті ми з вами продовжимо знайомитися з найбільш складним, але й не менш цікавим типом даних в JavaScript — мова йде про об’єкти. Приступимо?

Отже, ми вже трохи уявляємо собі міць об’єктів в JavaScript і зручність роботи з ними. Порівняно із звичайними змінними, об’єкти набагато зручніше, їх властивості можна зберігати окремі значення, вкладені об’єкти зі своїми властивостями і навіть методи об’єктів, які є ні чим іншим, як корисними функціями.

Загалом, в об’єкті може зберігатися маса всього і потрібного. А як би нам пройтися за раз по всього цього добра? Для цього JavaScript пропонує вже знайомий нам оператор in. Нагадаю, за допомогою даного оператора ми можемо перевірити наявність властивості в об’єкті. Тепер спробуємо використовувати його для того, щоб пробігтися по властивостях об’єкта.

Для початку глянемо на синтаксис необхідної конструкції:

for(var key in object){
// код
}

Як ви помітили, ми використовуємо цикл for, але в незнайомому нам вигляді. Саме в такому вигляді ми можемо перебрати всі властивості масиву. Змінна key тут умовна і в неї на кожній ітерації циклу потрапляє ім’я властивості об’єкта. Після оператора in вказується назва об’єкта, за властивостями якого ми проходимся в циклі. І практичний приклад:

var names = {
name1: ‘John’,
name2: ‘Jane’,
hi: function(param){
console.log(param);
}
};
for(var prop in names){
console.log(‘Ім’я властивості:’ + prop + ‘, Значення: ‘+ names[prop]);
}

Як бачимо, ми перебрали всі властивості об’єкта і вивели найменування властивості і його значення, в тому числі й функцію (метод), яка зберігається у властивості.

Як ви розумієте, ми не можемо просто перебирати властивості, але і що робити з їх значеннями. Наприклад, додамо до значення властивості, якщо це не функція, прізвище Doe. Ну а якщо це функція, тоді видалимо це властивість об’єкта:

var names = {
name1: ‘John’,
name2: ‘Jane’,
hi: function(param){
console.log(param);
}
};
console.log(names);
for(var prop in names){
if(prop !== ‘hi’){
names[prop] += ‘Doe’;
}else{
delete names[prop];
}
}
console.log(names);

І результат в консолі:

Дуже зручно, чи не так? На цьому ми завершимо поточну статтю. Якщо ви хочете більше дізнатися про JavaScript, тоді рекомендую звернути свою увагу на уроки по JavaScript і окремий курс по мові JavaScript. Удачі!