objavlenie_funkcii

Различия

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

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

Предыдущая версия справа и слева Предыдущая версия
Следующая версия 		Предыдущая версия
objavlenie_funkcii [2023/11/13 21:01]
tro [Обявление стрелочной функции] 		objavlenie_funkcii [2023/11/20 21:20] (текущий)
tro [Виклик функціхї]
Строка 42: Строка 42:
 </code> </code>
  
-===== Обявление стрелочной функции =====+===== Обявление стрелочной функции (Неявне повернення) =====
  
 <code> <code>
Строка 54: Строка 54:
   return a + b + c;   return a + b + c;
 }; };
 +</code>
 +
 +Якщо параметр один, його можна оголошувати без круглих дужок.
 +<code>
 +const add = a => {
 +  return a + 5;
 +};
 +</code>
 +
 +Якщо параметри відсутні, то обов'язково повинні бути порожні круглі дужки.
 +<code>
 +const greet = () => {
 +  console.log("Hello!");
 +};
 +</code>
 +<code>
 +// До
 +function classicAdd(a, b, c) {
 +  return a + b + c;
 +}
 +
 +// Після
 +const arrowAdd = (a, b, c) => a + b + c;
 </code> </code>
 ===== Обявление коллбєк функції ===== ===== Обявление коллбєк функції =====
Строка 92: Строка 115:
 return elementOfMassiv*3 return elementOfMassiv*3
 }) })
 +</code>
 +**Приклад: Функція має повертати масив імен усіх користувачів (властивість name) із масиву users.**
 +<code>
 +const getUserNames = (array) => {
 +  const newArray = [];
 +
 +  array.forEach(element => {
 +    newArray.push(element.name);
 +  });
 +
 +  return newArray;
 +};
 </code> </code>
 ===== Встановлення значення параметру за-замовчанням ===== ===== Встановлення значення параметру за-замовчанням =====
Строка 102: Строка 137:
 ===== Получение аргументов в функции ===== ===== Получение аргументов в функции =====
 ==== arguments ==== ==== arguments ====
 +=== Для звичайної функції ===
 змінна (псевдомасив) за замовченням куди будуть передаватись усі передані аргументи змінна (псевдомасив) за замовченням куди будуть передаватись усі передані аргументи
 <code> <code>
Строка 115: Строка 151:
  
 console.log(multiply(1, 2, 3)); //  6 console.log(multiply(1, 2, 3)); //  6
 +</code>
 +
 +=== Для стрілочної функції ===
 +У стрілочних функцій немає локальної змінної arguments, що містить усі аргументи. Якщо необхідно зібрати всі аргументи в масив, використовується операція rest.
 +<code>
 +const add = (...args) => {
 +  console.log(args);
 +};
 +
 +add(1, 2, 3); // [1, 2, 3]
 </code> </code>
 ==== rest ==== ==== rest ====
 +=== Для звичайної функції ===
 +
 (...rest). Це спеціальний синтаксис, який дозволяє зібрати групу незалежних елементів у **масив**. Тих що не попали у очикувані параметри. Замість rest може бути люба назва. Головне синтаксис. (...rest). Це спеціальний синтаксис, який дозволяє зібрати групу незалежних елементів у **масив**. Тих що не попали у очикувані параметри. Замість rest може бути люба назва. Головне синтаксис.
 **Використовуєтся при описі функції**. **Використовуєтся при описі функції**.
Строка 128: Строка 176:
 multiply(1, 2, 3, 4); // 1 2 [3, 4] multiply(1, 2, 3, 4); // 1 2 [3, 4]
  
 +</code>
 +=== Для стрілочної функції ===
 +У стрілочних функцій немає локальної змінної arguments, що містить усі аргументи. Якщо необхідно зібрати всі аргументи в масив, використовується операція rest.
 +<code>
 +const add = (...args) => {
 +  console.log(args);
 +};
 +
 +add(1, 2, 3); // [1, 2, 3]
 </code> </code>
 ==== spread ==== ==== spread ====
Строка 136: Строка 193:
 console.log(Math.max(...temps)); // 25 console.log(Math.max(...temps)); // 25
 </code> </code>
 +==== Виклик функції ====
 +=== Створення функції як методу змінної-обїекта ===
 +<code>
 +const user = {
 +  username: "Poly",
 +  showThis() {
 +    console.log(this);
 +  }
 +};
 +
 +user.showThis(); // {username: "Poly", showThis: ƒ}
 +</code>
 +=== Створення фунції і присвоєння її до властивості обїекту ===
 + присвоюємо цю функцію властивості об'єкта і викликаємо її як метод цього об'єкта.
 +<code>
 +"use strict";
 +
 +function showThis() {
 +  console.log("this in showThis: ", this);
 +}
 +
 +const user = {
 +  username: "Poly",
 +};
 +
 +user.showContext = showThis;
 +
 +// Викликаємо в контексті об'єкта
 +user.showContext(); // this in showThis: {username: "Poly", showContext: ƒ}
 +
 +// Викликаємо в глобальному контексті
 +showThis(); // "this in showThis: undefined"
 +</code>
 +===== Вказання контексту виклику функції =====
 +==== call ====
 +<code>
 +foo.call(thisArg, arg1, arg2, ...)
 +</code>
 +  * thisArg — об'єкт, який ми хочемо встановити як контекст (значення this) для функції
 +  * arg1, arg2, ... — необов'язкові аргументи, які будуть передані функції
 +Метод call викликає функцію foo так, що значення this у функції буде посилатися на об'єкт thisArg, і також передає їй аргументи arg1, arg2 тощо.
 +==== apply ====
 +Метод apply є аналогом методу call. Відмінність у тому, що в методі apply() синтаксис передачі аргументів вимагає масиву, навіть якщо аргументи функції — це окремі значення.
 +<code>
 +foo.apply(thisArg, [arg1, arg2, ...])
 +</code>
 +==== bind ====
 +Метод bind створює і повертає нову функцію, яка має заздалегідь встановлений контекст, і ця нова функція може бути викликана пізніше з будь-якими аргументами.
 +<code>
 +const boundFoo = foo.bind(thisArg, arg1, arg2, ...)
 +</code>
 +Приклад
 +<code>
 +"use strict";
 +
 +const customer = {
 +  username: "Jacob",
 + sayHello() {
 + console.log(`Hello, ${this.username}!`);
 +  }
 +};
 +
 +customer.sayHello(); // "Hello, Jacob!"
 +
 +const greet = customer.sayHello.bind(customer);
 +
 +greet(); // "Hello, Jacob!"
 +</code>
 +Коли ми використовуємо bind(), ми створюємо нову функцію greet. Ця нова функція завжди матиме правильний контекст і може використовувати властивість username об'єкта customer.
 +
  
  • /sites/data/attic/objavlenie_funkcii.1699909302.txt.gz
  • Последнее изменение: 2023/11/13 21:01
  • — tro