TypeScript - Функции: Путеводитель для начинающих

Здравствуйте, стремящиеся к программированию! Сегодня мы отправимся в увлекательное путешествие в мир функций TypeScript. Не волнуйтесь, если вы еще никогда не писали ни строчки кода — я буду вашим дружелюбным проводником, и мы будем двигаться шаг за шагом. К концу этого руководства вы будете удивлены тем, что можете сделать с функциями в TypeScript!

Что такое функция?

Прежде чем углубиться в детали, поймем, что такое функция. Представьте функцию как многоразовый рецепт. Точно так же, как вы следуете рецепту, чтобы испечь蛋糕, функция — это набор инструкций, выполняющих特定 задачу в вашей программе.

Вот пример простой функции в TypeScript:

function greet(name: string): string {
return `Привет, ${name}!`;
}

console.log(greet("Алиса")); // Вывод: Привет, Алиса!

В этом примере greet — это наша функция. Она принимает name в качестве входных данных и возвращает сообщение приветствия. : string после параметра и после скобок indicates, что функция принимает строку в качестве входных данных и возвращает строку.

Необязательные параметры

Иногда вы можете захотеть сделать параметр необязательным. В TypeScript это можно сделать, добавив ? после имени параметра.

function introduce(name: string, age?: number): string {
if (age) {
return `Привет, я ${name} и мне ${age} лет.`;
} else {
return `Привет, я ${name}.`;
}
}

console.log(introduce("Боб")); // Вывод: Привет, я Боб.
console.log(introduce("Чарли", 30)); // Вывод: Привет, я Чарли и мне 30 лет.

В этой функции age является необязательным. Если он предоставлен, мы включаем его в представление; если нет, мы пропускаем его.

Параметры rest

Параметры rest позволяют работать с множеством параметров как с массивом. Это как сказать: "Я не знаю, сколько ингредиентов вы дадите мне, но я использую их все в своем рецепте!"

function makeShake(...fruits: string[]): string {
return `Я сделал коктейль с ${fruits.join(", ")}.`;
}

console.log(makeShake("банан")); // Вывод: Я сделал коктейль с банан.
console.log(makeShake("клубника", "манго", "киви")); // Вывод: Я сделал коктейль с клубника, манго, киви.

Синтаксис ...fruits instructs TypeScript to take all provided arguments and put them into an array called fruits.

Параметры по умолчанию

Параметры по умолчанию — это как иметь план Б. Если кто-то не предоставляет значение, мы будем использовать значение по умолчанию.

function orderCoffee(size: string = "средний", type: string = "латте"): string {
return `Вы заказали ${size} ${type}.`;
}

console.log(orderCoffee()); // Вывод: Вы заказали средний латте.
console.log(orderCoffee("большой")); // Вывод: Вы заказали большой латте.
console.log(orderCoffee("маленький", "эспрессо")); // Вывод: Вы заказали маленький эспрессо.

Если вы не указываете размер или тип, это默认но medium latte. Как удобно!

Анонимные функции

Анонимные функции — это как тайные агенты — у них нет имени! Они часто используются, когда вам нужно быструю функцию, которую вы будете использовать только один раз.

let greet = function(name: string): string {
return `Привет, ${name}!`;
};

console.log(greet("Дэвид")); // Вывод: Привет, Дэвид!

Здесь мы назначили анонимную функцию переменной greet. Мы можем использовать greet так же, как и обычную функцию.

Конструктор функции

Конструктор функции — это способ динамически создавать функции. Это как собирать робота, который может выполнять задачи на основе инструкций, которые вы ему даете.

let multiply = new Function('a', 'b', 'return a * b');

console.log(multiply(4, 5)); // Вывод: 20

В этом примере мы создаем функцию, которая умножает два числа. Последний аргумент всегда является телом функции, а остальные — именами параметров.

Рекурсия и функции TypeScript

Рекурсия — это когда функция вызывает сама себя. Это как русские матрешки — каждая кукла содержит меньшую версию самой себя.

function countdown(n: number): void {
if (n <= 0) {
console.log("Взрыв!");
} else {
console.log(n);
countdown(n - 1);
}
}

countdown(3);
// Вывод:
// 3
// 2
// 1
// Взрыв!

Эта функция отсчитывает от заданного числа до нуля. Она продолжает вызывать сама себя с меньшим числом, пока не достигнет нуля.

Лямбда-функции

Лямбда-функции, также известные как стрелочные функции, являются缩短енной формой записи функций. Это как сокращения для функций в текстовых сообщениях!

let add = (a: number, b: number): number => a + b;

console.log(add(3, 4)); // Вывод: 7

Этот компактный синтаксис особенно полезен для коротких и простых функций.

Синтаксические вариации

TypeScript предлагает различные ways для определения функций. Вот таблица, резюмирующая различные синтаксисы:

Синтаксис	Пример
Function Declaration	function greet(name: string): string { returnПривет, ${name}!; }
Function Expression	let greet = function(name: string): string { returnПривет, ${name}!; };
Arrow Function	let greet = (name: string): string =>Привет, ${name}!;
Method in Object	let obj = { greet(name: string): string { returnПривет, ${name}!; } };
Async Function	async function fetchData(): Promise<void> { /* ... */ }

Перегрузы функций

Перегрузы функций позволяют определить несколько подписей функции для одной и той же функции. Это как иметь несколько рецептов для одного и того же блюда, в зависимости от того, какие ингредиенты у вас есть.

function makeNoise(animal: "cat"): string;
function makeNoise(animal: "dog"): string;
function makeNoise(animal: string): string {
switch(animal) {
case "cat":
return "Мяу";
case "dog":
return "Гав";
default:
return "Неизвестное животное";
}
}

console.log(makeNoise("cat")); // Вывод: Мяу
console.log(makeNoise("dog")); // Вывод: Гав

Эта функция может обрабатывать разные типы животных и издавать соответствующие звуки.

И вот мы и добрались до конца! Сегодня мы covered много ground, от базовых функций до более сложных концепций, таких как рекурсия и перегрузы функций. Помните, что обучение программированию похоже на изучение нового языка — это требует практики и терпения. Не бойтесь экспериментировать с этими концепциями и создавать свои собственные функции. Before you know it, вы будете писать сложные программы с легкостью. Счастливо кодить, и до свидания в следующем уроке!

Credits: Image by storyset