Посібник по TypeScript

Визначення функції

У javascript функції визначаються за допомогою ключового слова function, наприклад:

function add(a, b) {
    return a + b;
}
// використання функції
let result1 = add(1, 2); // результат 3
let result2 = add("1", "2"); // результат 12

TypeScript також визначає функцію за допомогою ключового слова function, але при цьому додає додаткові можливості щодо роботи з функціями. Зокрема, тепер ми можемо визначити тип переданих параметрів і тип значення, що повертається.

Параметри функції

Функція може мати параметри, які вказуються після назви функції в дужках через кому. Через двокрапку після імені параметра вказується його тип:

// визначення функції
function add(a: number, b: number){
    let result = a + b;
    console.log(result);
}
// виклик функції
add(20, 30); // 50
add(10, 15); //25

Однак оскільки параметри мають тип number, то під час виклику функції

add("1", "2");

компілятор TS видасть помилку, оскільки параметри повинні мати тип number, а не тип string.

При цьому функція може не тільки використовувати передані параметри, а й глобальні змінні, визначені зовні:

let koef: number = 1,5;
 
function add(a: number){
    let result = a *koef;
    console.log(result);
}
 
add(20); // 30
add(10); //15

Результат функції

Функція може повертати значення певного типу, який ще називається типом функції. Тип функції, що повертається, ставиться після списку параметрів через двокрапку:

function add(a: number, b: number): number {
    return a + b;
}
let result = add(1, 2);
console.log(result);

У цьому випадку функція повертатиме значення типу number.

Якщо функція нічого не повертає, то вказується тип void:

function add(a: number, b: number): void {
    console.log(a + b);
}
add(10, 20);

У принципі ми можемо і не вказувати тип, тоді він буде виводитися неявно на основі значення, що повертається:

function add(a: number, b: number) {
    return a + b;
}
let result = add(10, 20);

Необов'язкові параметри

У typescript під час виклику у функцію має передаватися рівно стільки значень, скільки в ній визначено параметрів:

function getName(firstName: string, lastName: string) {
    return firstName + " " + lastName;
}
 
let name1 = getName("Іван", "Кузнєцов");
let name2 = getName("Іван", "Михайлович", "Кузнєцов"); // помилка, багато параметрів
let name3 = getName("Іван"); //помилка, мало параметрів

Щоб мати можливість передавати різну кількість значень у функцію, у TS деякі параметри можна оголосити як необов'язкові. Необов'язкові параметри мають бути позначені знаком питання ?. Причому необов'язкові параметри повинні йти після обов'язкових:

function getName(firstName: string, lastName: string) {
    if (lastName)
        return firstName + " " + lastName;
    else
        return firstName;
}
  
let name1 = getName("Іван", "Кузнєцов");
console.log(name1); // Іван Кузнєцов
let name2 = getName("Вася");
console.log(name2); // Вася

У другому випадку, коли у функцію передається тільки ім'я, другий параметр, що використовується, матиме невизначене значення або "undefined". Тому за допомогою умовної конструкції перевіряється наявність значення для цього параметра.

Значення параметрів за замовчуванням
Параметри дозволяють задати початкове значення за замовчуванням. І якщо для такого параметра не передається значення, то він використовує значення за замовчуванням:

function getName(firstName: string, lastName: string="Іванов") {
     
    return firstName + " " + lastName;
}
 
let name1 = getName("Іван", "Кузнєцов");
console.log(name1); // Іван Кузнєцов
let name2 = getName("Вася");
console.log(name2); // Вася Іванов

Причому як значення можна передавати результат іншого виразу:

function defaultLastName(): string{
    return "Smith";
}
 
function getName(firstName: string, lastName: string=defaultLastName()) {
     
    return firstName + " " + lastName;
}
 
let name1 = getName("Tom");
console.log(name1); // Том Сміт