Урок 14. Переменные типа Объект.

Представьте, что в компьютерной игре есть персонаж, которым Вы управляете. У этого персонажа есть разлиные свойства: масса, размер, координаты, функции, которые он может выпонять и т.п. Было бы неудобно, если все эти свойства хранились в глобальных переменных, их будет много и в них легко запутаться. А если персонажей несколько и для каждого нужет такой же набор переменных? Удобнее хранить все в виде объекта. В программе - это всего одна переменная с набором параметров.
Урок13
Урок14
Урок15
HTML
Файл index.html оставляем без изменений.
index.html

<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="d1"></div>
<script src="js/prog.js"> </script>
</body>
</html>
JavaScript
На предыдущих уроках мы рассмотрели примитивные переменные. Их значения могут быть числовыми (целыми и вещественными), строковыми или логическими. Объекты - это как папка для других переменных или объектов (папка в папке).
let a = {
b: 1, c: 'Hello, World!',
}
Для обращения к переменной "b" нужно указать объект "а" и через разделитель (точку) - "b".
prog.js

let a = {
b:1,
c:2,
o:'Text',
}
a.b += 1;//увеличим на 1
a.c += 3;//увеличим на 3
a.o = a.o + (a.b + a.c);
d1.innerHTML = a.o;
WEB Browser
CSS
Для вывода текста по центру зададим свойство: text-align: center;
Для округления краев блока: border-radius: 8px;
Для отступов текста от крев блока: padding: 5px;
style.css

#d1{
background-color: aqua;
border-radius: 8px;
text-align: center;
padding: 5px;
}