Учебник по JS

ГЛАВНАЯ JS Введение JS Куда Вывод JS Заявления JS JS-синтаксис JS-комментарии JS-переменные JS Пусть Константа JS JS-операторы JS-арифметика Назначение JS JS-типы данных JS-функции JS-объекты JS-события JS-строки Строковые методы JS Поиск строки JS Шаблоны строк JS JS-номера Методы номеров JS JS-массивы Методы массива JS Сортировка массива JS Итерация массива JS Константа массива JS JS-даты Форматы даты JS Методы получения даты JS Методы установки даты JS JS-математика JS Случайный JS Булевы значения Сравнение JS JS-условия JS-переключатель JS цикл для Цикл JS для входа Цикл JS для Цикл JS во время Перерыв JS JS-итерации JS-наборы JS-карты JS Typeof Преобразование типов JS JS побитовый JS регулярное выражение JS-ошибки Область JS JS-подъем Строгий режим JS JS это ключевое слово Функция стрелки JS JS-классы JS JSON JS-отладка Руководство по стилю JS Лучшие практики JS JS-ошибки JS-производительность Зарезервированные слова JS

JS-версии

JS-версии JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE/пограничный История JS

JS-объекты

Определения объектов Свойства объекта Методы объекта Отображение объекта Средства доступа к объектам Конструкторы объектов Прототипы объектов Итерации объектов Наборы объектов Карты объектов Ссылка на объект

JS-функции

Определения функций Параметры функции Вызов функции Вызов функции Функция Применить Закрытие функций

JS-классы

Введение в класс Наследование классов Статический класс

JS асинхронный

Обратные вызовы JS JS асинхронный JS-обещания JS асинхронный/ожидание

JS HTML DOM

Дом Введение DOM-методы Документ DOM DOM-элементы DOM HTML DOM-формы ДОМ CSS DOM-анимации События ДОМ Слушатель событий DOM DOM-навигация DOM-узлы Коллекции DOM Списки узлов DOM

Спецификация браузера JS

JS-окно JS-экран Местоположение JS История JS JS-навигатор Всплывающее оповещение JS JS Тайминг JS-куки

JS-веб-API

Введение в веб-API API веб-форм API истории веб-поиска API веб-хранилища API веб-работника API веб-выборки API веб-геолокации

JS АЯКС

Введение в АЯКС AJAX XMLHttp АЯКС-запрос AJAX-ответ XML-файл AJAX АЯКС PHP АЯКС АСП База данных AJAX AJAX-приложения Примеры AJAX

JS JSON

Введение в JSON Синтаксис JSON JSON против XML Типы данных JSON Анализ JSON Строковая JSON JSON-объекты JSON-массивы JSON-сервер JSON PHP JSON HTML JSON JSONP

JS против JQuery

Селекторы jQuery JQuery HTML jQuery CSS JQuery DOM

JS-графика

JS-графика JS Холст JS сюжет JS Chart.js JS Google Диаграмма JS D3.js

JS-примеры

JS-примеры JS HTML DOM JS HTML-ввод HTML-объекты JS HTML-события JS JS-браузер JS-редактор JS-упражнения JS-викторина JS-сертификат

JS-ссылки

Объекты JavaScript HTML DOM-объекты


Свойства объекта JavaScript


Свойства — самая важная часть любого объекта JavaScript.


Свойства JavaScript

Свойства — это значения, связанные с объектом JavaScript.

Объект JavaScript представляет собой набор неупорядоченных свойств.

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


Доступ к свойствам JavaScript

Синтаксис для доступа к свойству объекта:

objectName.property      // person.age

или

objectName["property"]   // person["age"]

или

objectName[expression]   // x = "age"; person[x]

Выражение должно оцениваться как имя свойства.

Пример 1

person.firstname + " is " + person.age + " years old.";

Пример 2

person["firstname"] + " is " + person["age"] + " years old.";


JavaScript для... в цикле

Оператор JavaScript for...inперебирает свойства объекта.

Синтаксис

for (let variable in object) {
  // code to be executed
}

Блок кода внутри for...inцикла будет выполняться один раз для каждого свойства.

Цикл по свойствам объекта:

Пример

const person = {
  fname:" John",
  lname:" Doe",
  age: 25
};

for (let x in person) {
  txt += person[x];
}

Добавление новых свойств

Вы можете добавить новые свойства к существующему объекту, просто присвоив ему значение.

Предположим, что объект person уже существует — тогда вы можете присвоить ему новые свойства:

Пример

person.nationality = "English";

Удаление свойств

Ключевое deleteслово удаляет свойство из объекта:

Пример

const person = {
  firstName: "John",
  lastName: "Doe",
  age: 50,
  eyeColor: "blue"
};

delete person.age;

или удалить человека["возраст"];

Пример

const person = {
  firstName: "John",
  lastName: "Doe",
  age: 50,
  eyeColor: "blue"
};

delete person["age"];

Ключевое deleteслово удаляет как значение свойства, так и само свойство.

После удаления свойство нельзя использовать, пока оно не будет снова добавлено.

Оператор deleteпредназначен для использования со свойствами объекта. Это не влияет на переменные или функции.

Оператор deleteне следует использовать для предопределенных свойств объекта JavaScript. Это может привести к сбою вашего приложения.


Вложенные объекты

Значения в объекте могут быть другим объектом:

Пример

myObj = {
  name:"John",
  age:30,
  cars: {
    car1:"Ford",
    car2:"BMW",
    car3:"Fiat"
  }
}

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

Пример

myObj.cars.car2;

или:

Пример

myObj.cars["car2"];

или:

Пример

myObj["cars"]["car2"];

или:

Пример

let p1 = "cars";
let p2 = "car2";
myObj[p1][p2];

Вложенные массивы и объекты

Значения в объектах могут быть массивами, а значения в массивах могут быть объектами:

Пример

const myObj = {
  name: "John",
  age: 30,
  cars: [
    {name:"Ford", models:["Fiesta", "Focus", "Mustang"]},
    {name:"BMW", models:["320", "X3", "X5"]},
    {name:"Fiat", models:["500", "Panda"]}
  ]
}

Чтобы получить доступ к массивам внутри массивов, используйте цикл for-in для каждого массива:

Пример

for (let i in myObj.cars) {
  x += "<h1>" + myObj.cars[i].name + "</h1>";
  for (let j in myObj.cars[i].models) {
    x += myObj.cars[i].models[j];
  }
}

Атрибуты свойства

Все свойства имеют имя. Кроме того, они также имеют значение.

Значение является одним из атрибутов свойства.

Другие атрибуты: перечисляемые, настраиваемые и доступные для записи.

Эти атрибуты определяют, как можно получить доступ к свойству (доступно ли оно для чтения? Доступно ли для записи?)

В JavaScript все атрибуты могут быть прочитаны, но только атрибут value может быть изменен (и только если свойство доступно для записи).

(ECMAScript 5 имеет методы как для получения, так и для установки всех атрибутов свойств)


Свойства прототипа

Объекты JavaScript наследуют свойства своего прототипа.

Ключевое deleteслово не удаляет унаследованные свойства, но если вы удалите свойство прототипа, оно повлияет на все объекты, унаследованные от прототипа.