САЙТ ДЛЯ ВЕБ РАЗРАБОТЧИКОВ НА РУССКОМ ЯЗЫКЕ
×

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 Заявления if...else JS Заявление switch JS Цикл for JS Цикл while JS Заявление break... JS Преобразование... JS Битовые... JS Регулярные выражения JS Ошибки JS Отладчик JS Подъемный JS Строгий JS Ключевое слово this JS Руководство стиля JS Практика JS Распространенные ошибки JS Эффективность JS Зарезервированные слова JS Версии JS Версия ES5 JS Версия ES6 JS JSON

JS Формы

JS Формы JS Формы API

JS Объекты

Определение объекта Свойства объекта Методы объекта Доступ к объекту Конструкторы объекта Прототипы объекта Объект ECMAScript 5

JS Функции

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

JS HTML DOM

DOM Введение DOM Методы DOM Документы DOM Элементы DOM HTML DOM CSS DOM Анимация DOM События DOM Слушатель события DOM Навигация DOM Узлы DOM Коллекции DOM Список узлов

JS Браузера BOM

JS Окно JS Экран JS Местоположение JS История JS Навигатор JS Всплывающее окна JS Синхронизация JS Cookies

JS AJAX

AJAX Введение AJAX XMLHttp AJAX Запрос AJAX Ответ AJAX XML Файл AJAX PHP AJAX ASP AJAX База данных AJAX Приложения AJAX Примеры

JS JSON

JSON Введение JSON Синтаксис JSON или XML JSON Типы данных JSON Парсинг JSON Строки JSON Объекты JSON Массивы JSON PHP JSON HTML JSON JSONP



JavaScript Конструктор объекта



Пример

function Person(first, last, age, eye) {
  this.firstName = first;
  this.lastName = last;
  this.age = age;
  this.eyeColor = eye;
}
Попробуйте сами »

Считается хорошей практикой называть конструкторские функции с заглавной первой буквой.


Типы объектов (Схемы элементов) (Классы)

Примеры из предыдущих глав ограничены. Они создают только отдельные объекты.

Иногда нам нужена "копия" для создания множества объектов одного и того же "типа".

Чтобы создать "тип объекта", необходимо использовать функцию конструктора объекта.

В приведенном выше примере функция Person() является функцией конструктора объектов.

Объекты одного типа создаются путем вызова функции конструктора с ключевым словом new:

var myFather = new Person("Андрей", "Щипунов", 50, "зеленый");
var myMother = new Person("Татьяна", "Щипунова", 43, "зеленый");
Попробуйте сами »


Ключевое слова this

В JavaScript this называется объектом, который "владеет" кодом.

Значение this, когда используется в объекте, является самим объектом.

В функции конструктора this не имеет значения. Это замена нового объекта. Значение this станет новым объектом, когда будет создан новый объект.

Обратите внимание, что this не переменная. Это ключевое слово. Вы не можете изменить значение this.


Добавление свойства к объекту

Легко добавить новое свойство к существующему объекту:

Пример

myFather.nationality = "Русский";
Попробуйте сами »

Свойство будет передано "myFather". Только не "myMother". (ни к какому другому объекту "person").


Добавление метода к объекту

Легко добавить новый метод к существующему объекту:

Пример

myFather.name = function () {
  return this.firstName + " " + this.lastName;
};
Попробуйте сами »

Метод будет добавлен к myFather. Только не "myMother". (ни к какому другому объекту "person").


Добавление свойства в конструктор

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

Пример

Person.nationality = "Русский";
Попробуйте сами »

Чтобы добавить новое свойство в конструктор, необходимо добавить его в функцию конструктора:

Пример

function Person(first, last, age, eyecolor) {
  this.firstName = first;
  this.lastName = last;
  this.age = age;
  this.eyeColor = eyecolor;
  this.nationality = "Русский";
}
Попробуйте сами »

Таким образом свойства объекта могут иметь значения по умолчанию.


Добавление метода в конструктор

Функция конструктора также может определять методы:

Пример

function Person(first, last, age, eyecolor) {
  this.firstName = first;
  this.lastName = last;
  this.age = age;
  this.eyeColor = eyecolor;
  this.name = function() {return this.firstName + " " + this.lastName;};
}
Попробуйте сами »

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

Добавление методов в конструктор объекта должно выполняться внутри функции конструктора:

Пример

function Person(firstName, lastName, age, eyeColor) {
  this.firstName = firstName; 
  this.lastName = lastName;
  this.age = age;
  this.eyeColor = eyeColor;
  this.changeName = function (name) {
    this.lastName = name;
  };
}

Функция changeName() присваивает значение name свойству person lastName.

Теперь попробуйте:

myMother.changeName("Щипунова");
Попробуйте сами »

JavaScript знает, о каком человеке вы говорите, "заменяя" его на myMother.


JavaScript встроенные конструкторы

JavaScript имеет встроенные конструкторы для собственных объектов:

Пример

var x1 = new Object();    // Новый Object объект
var x2 = new String();    // Новый String объект
var x3 = new Number();    // Новый Number объект
var x4 = new Boolean();   // Новый Boolean объект
var x5 = new Array();     // Новый Array объект
var x6 = new RegExp();    // Новый RegExp объект
var x7 = new Function();  // Новый Function объект
var x8 = new Date();      // Новый Date объект
Попробуйте сами »

Объект Math() отсутствует в списке. Math - это глобальный объект. Ключевое слово new не может быть использовано в Math.


А вы знали?

Как вы можете видеть выше, JavaScript имеет объектные версии примитивных типов данных String, Number и Boolean. Но нет никакой причины создавать сложные объекты. Примитивные значения гораздо быстрее.

ТОЖЕ:

Используйте object литералы {} вместо new Object().

Используйте string литералы "" вместо new String().

Используйте number литералы 12345 вместо new Number().

Используйте boolean литералы true / false вместо new Boolean().

Используйте array литералы [] вместо new Array().

Используйте pattern литералы /()/ вместо new RegExp().

Используйте function выражения () {} вместо new Function().

Пример

var x1 = {};            // новый объект
var x2 = "";            // новая примитивная строка
var x3 = 0;             // новые примитивные числа
var x4 = false;         // новый примитивный логический элемент
var x5 = [];            // новый объект массива
var x6 = /()/           // новый объект регулярного выражения
var x7 = function(){};  // новый объект функции
Попробуйте сами »

Объекты string

Обычно строки создаются как примитивы: var firstName = "Андрей"

Но строки также могут быть созданы как объекты с помощью ключевого слова new: var firstName = new String("Андрей")

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


Объекты number

Обычно числа создаются как примитивы: var x = 123

Но числа также могут быть созданы как объекты с помощью ключевого слова new: var x = new Number(123)

Узнайте, почему числа не должны создаваться как объект в этой главе JS Числа.


Объекты boolean

Обычно логические значения создаются как примитивы: var x = false

Но логические значения также могут быть созданы как объекты с помощью ключевого слова new: var x = new Boolean(false)

Узнайте, почему логические значения не должны создаваться как объект в этой главе JS Логические.