В JavaScript функции играют ключевую роль при создании программной логики. Они позволяют разбивать код на отдельные блоки для выполнения конкретных задач, а также помогают избежать дублирования кода.
Основные виды функций:
- Объявленные функции (Function Declaration)
- Анонимные функции (Function Expression)
- Стрелочные функции (Arrow Function)
- Конструктор функции (Constructor Function)
- Генерирующие функции (Generator Functions)
- Методы объектов
- Итераторы и другие специальные типы функций
1. Объявленная функция (Function Declaration)
Это классическая форма объявления функции с использованием ключевого слова function. Такие функции можно вызывать до их объявления благодаря механизму «поднятия» (hoisting).
Пример:
// Объявление функции
function greet(name) {
console.log(`Привет, ${name}!`);
}greet(«Иван»); // Привет, Иван!
2. Анонимная функция (Function Expression)
Анонимные функции не имеют имени и обычно присваиваются переменной или передаются как аргумент другой функции.
Пример:
// Создание анонимной функции через функцию-выражение
const sum = function(a, b) {
return a + b;
};console.log(sum(10, 20)); // 30
3. Стрелочная функция (Arrow Function)
Этот синтаксис был введен в ES6 и позволяет создавать более компактный и лаконичный код по сравнению с традиционными функциями. Важно отметить, что стрелочные функции не имеют своего контекста this, поэтому они особенно полезны при работе с методами массивов и обработчиками событий.
Пример:
// Простая стрелочная функция
const multiply = (a, b) => a * b;console.log(multiply(5, 8)); // 40
// Стрелочная функция без параметров
const sayHello = () => console.log(‘Привет!’);
sayHello(); // Привет!
4. Конструктор функции (Constructor Function)
Конструкторы используются для создания новых объектов. В них обычно задаются свойства объекта и методы, которые будут доступны всем экземплярам этого объекта.
Пример:
// Функция-конструктор
function Person(name, age) {
this.name = name;
this.age = age;this.greet = function() {
console.log(`Привет, меня зовут ${this.name}, мне ${this.age} лет.`);
};
}let ivan = new Person(«Иван», 25);
ivan.greet(); // Привет, меня зовут Иван, мне 25 лет.
5. Генерирующая функция (Generator Function)
Генерировать функции — это особый вид функций, который может приостановить выполнение своей работы и вернуть промежуточные результаты с помощью оператора yield.
Пример:
function* countToFive() {
for (let i = 1; i <= 5; i++) {
yield i;
}
}const generator = countToFive();
for (let value of generator) {
console.log(value); // Выведет числа от 1 до 5
}
6. Методы объектов
Методы — это функции, которые являются частью объекта. Они могут быть объявлены внутри литерала объекта или добавлены позже.
Пример:
// Объект с методом
const user = {
name: ‘Алексей’,
age: 28,
greet: function() {
console.log(`Привет, я ${this.name}, мне ${this.age} лет.`);
}
};user.greet(); // Привет, я Алексей, мне 28 лет.
Часто используемые встроенные функции
JavaScript предоставляет множество встроенных функций, которые упрощают работу с данными и объектами. Вот несколько примеров таких функций:
1. Array.prototype.map
Эта функция применяется к каждому элементу массива и возвращает новый массив с результатами обработки каждого элемента.
Пример:
const numbers = [1, 2, 3, 4];
const doubledNumbers = numbers.map(num => num * 2);console.log(doubledNumbers); // [2, 4, 6, 8]
2. Array.prototype.filter
Фильтрует элементы массива, оставляя только те, которые удовлетворяют условию, заданному функцией-предикатом.
Пример:
const numbers = [1, 2, 3, 4, 5, 6];
const evenNumbers = numbers.filter(num => num % 2 === 0);console.log(evenNumbers); // [2, 4, 6]
3. Array.prototype.reduce
Применяет функцию к каждому элементу массива, чтобы свести его к единственному значению.
Пример:
const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((acc, currentValue) => acc + currentValue, 0);console.log(sum); // 10
4. Object.keys
Возвращает массив ключей объекта.
Пример:
const person = { name: ‘Иван’, age: 35 };
const keys = Object.keys(person);console.log(keys); // [«name», «age»]
5. setTimeout
Позволяет выполнять функцию спустя указанный интервал времени.
Пример:
setTimeout(() => {
console.log(‘Привет через 2 секунды!’);
}, 2000);
6. Array.prototype.find
Эта функция находит первый элемент массива, который соответствует условию, заданному функцией-предикатом. Если такой элемент найден, возвращается сам элемент, иначе — undefined.
Пример:
const users = [
{ id: 1, name: ‘Иван’ },
{ id: 2, name: ‘Анна’ },
{ id: 3, name: ‘Сергей’ }
];const foundUser = users.find(user => user.id === 2);
console.log(foundUser); // { id: 2, name: ‘Анна’ }
7. String.prototype.split
Разбивает строку на массив подстрок, используя разделитель, который передается в качестве аргумента.
Пример:
const sentence = «Привет, мир!»;
const words = sentence.split(» «);console.log(words); // [«Привет,», «мир!»]
8. Math.random
Возвращает случайное число с плавающей точкой в диапазоне от 0 (включительно) до 1 (не включительно). Это одна из самых популярных функций для генерации случайных чисел.
Пример:
const randomNumber = Math.random();
console.log(randomNumber); // Например, 0.123456789
9. Date.now
Возвращает количество миллисекунд, прошедших с начала эпохи Unix (1 января 1970 года).
Пример:
const timestamp = Date.now();
console.log(timestamp); // Например, 1677823200000
10. JSON.stringify
Преобразует объект или значение в JSON-форматированную строку.
Пример:
const data = { name: ‘Иван’, age: 30 };
const jsonData = JSON.stringify(data);console.log(jsonData); // {«name»:»Иван»,»age»:30}
11. JSON.parse
Парсит строку, содержащую данные в формате JSON, и возвращает соответствующий объект.
Пример:
const jsonString = ‘{«name»:»Иван»,»age»:30}’;
const parsedData = JSON.parse(jsonString);console.log(parsedData); // { name: ‘Иван’, age: 30 }
12. Promise.resolve
Создает обещание, которое немедленно выполняется с указанным значением.
Пример:
Promise.resolve(‘Привет!’)
.then(message => console.log(message)); // Привет!
13. Promise.reject
Создает обещание, которое немедленно отклоняется с указанным причиной.
Пример:
Promise.reject(new Error(‘Ошибка!’))
.catch(error => console.error(error.message)); // Ошибка!
14. Array.isArray
Проверяет, является ли переданный аргумент массивом.
Пример:
const arr = [1, 2, 3];
const isArray = Array.isArray(arr);console.log(isArray); // true
15. Object.assign
Копирует значения всех перечисляемых свойств одного или нескольких исходных объектов в целевой объект.
Пример:
const obj1 = { a: 1 };
const obj2 = { b: 2 };
const mergedObj = Object.assign({}, obj1, obj2);console.log(mergedObj); // { a: 1, b: 2 }
Эти примеры показывают, насколько гибким и мощным инструментом является JavaScript, предоставляя разработчикам широкий спектр возможностей для решения различных задач.
Загрузка...