Учебник по 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 почти "все" является объектом.

  • Логические значения могут быть объектами (если определены с помощью newключевого слова)
  • Числа могут быть объектами (если определены newключевым словом)
  • Строки могут быть объектами (если определены newключевым словом)
  • Даты всегда являются объектами
  • Математика всегда объекты
  • Регулярные выражения всегда являются объектами
  • Массивы всегда являются объектами
  • Функции всегда являются объектами
  • Объекты всегда являются объектами

Все значения JavaScript, кроме примитивов, являются объектами.


JavaScript-примитивы

Примитивное значение — это значение, не имеющее свойств или методов.

Примитивный тип данных — это данные, имеющие примитивное значение.

JavaScript определяет 5 типов примитивных типов данных:

  • string
  • number
  • boolean
  • null
  • undefined

Примитивные значения неизменяемы (они жестко запрограммированы и поэтому не могут быть изменены).

если x = 3,14, вы можете изменить значение x. Но вы не можете изменить значение 3.14.

ЦенностьТипКомментарий
"Привет"нить"Привет" всегда "Привет"
3.14номер3,14 всегда 3,14
истинныйлогическийправда всегда правда
ложныйлогическийложь всегда ложь
нулевойноль (объект)ноль всегда ноль
неопределенныйнеопределенныйнеопределенный всегда неопределенный

Объекты являются переменными

Переменные JavaScript могут содержать одиночные значения:

Пример

let person = "John Doe";

Переменные JavaScript также могут содержать множество значений.

Объекты тоже переменные. Но объекты могут содержать множество значений.

Значения объекта записываются в виде пар имя : значение (имя и значение разделены двоеточием).

Пример

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

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

Общепринятой практикой является объявление объектов с помощью constключевого слова.

Пример

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


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

Именованные значения в объектах JavaScript называются свойствами .

Имущество Ценность
имя Джон
фамилия Доу
возраст 50
цвет глаз синий

Объекты, записанные в виде пар имя-значение, похожи на:

  • Ассоциативные массивы в PHP.
  • Словари в Python
  • Хэш-таблицы в C
  • Хэш-карты в Java
  • Хэши в Ruby и Perl

Методы объекта

Методы — это действия , которые можно выполнять над объектами.

Свойства объекта могут быть как примитивными значениями, другими объектами, так и функциями.

Метод объекта — это свойство объекта, содержащее определение функции .

Имущество Ценность
имя Джон
фамилия Доу
возраст 50
цвет глаз синий
полное имя function() {возвратите this.firstName + " " + this.lastName;}

Объекты JavaScript — это контейнеры для именованных значений, называемых свойствами и методами.

Вы узнаете больше о методах в следующих главах.


Создание объекта JavaScript

С помощью JavaScript вы можете определять и создавать свои собственные объекты.

Существуют различные способы создания новых объектов:

  • Создайте один объект, используя литерал объекта.
  • Создайте один объект с ключевым словом new.
  • Определите конструктор объекта, а затем создайте объекты сконструированного типа.
  • Создайте объект с помощью Object.create().

Использование литерала объекта

Это самый простой способ создать объект JavaScript.

Используя объектный литерал, вы и определяете, и создаете объект в одном операторе.

Литерал объекта — это список пар имя:значение (например, age:50) внутри фигурных скобок {}.

В следующем примере создается новый объект JavaScript с четырьмя свойствами:

Пример

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

Пробелы и переносы строк не важны. Определение объекта может занимать несколько строк:

Пример

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

В этом примере создается пустой объект JavaScript, а затем добавляются 4 свойства:

Пример

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

Использование ключевого слова JavaScript new

В следующем примере создается новый объект JavaScript с помощью new Object(), а затем добавляются 4 свойства:

Пример

const person = new Object();
person.firstName = "John";
person.lastName = "Doe";
person.age = 50;
person.eyeColor = "blue";

Примеры выше делают то же самое.

Но нет необходимости использовать new Object().

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


Объекты JavaScript изменяемы

Объекты изменяемы: к ним обращаются по ссылке, а не по значению.

Если человек является объектом, следующий оператор не создаст копию человека:

const x = person;  // Will not create a copy of person.

Объект x не является копией человека. Это человек . И x, и person являются одним и тем же объектом.

Любые изменения в x также изменят человека, потому что x и человек — это один и тот же объект.

Пример

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

const x = person;
x.age = 10;      // Will change both x.age and person.age