Відмінності між версіями «ООП в JavaScript»

Матеріал з Вікі ЦДУ
Перейти до: навігація, пошук
(Створення об'єктів за допомогою конструктора)
(Створення об'єктів за допомогою конструктора)
Рядок 87: Рядок 87:
 
</ol>
 
</ol>
 
Наприклад, конструктор для об'єкта MyObj з попереднього прикладу може мати наступний вигляд:
 
Наприклад, конструктор для об'єкта MyObj з попереднього прикладу може мати наступний вигляд:
  function MyObj(name, value) {
+
  <font color="#008000">function MyObj(name, value)  
 +
{
 
   this.name = name;
 
   this.name = name;
 
   this.value = value;
 
   this.value = value;
  }
+
  }</font>
 
Зверніть увагу на використання операції <b>this</b> для доступу до властивостей об'єкта. Його особливості будуть розглянуті далі.
 
Зверніть увагу на використання операції <b>this</b> для доступу до властивостей об'єкта. Його особливості будуть розглянуті далі.
  
 
Тепер для створення нових об'єктів <b>MyObj</b> достатньо викликати цей конструктор в операції <b>new</b>, наприклад:
 
Тепер для створення нових об'єктів <b>MyObj</b> достатньо викликати цей конструктор в операції <b>new</b>, наприклад:
  var myObjL = new MyObj("Indigo", 132);
+
  <font color="#008000">var myObjL = new MyObj("Indigo", 132);</font>
  
 
Продемонструємо на прикладі об'єкт, який буде складатися з іншого об'єкту та ініціалізовуватиметься за допомогою конструктору:
 
Продемонструємо на прикладі об'єкт, який буде складатися з іншого об'єкту та ініціалізовуватиметься за допомогою конструктору:
  
  function myOpt(enbl, vud)  
+
  <font color="#008000">function myOpt(enbl, vud)  
 
  {
 
  {
 
   this.enabled = enbl;  
 
   this.enabled = enbl;  
 
   this.vud = vud;
 
   this.vud = vud;
  }
+
  }</font>
  
  function MyObj(name, value, options)  
+
  <font color="#008000">function MyObj(name, value, options)  
 
  {
 
  {
 
   this.name = name;
 
   this.name = name;
 
   this.value = value;
 
   this.value = value;
 
   this.options = options;
 
   this.options = options;
  }
+
  }</font>
  
  var myOpt = new myOpt(true, false);
+
  <font color="#008000">var myOpt = new myOpt(true, false);
  var myObjL = new MyObj("Indigo", 132, myOpt);
+
  var myObjL = new MyObj("Indigo", 132, myOpt);</font>
  
 
== Створення методів ==
 
== Створення методів ==

Версія за 20:09, 13 травня 2010

Теоретичний опис принципів ООП в JavaScript може заняти дуже багато часу, і викликати багато суперечок навколо питання чи взагалі існують класи в JavaScript. Я не буду на цьому зупинятися, а відразу дам відповідь: Класів в JavaScript НЕМАЄ

Загальний Опис

JavaScript -- це мова програмування, яка базується на об`єктах. Всі об'єкти поділяються на 3 групи:

  • вбудовані об'єкти виконуючої системи
  • об'єкти середовища, в якому виконується сценарій
  • користувацькі об'єкти

об'єкт JavaScript -- це неупорядкований набір властивостей.

Метод -- це властивість, що є функцією. Приклад синтаксису доступу до властивості об'єкту:


імя_об'єкта.імя_властивості

або


імя_об'єкта["імя_властивості"]

Останній синтаксис використовується оператором for ... in. Кожне властивість складається з назви, значення і набору наступних атрибутів:

Атрибут

Опис Атрибуту

DontEnum

Чи повинна властивість попадати в перелічення при обході оператором for..in

DontDelete

Заборона видалення даної властивості. Спроба програмно видалити дану властивість буде проигноровано.

ReadOnly

Заборона зміни цієї властивості. Спроба програмно змінити дану властивість буде проигноровано.

Нова властивість об'єкту створюється просто присвоюванням йому значення. Нехай, наприклад, ми вже створили об'єкт MyObj. Задамо йому ім'я, та, наприклад, якесь значення:


MyObj.name = "Мій Об'єкт"; 
MyObj.value = 256;

Тепер наш об'єкт має 2 властивості: name та value. У таких властивостей, створених користувачем, всі перераховані вище атрибути скинуті в false. Надалі ми можемо змінювати значення цих властивостей або переглядати.

Створення об'єкта

Існує два способи створення нових об'єктів у JavaScript, а саме:

  • Використання ініціалізатора об'єкта.
  • Використання конструктора об'єктів.

Створення об'єктів за допомогою ініціалізатора

Цей спосіб дозволяє одночасно створити об'єкт і привласнити значення всіх або частини його властивостей. Він застосовується в тих випадках, коли ми створюємо об'єкт з унікальним набором властивостей. Ініціалізатор об'єкта має вигляд:

(Властивість: значення [, властивість: значення])

Властивість - ідентифікатор, що задає ім'я властивості; значення - вираз, що задає значення цієї властивості.

Наприклад, об'єкт MyObj з попереднього прикладу може бути створений так:

var MyObj = {name: "Dead", value: "256"};

Можливо конструювати об'єкт в об'єкті. Додамо ще одну властивість об'єкта MyObj, яка називається options і сама є об'єктом:

var MyObj = {name: "Dead", value: "256",
 options: {enabled: true, vud: false}};

Створення об'єктів за допомогою конструктора

Цей спосіб застосовується в тих випадках, коли ми хочемо створити "клас"(реально функцію конструктор) об'єктів з певним набором властивостей, а потім створювати нові об'єкти, просто вказуючи, до якого класу вони повинні належати. Для цього потрібно спочатку створити конструктор об'єктів, який є функцією спеціального виду, а саме:

  1. Ім'я функції задає ім'я створюваного "класу" об'єктів;
  2. Тіло функції повинно містити присвоювання початкових значень властивостям і методам створюваного об'єкту.

Наприклад, конструктор для об'єкта MyObj з попереднього прикладу може мати наступний вигляд:

function MyObj(name, value) 
{
 this.name = name;
 this.value = value;
}

Зверніть увагу на використання операції this для доступу до властивостей об'єкта. Його особливості будуть розглянуті далі.

Тепер для створення нових об'єктів MyObj достатньо викликати цей конструктор в операції new, наприклад:

var myObjL = new MyObj("Indigo", 132);

Продемонструємо на прикладі об'єкт, який буде складатися з іншого об'єкту та ініціалізовуватиметься за допомогою конструктору:

function myOpt(enbl, vud) 
{
 this.enabled = enbl; 
 this.vud = vud;
}
function MyObj(name, value, options) 
{
 this.name = name;
 this.value = value;
 this.options = options;
}
var myOpt = new myOpt(true, false);
var myObjL = new MyObj("Indigo", 132, myOpt);

Створення методів

Прототипи об'єктів

Видалення об'єктів

Наслідування