Вивчайте Трансформація Масивів за Допомогою Методу map() | Розширені Методи Масивів та Трансформації

У цьому розділі розглядаються кілька поширених методів роботи з масивами у JavaScript. JS пропонує широкий вибір методів, але ми зосередимося саме на тих, які є незамінними у повсякденному програмуванні: map(), filter(), find(), reduce() та sort(). Ці методи обрані за їхню практичну користь, оскільки вони вирішують типові завдання, що часто зустрічаються під час написання коду.

Повний перелік усіх методів масивів можна знайти в офіційній документації MDN.

map()

Метод map() ітерує кожен елемент вихідного масиву та застосовує до нього вказану callback-функцію, створюючи новий масив.

Базовий синтаксис:

array.map((element, index, array) => {
  // Callback body
});

element: поточний елемент, який обробляється у масиві;
index: індекс поточного елемента у масиві. Вказує на позицію елемента у масиві;
array: масив, до якого було застосовано метод map(). Посилається на вихідний масив, що ітерується.

Розглянемо, що саме означають element, index та array:


              12345
            
const products = ["Ball", "Shoes", "Mouse"];

const modifiedProducts = products.map((element, index, array) => {
  console.log(`Element: ${element}, Index: ${index}, Array: ${array}`);
});

Основні моменти щодо map():

Виконує ітерацію по кожному елементу вихідного масиву;
Не змінює вихідний масив;
Результат функції зворотного виклику використовується для створення нового масиву;
Повертає новий масив такої ж довжини.

Трансформація елементів масиву

Метод map() особливо корисний, коли потрібно трансформувати кожен елемент масиву без зміни самого масиву. Розгляньте наступний приклад:


              12345678910
            
const numbers = [3, 5, 11, 32, 87];

/* Use the `map` method to create a new array (`doubledNumbers`) 
  by doubling each element of the `numbers` array. */
const doubledNumbers = numbers.map((element) => {
  return element * 2;
});

console.log("Initial array:", numbers); // Output: 3, 5, 11, 32, 87
console.log("Modified array:", doubledNumbers); // Output: 6, 10, 22, 64, 174

1. Що робить метод `map()`?

2. Яка ключова характеристика методу `map()`?

3. У наведеному нижче прикладі, що виконує `strings.map((element) => (element += "!"))`?

Все було зрозуміло?

Дякуємо за ваш відгук!

Секція 5. Розділ 1

Запитати АІ

Запитайте про що завгодно або спробуйте одне із запропонованих запитань, щоб почати наш чат

Awesome!

Completion rate improved to 2.27

Свайпніть щоб показати меню

Повний перелік усіх методів масивів можна знайти в офіційній документації MDN.

map()

Базовий синтаксис:

array.map((element, index, array) => {
  // Callback body
});

element: поточний елемент, який обробляється у масиві;
index: індекс поточного елемента у масиві. Вказує на позицію елемента у масиві;
array: масив, до якого було застосовано метод map(). Посилається на вихідний масив, що ітерується.

Розглянемо, що саме означають element, index та array:


              12345
            
const products = ["Ball", "Shoes", "Mouse"];

const modifiedProducts = products.map((element, index, array) => {
  console.log(`Element: ${element}, Index: ${index}, Array: ${array}`);
});

Основні моменти щодо map():

Виконує ітерацію по кожному елементу вихідного масиву;
Не змінює вихідний масив;
Результат функції зворотного виклику використовується для створення нового масиву;
Повертає новий масив такої ж довжини.

Трансформація елементів масиву


              12345678910
            
const numbers = [3, 5, 11, 32, 87];

/* Use the `map` method to create a new array (`doubledNumbers`) 
  by doubling each element of the `numbers` array. */
const doubledNumbers = numbers.map((element) => {
  return element * 2;
});

console.log("Initial array:", numbers); // Output: 3, 5, 11, 32, 87
console.log("Modified array:", doubledNumbers); // Output: 6, 10, 22, 64, 174

1. Що робить метод `map()`?

2. Яка ключова характеристика методу `map()`?

3. У наведеному нижче прикладі, що виконує `strings.map((element) => (element += "!"))`?

Все було зрозуміло?

Дякуємо за ваш відгук!

Секція 5. Розділ 1

Трансформація Масивів за Допомогою Методу map()

map()

Основні моменти щодо map():

Трансформація елементів масиву

1. Що робить метод map()?

2. Яка ключова характеристика методу map()?

3. У наведеному нижче прикладі, що виконує strings.map((element) => (element += "!"))?

Awesome!

Трансформація Масивів за Допомогою Методу map()

map()

Основні моменти щодо map():

Трансформація елементів масиву

1. Що робить метод map()?

2. Яка ключова характеристика методу map()?

3. У наведеному нижче прикладі, що виконує strings.map((element) => (element += "!"))?

1. Що робить метод `map()`?

2. Яка ключова характеристика методу `map()`?

3. У наведеному нижче прикладі, що виконує `strings.map((element) => (element += "!"))`?

1. Що робить метод `map()`?

2. Яка ключова характеристика методу `map()`?

3. У наведеному нижче прикладі, що виконує `strings.map((element) => (element += "!"))`?