objavlenie_obekta

Различия

Показаны различия между двумя версиями страницы.

Ссылка на это сравнение

Предыдущая версия справа и слева Предыдущая версия
Следующая версия
Предыдущая версия
objavlenie_obekta [2023/11/11 18:12]
tro [Обхід властивостей обїека]
objavlenie_obekta [2023/12/14 20:17] (текущий)
tro
Строка 2: Строка 2:
 ===== Обявление объекта ===== ===== Обявление объекта =====
 ==== Обявление объекта рекомендация (но можно и через LET) ==== ==== Обявление объекта рекомендация (но можно и через LET) ====
- 
 <code> <code>
 const sd={ const sd={
Строка 36: Строка 35:
 myCity.cityGreeting('Grettering') myCity.cityGreeting('Grettering')
 </code> </code>
 +
 +
 +<code>
 +const bookShelf = {
 +  books: ["The Last Kingdom"],
 +  getBooks() {
 +    return this.books;
 +  },
 +  addBook(bookName) {
 +    this.books.push(bookName);
 +  }
 +};
 +</code>
 +==== Массив обїектов ====
 +<code>
 +const books = [
 +  {
 +    title: "The Last Kingdom",
 +    author: "Bernard Cornwell",
 +    rating: 8.38,
 +  },
 +  {
 +    title: "Beside Still Waters",
 +    author: "Robert Sheckley",
 +    rating: 8.51,
 +  },
 +  {
 +    title: "The Dream of a Ridiculous Man",
 +    author: "Fyodor Dostoevsky",
 +    rating: 7.75,
 +  }
 +];
 +</code>
 +<code>
 +const bookShelf = {
 +  books: [
 + { title: "The Last Kingdom", rating: 8 }, 
 + { title: "The Mist", rating: 6 }
 + ],
 + getBooks() {
 + return this.books;
 + }
 +};
 +</code>
 +
 ===== Обращение к єлементам объекта ===== ===== Обращение к єлементам объекта =====
 ==== через точку ==== ==== через точку ====
Строка 66: Строка 110:
  
 ===== Изменение значениий свойст обїекта ===== ===== Изменение значениий свойст обїекта =====
 +==== Указанием имени свойства ====
 <code> <code>
 const book = { const book = {
Строка 77: Строка 122:
 book.rating = 9; book.rating = 9;
 </code> </code>
-===== Изменение свойств ===== +==== через короткая запись изменение свойств ====
-Операція додавання нової властивості після створення об'єкта нічим не відрізняється від зміни значення вже існуючої властивості. +
-<code> +
-const book = { +
-  title: "The Last Kingdom", +
-  author: "Bernard Cornwell", +
-  genres: ["historical prose", "adventure"], +
-  isPublic: true, +
-  rating: 8.38, +
-}; +
- +
-book.pageCount = 836; +
-</code> +
-===== Короткая запись изменение свойств =====+
 В свойство обїекта запишеться значеение по имени переменной віше В свойство обїекта запишеться значеение по имени переменной віше
 <code> <code>
Строка 104: Строка 136:
 console.log(user.age); // 25 console.log(user.age); // 25
 </code> </code>
-===== Вичисливаемие значения (computed properties) =====+==== Вичисливаемие значения (computed properties) ====
 <code> <code>
 const propName = "name"; const propName = "name";
Строка 115: Строка 147:
 console.log(user.name); // "Henry Sibola" console.log(user.name); // "Henry Sibola"
 </code> </code>
-===== Обхід властивостей обїека =====+===== Добавление свойств обїекта ===== 
 +Операція додавання нової властивості після створення об'єкта нічим не відрізняється від зміни значення вже існуючої властивості. 
 +<code> 
 +const book = { 
 +  title: "The Last Kingdom", 
 +  author: "Bernard Cornwell", 
 +  genres: ["historical prose", "adventure"], 
 +  isPublic: true, 
 +  rating: 8.38, 
 +}; 
 + 
 +book.pageCount = 836; 
 +</code> 
 +===== Обхід обїекта ===== 
 +==== через for..in ====
 <code> <code>
 const book = { const book = {
Строка 128: Строка 174:
   console.log(book[keyOfObject]);  // Значення властивості з таким ключем   console.log(book[keyOfObject]);  // Значення властивості з таким ключем
 } }
 +</code>
 +==== Через Object.keys() ====
 +приймає об'єкт і повертає масив ключів його властивостей. Якщо в об'єкті немає властивостей, метод поверне порожній масив.
 +<code>
 +const book = {
 +  title: "The Last Kingdom",
 +  author: "Bernard Cornwell",
 +  genres: ["historical prose", "adventure"],
 +  rating: 8.38,
 +};
 +const keys = Object.keys(book);
 +console.log(keys); // ['title', 'author', 'genres', 'rating']
 +</code>
 +==== Через Object.values() ====
 +повертає масив значень його властивостей
 +<code>
 +const book = {
 +  title: "The Last Kingdom",
 +  author: "Bernard Cornwell",
 +  rating: 8.38,
 +};
 +
 +const values = Object.values(book);
 +console.log(values); // ["The Last Kingdom", "Bernard Cornwell", 8.38]
 +</code>
 +==== Через Object.entries() ====
 +Повертає масив власних перелічуваних пар властивостей ключ-значення з рядковими ключами.
 +==== обход массива обїектов ====
 +<code>
 +const books = [
 +  { title: "The Last Kingdom", author: "Bernard Cornwell", rating: 8.2 },
 +  { title: "Beside Still Waters", author: "Robert Sheckley", rating: 9 },
 +  { title: "The Dream of a Ridiculous Man", author: "Fyodor Dostoevsky", , rating: 6.8 }
 +];
 +
 +let totalRating = 0;
 +
 +for (const book of books) {
 +  totalRating += book.rating;
 +}
 +
 +const averageRating = totalRating / books.length;
 +console.log(averageRating); // 8
 +</code>
 +===== Поиск в обїекте =====
 +==== Поиск в масиве обїектов ====
 +<code>
 +const books = [
 +  { title: "The Last Kingdom", author: "Bernard Cornwell" },
 +  { title: "Beside Still Waters", author: "Robert Sheckley" },
 +  { title: "The Dream of a Ridiculous Man", author: "Fyodor Dostoevsky" }
 +];
 +
 +const authorToSearchFor = "Robert Sheckley";
 +
 +for (const book of books) {
 + if(book.author === authorToSearchFor) {
 + console.log(book);
 + console.log(book.title)
 + console.log(book.rating)
 + }
 +}
 +</code>
 +===== Модели (обїект данние + методи) =====
 +Об'єкти, які пов'язують дані та методи для роботи з цими даними, можна назвати «моделями».
 +  * Метод — це звичайна функція, оголошена як властивість об'єкта (див. приклад вище), а не як окрема змінна (див. перший приклад у розділі).
 +  * Для звернення до методу об'єкта використовується стандартний синтаксис із крапкою.
 +<code>
 +const bookShelf = {
 +  books: ["The Last Kingdom", "Dream Guardian"],
 +  // Це метод об'єкта
 +  getBooks() {
 +    return "Returning all books";
 +  },
 +  // Це метод об'єкта
 +  addBook(bookName) {
 + return `Adding book ${bookName}`;
 +  },
 +};
 +
 +// Виклики методів
 +bookShelf.getBooks(); // поверне "Returning all books"
 +bookShelf.addBook("New book 1"); // поверне "Adding book New book 1"
 +bookShelf.addBook("New book 2"); // поверне "Adding book New book 2"
 +</code>
 +==== Доступ до властивостей об'єкта ====
 +Для доступу до об'єкта в методі використовується не ім'я змінної цього об’єкта, наприклад bookShelf, а ключове слово **this**.
 +<code>
 +const bookShelf = {
 +  books: ["The Last Kingdom", "The Mist"],
 +  getBooks() {
 +    console.log(this);
 +  },
 +};
 +
 +bookShelf.getBooks(); // {books: ["The Last Kingdom", "The Mist"], getBooks: f}
 +</code>
 +
 +===== Обїединение обїектов =====
 +==== ...spread ====
 +(...spread) дозволяє розпилити властивості довільної кількості об'єктів в один новий.
 +Порядок розподілу має значення. Імена властивостей об'єкта — унікальні, тому властивості об'єкта, що розпиляються, можуть перезаписати значення вже існуючої властивості, якщо їх імена збігаються.
 +<code>
 +const first = { propA: 5, propB: 10 };
 +const second = { propC: 15 };
 +const third = { ...first, ...second };
 +console.log(third); // { propA: 5, propB: 10, propC: 15 }
 +</code>
 +===== Деструктурізація =====
 +<code>
 +'use strict';
 +
 +let options = {
 +  title: "Меню",
 +  width: 100,
 +  height: 200
 +};
 +
 +let {title, width, height} = options;
 +
 +alert(title);  // Меню
 +alert(width);  // 100
 +alert(height); // 200
 </code> </code>
  
  • /sites/data/attic/objavlenie_obekta.1699726338.txt.gz
  • Последнее изменение: 2023/11/11 18:12
  • tro