Функции TypeScript

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

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

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

Определение функции

Функция — это блок кода, заключённый в фигурные скобки, перед которым стоит ключевое слово function:

Синтаксис выглядит так:

function function_name()
{
    // 执行代码
}

Пример

TypeScript

function () { //Определение функции console.log("Вызов функции") }

Вызов функции

Функция может выполнить код внутри себя только при вызове.

Синтаксис выглядит так:

function_name()

Пример

TypeScript

function test() { //Определение функции console.log("Вызов функции") } test() //Вызов функции

Возвращаемое значение функции

Иногда мы хотим, чтобы функция возвращала результат своего выполнения в то место, откуда она была вызвана.

Это можно сделать с помощью оператора return.

Когда используется оператор return, функция прекращает выполнение и возвращает указанное значение.

Синтаксис выглядит так:

function function_name():return_type { 
    // 语句
    return value; 
}

return_type — это тип возвращаемого значения.
После ключевого слова return следует результат, который нужно вернуть.
Как правило, функция имеет только один оператор return.
Тип возвращаемого значения должен соответствовать типу возврата (return_type), определённому в функции.

Пример

TypeScript

//Определение функции function greet():string { //Вернуть строку return "Hello World" } function caller() { var msg = greet() //Вызовите функцию greet() console.log(msg) } //Вызов функции caller()

В примере определена функцияgreet(), и тип возвращаемого значения — string.
greet()Функция возвращается в место, откуда была вызвана, через оператор return, то есть в переменную msg, а затем выводит возвращаемое значение.

Скомпилируйте приведённый выше код, чтобы получить следующий код JavaScript:

JavaScript

//Определение функции function greet() { return "Hello World"; } function caller() { var msg = greet(); //Вызовите функцию greet() console.log(msg); } //Вызов функции caller();

Функции с параметрами

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

Эти параметры можно использовать внутри функции.

Вы можете передать функции несколько параметров, при этом каждый параметр разделяется запятой,:

Синтаксис выглядит так:

function func_name( param1 [:datatype], param2 [:datatype]) {   
}

param1 и param2 — это имена параметров.
datatype — это тип параметра.

Пример

TypeScript

function add(x: number, y: number): number { return x + y; } console.log(add(1,2))

В примере определена функцияadd(), и тип возвращаемого значения — number.
add()Функция определяет два параметра типа number, складывает эти два параметра и возвращает результат.

Скомпилируйте приведённый выше код, чтобы получить следующий код JavaScript:

JavaScript

function add(x, y) { return x + y; } console.log(add(1, 2));

Вывод:

Необязательные и параметры по умолчанию

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

В функциях TypeScript, если мы определяем параметры, мы должны передавать эти параметры, если только не установим их как необязательные. Необязательные параметры обозначаются знаком вопроса ?.

Пример

TypeScript

function buildName(firstName: string, lastName: string) { return firstName + " " + lastName; } let result1 = buildName("Bob"); //Ошибка, отсутствует параметр let result2 = buildName("Bob", "Adams", "Sr."); //Ошибка, слишком много параметров let result3 = buildName("Bob", "Adams"); //Правильно

В следующем примере мы задаём lastName как необязательный параметр:

TypeScript

function buildName(firstName: string, lastName?: string) { if (lastName) return firstName + " " + lastName; else return firstName; } let result1 = buildName("Bob"); //Верно let result2 = buildName("Bob", "Adams", "Sr."); //Ошибка, слишком много параметров let result3 = buildName("Bob", "Adams"); //Правильно

Необязательные параметры должны следовать за обязательными параметрами. Если в приведенном выше примере мы хотим, чтобы firstName был необязательным, а lastName — обязательным, то нам нужно изменить их порядок и поставить firstName последним.

Неважно, если все параметры необязательные.

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

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

function function_name(param1[:type],param2[:type] = default_value) { 
}

Примечание: параметр не может быть одновременно необязательным и иметь значение по умолчанию.

Пример

В следующем примере параметр rate функции установлен в значение по умолчанию 0.50. Когда функция вызывается без передачи параметра, используется значение по умолчанию:

TypeScript

function calculate_discount(price:number,rate:number = 0.50) { var discount = price * rate; console.log("Результат вычисления:",discount); } calculate_discount(1000) calculate_discount(1000,0.30)

Скомпилируйте приведённый выше код, чтобы получить следующий код JavaScript:

JavaScript

function calculate_discount(price, rate) { if (rate === void 0) { rate = 0.50; } var discount = price * rate; console.log("Результат вычисления:", discount); } calculate_discount(1000); calculate_discount(1000, 0.30);

Вывод:

计算结果:  500
计算结果:  300

Остаточные параметры

Бывает ситуация, когда мы не знаем, сколько параметров передать в функцию. В таких случаях мы можем использовать rest-параметры, чтобы определить её.

Синтаксис rest-параметра позволяет передавать неопределённое количество параметров в виде массива.

TypeScript

function buildName(firstName: string, ...restOfName: string[]) { return firstName + " " + restOfName.join(" "); } let employeeName = buildName("Joseph", "Samuel", "Lucas", "MacKinzie");

Последний именованный параметр функции, restOfName, имеет префикс ..., и он становится массивом, состоящим из остальных параметров, с индексами от 0 (включительно) до restOfName.length (не включительно).

TypeScript

function addNumbers(...nums:number[]) { var i; var sum:number = 0; for(i = 0;i<nums.length;i++) { sum = sum + nums[i]; } console.log("Сумма равна:",sum) } addNumbers(1,2,3) addNumbers(10,10,10,10,10)

Скомпилируйте приведённый выше код, чтобы получить следующий код JavaScript:

JavaScript

Вывод:

和为： 6
和为： 50

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

Анонимная функция — это функция без имени.

Анонимные функции объявляются динамически во время выполнения программы. Помимо отсутствия имени функции, они такие же, как стандартные функции.

Мы можем присвоить анонимную функцию переменной, и такое выражение становится функциональным выражением.

Синтаксис выглядит так:

var res = function( [arguments] ) { ... }

Пример

Анонимная функция без параметров:

TypeScript

var msg = function() { return "hello world"; } console.log(msg())

Скомпилируйте приведённый выше код, чтобы получить следующий код JavaScript:

JavaScript

var msg = function () { return "hello world"; }; console.log(msg());

Вывод:

hello world

Анонимная функция с параметрами:

TypeScript

var res = function(a:number,b:number) { return a*b; }; console.log(res(12,2))

Скомпилируйте приведённый выше код, чтобы получить следующий код JavaScript:

JavaScript

var res = function (a, b) { return a * b; }; console.log(res(12, 2));

Вывод:

Самовызывающиеся анонимные функции

Анонимную функцию можно вызвать самостоятельно с помощью () после функции:

TypeScript

(function () { var x = "Hello!!"; console.log(x) })()

Скомпилируйте приведённый выше код, чтобы получить следующий код JavaScript:

JavaScript

(function () { var x = "Hello!!"; console.log(x) })()

Вывод:

Hello!!

Конструктор Function

TypeScript также поддерживает использование встроенного конструктора JavaScript Function() для определения функций:

Синтаксис выглядит так:

var res = new Function ([arg1[, arg2[, ...argN]],] functionBody)

Описание параметра:

arg1, arg2, ... argN: Список параметров.
functionBody: Строка, содержащая инструкции JavaScript, включая определение функции.

Пример

TypeScript

var myFunction = new Function("a", "b", "return a * b"); var x = myFunction(4, 3); console.log(x);

Скомпилируйте приведённый выше код, чтобы получить следующий код JavaScript:

JavaScript

var myFunction = new Function("a", "b", "return a * b"); var x = myFunction(4, 3); console.log(x);

Вывод:

Рекурсивные функции

Рекурсивная функция — это функция, которая вызывает саму себя внутри функции.

Например:
Жила-была гора, в горе был храм, в храме старый монах рассказывал сказку маленькому монаху! Что за сказка? «Жила-была гора, в горе был храм, в храме старый монах рассказывал сказку маленькому монаху! Что за сказка? 'Жила-была гора, в горе был храм, в храме старый монах рассказывал сказку маленькому монаху! Что за сказка? …'»

Пример

TypeScript

Скомпилируйте приведённый выше код, чтобы получить следующий код JavaScript:

JavaScript

Вывод:

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

Лямбда-функции также называют стрелочными функциями.

Выражения стрелочных функций имеют более короткий синтаксис, чем выражения функций.

Функция только с одним оператором:

( [param1, param2,…param n] )=>statement;

Пример

В следующем примере объявляется лямбда-функция, возвращающая сумму двух чисел:

TypeScript

var foo = (x:number)=>10 + x console.log(foo(100)) //Вывод: 110

Скомпилируйте приведённый выше код, чтобы получить следующий код JavaScript:

JavaScript

var foo = function (x) { return 10 + x; }; console.log(foo(100)); //Вывод: 110

Вывод:

Функция — это блок операторов:

( [param1, param2,…param n] )=> {
 
    // 代码块
}

Пример

В следующем примере объявляется лямбда-функция, возвращающая сумму двух чисел:

TypeScript

var foo = (x:number)=> { x = 10 + x console.log(x) } foo(100)

Компиляция приведённого выше кода создаёт следующий код JavaScript:

JavaScript

var foo = function (x) { x = 10 + x; console.log(x); }; foo(100);

Вывод:

Нам не нужно указывать типы параметров; типы выводятся внутри функции:

TypeScript

var func = (x)=> { if(typeof x=="number") { console.log(x+"является числом") } else if(typeof x=="string") { console.log(x+"является строкой") } } func(12) func("Tom")

Компиляция приведённого выше кода создаёт следующий код JavaScript:

JavaScript

Вывод:

12 是一个数字
Tom 是一个字符串

Один параметр()необязателен:

TypeScript

var display = x => { console.log("Вывод:"+x) } display(12)

Компиляция приведённого выше кода создаёт следующий код JavaScript:

JavaScript

var display = function (x) { console.log("Вывод:" + x); }; display(12);

Вывод:

输出为 12

Когда параметров нет, можно использовать пустые скобки:

TypeScript

var disp =()=> { console.log("Функция вызвана"); } disp();

Компиляция приведённого выше кода создаёт следующий код JavaScript:

JavaScript

var disp = function () { console.log("Вызов функции"); }; disp();

Вывод:

Call function

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

Перегрузка означает, что методы имеют одинаковое имя, но разные параметры, а возвращаемые типы могут быть одинаковыми или разными.

Каждый перегруженный метод (или конструктор) должен иметь уникальный список типов параметров.

Различные типы параметров:

function disp(string):void; 
function disp(number):void;

Разное количество параметров:

function disp(n1:number):void; 
function disp(x:number,y:number):void;

Разный порядок типов параметров:

function disp(n1:number,s1:string):void; 
function disp(s:string,n:number):void;

Если типы параметров различаются, тип параметра следует установить вany。

Если количество параметров различается, можно сделать различающиеся параметры необязательными.

Пример

В следующем примере определяются разные типы параметров и разное количество параметров:

TypeScript

function disp(s1:string):void; function disp(n1:number,s1:string):void; function disp(x:any,y?:any):void { console.log(x); console.log(y); } disp("abc") disp(1,"xyz");

Компиляция приведённого выше кода создаёт следующий код JavaScript:

JavaScript

function disp(x, y) { console.log(x); console.log(y); } disp("abc"); disp(1, "xyz");

Вывод:

abc
undefined
1
xyz

Другие расширения

Основы системы типов

Продвинутый уровень

Функции TypeScript

Определение функции

Пример

TypeScript

Вызов функции

Пример

TypeScript

Возвращаемое значение функции

Пример

TypeScript

JavaScript

Функции с параметрами

Пример

TypeScript

JavaScript

Необязательные и параметры по умолчанию

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

TypeScript

TypeScript

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

TypeScript

JavaScript

Остаточные параметры

TypeScript

TypeScript

JavaScript

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

Пример

TypeScript

JavaScript

TypeScript

JavaScript

Самовызывающиеся анонимные функции

TypeScript

JavaScript

Конструктор Function

Пример

TypeScript

JavaScript

Рекурсивные функции

Пример

TypeScript

JavaScript

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

Пример

TypeScript

JavaScript

Пример

TypeScript

JavaScript

TypeScript

JavaScript

TypeScript

JavaScript

TypeScript

JavaScript

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

Пример

TypeScript

JavaScript