TypeScript — Функции скрипта

TypeScript — Функции скрипта

От автора: функции скрипта – это структурные элементы читаемого, легкого в сопровождении и повторно используемого кода. Функция – это набор операторов, которые выполняют определенные задачи. Функции организуют программу в логические блоки кода. Когда функции уже определены, их можно вызвать для получения доступа к коду. Это делает код многократно используемым. Более того, функции помогают сделать код читаемым и легким в сопровождении.

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

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

Вызов функции — Для выполнения функция должна быть вызвана.

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

Фреймворк VUE JS: быстрый старт, первые результаты

Получите бесплатный курс и создайте веб-приложение на трендовой Frontend-технологии VUE JS с полного нуля

Узнать подробнее

Параметризованная функция — Параметры – это механизм передачи значений функциям.

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

Необязательные параметры можно использовать тогда, когда аргументы могут не передаваться обязательно для выполнения функции. Чтобы пометить параметр как необязательный, нужно добавить к его имени вопросительный знак. Необязательный параметр должен быть задан в качестве последнего аргумента в функции. Ниже приведен синтаксис объявления функции с дополнительным параметром:

Пример: необязательные параметры

Вышеприведенный код объявляет параметризованную функцию. Здесь третий параметр, то есть mail_id, является необязательным.

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

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

После компиляции мы получим следующий JavaScript код:

Приведенный выше код дает следующий результат:

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

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

Чтобы объявить остаточный параметр, нужно поставить троеточие перед именем параметра. Все неостаточные параметры должны указываться перед остаточными.

Пример: остаточные параметры

Объявление функции addNumbers() принимает остаточный параметр nums. Тип данных остаточного параметра должен быть задан массиву. Более того, функция может иметь не больше одного остаточного параметра.

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

Цикл for производит итерацию списка аргументов, переданных функции, и подсчитывает их сумму.

После компиляции мы получим следующий код JavaScript:

Приведенный выше код дает следующий результат:

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

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

Синтаксис

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

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

После компиляции мы получим следующий код JavaScript:

Приведенный выше код дает следующий результат:

В этом примере мы видим объявление функции calculate_discount. Данная функция имеет два параметра — price и rate.

Значение параметра rate задано по умолчанию 0.50 .

Программа вызывает функцию, передавая ей только значение параметра price. В данном случае значение rate составляет 0.50 (по умолчанию).

Вызывается та же самая функция, но с двумя аргументами. Значение rate по умолчанию переписано и задано как явно переданное значение.

Анонимная функция

Функции, не привязанные к идентификатору (имени функции), называются анонимными функциями. Эти функции динамично объявляют во время выполнения. Точно так же, как и стандартные функции, они могут принимать входные данные и выдавать результат. Анонимная функция обычно недоступна сразу после ее изначального создания.

Анонимная функция может быть назначена переменной. Такого рода выражение называется выражением функции.

Синтаксис

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

После компиляции мы получим тот же самый JavaScript код. Приведенный выше код дает следующий результат:

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

Анонимная функция возвращает произведение переданных ей значений. После компиляции мы получим следующий JavaScript код:

Приведенный выше код дает следующий результат:

Выражение и объявление функции – это синонимы?

Выражение и объявление функции – это не одно и тоже. В отличие от выражения функции, объявление функции связано с ее именем.

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

Когда анализатор JavaScript встречает функцию в потоке основного кода, это предполагает объявление функции. Когда функция выступает как часть оператора, это выражение функции.

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

TypeScript также поддерживает определение функций со встроенным конструктором JavaScript под названием Function().

Синтаксис

Пример

Новая Function() – это вызов конструктора, который по очереди создает и возвращает ссылки на функцию.

После компиляции мы получим тот же самый код JavaScript. Приведенный выше код дает следующий результат:

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

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

Пример: рекурсия

После компиляции мы получим тот же самый код JavaScript. Приведенный выше код дает следующий результат:

Фреймворк VUE JS: быстрый старт, первые результаты

Получите бесплатный курс и создайте веб-приложение на трендовой Frontend-технологии VUE JS с полного нуля

Узнать подробнее

Пример: анонимная функция рекурсии

После компиляции мы получим тот же самый код JavaScript. Приведенный выше код дает следующий результат:

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

Лямбда обозначает в программировании анонимные функции. Лямбда функции – это конкретный механизм представления анонимных функций. Эти функции также называются стрелочными функциями.

Лямбда-функции — структура

Лямбда-функции состоят из 3 частей:

Параметры – Функция может иметь параметры

Обозначение жирной стрелки/обозначение лямбды (=>) – Оно также называется переходом к оператору

Операторы − представляют набор инструкций функции

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

Лямбда выражение

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

Пример: лямбда выражение

Программа объявляет функцию лямбда выражения. Функция возвращает сумму 10 и переданного аргумента. После компиляции мы получим следующий код JavaScript:

Приведенный выше код дает следующий результат:

Лямбда выражение

Лямбда выражение – это объявление анонимной функции, которое указывает на блок кода. Этот синтаксис используется, когда тело функции охватывает несколько строк. Он выглядит следующим образом:

Пример: лямбда выражение

Ссылка на функцию возвращается и хранится в переменной foo. После компиляции мы получим следующий код JavaScript:

Приведенный выше код дает следующий результат:

Варианты синтаксиса

Вывод типа параметра

Указывать тип данных параметра не обязательно. В таком случае тип данных параметра будет задан как any. Давайте рассмотрим следующий фрагмент кода:

После компиляции мы получим следующий код JavaScript:

Приведенный выше код дает следующий результат:

Необязательные круглые скобки для единственного параметра

После компиляции мы получим следующий код JavaScript:

Приведенный выше код дает следующий результат:

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

После компиляции мы получим следующий JavaScript код:

Приведенный выше код дает следующий результат:

Перезапуск функции

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

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

Шаг 1 – Объявите множество функций с одинаковым именем, но разной сигнатурой. Сигнатура функции включает в себя следующее:

Тип данных параметра

Количество параметров

Последовательность параметров

Примечание – Сигнатура функции не включает в себя тип возвращаемой функции.

Шаг 2 – После объявление должно следовать определение функции. Типы параметров должны быть заданы как any, если типы параметров будут отличаться во время перезапуска. Дополнительно, для приведенного выше case b, вы можете сделать один или несколько параметров необязательными во время определения функции.

Шаг 3 – Наконец, вам нужно вызвать функцию, чтобы она запустилась.

Пример. Давайте рассмотрим следующий пример кода:

Первые две строчки иллюстрируют объявление перезапуска функции. Функция имеет два перезапуска:

Функция, которая принимает единственный параметр string.

Функция, которая принимает два значения типа number и string соответственно.

Третья строчка определяет функцию. Тип данных параметра задан как any. Более того, второй параметр здесь является необязательным.

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

После компиляции мы получим следующий JavaScript код:

Приведенный выше код дает следующий результат:

Источник: https://www.tutorialspoint.com/

Редакция: Команда webformyself.

Фреймворк VUE JS: быстрый старт, первые результаты

Получите бесплатный курс и создайте веб-приложение на трендовой Frontend-технологии VUE JS с полного нуля

Узнать подробнее

Курс по ES 6 (EcmaScript 6.0)

Прямо сейчас посмотрите курс по EcmaScript 6.0

Смотреть курс

Метки:

Похожие статьи:

Комментарии Вконтакте:

Комментарии Facebook:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">

Я не робот.

Spam Protection by WP-SpamFree