Loftschool школа онлайн обучения IT профессиям
Профессии
  • Веб-разработчик
  • Frontend разработчик
  • Backend разработчик
  • Full Stack разработчик
  • Интернет-маркетолог
  • Android-разработчик
  • UX/UI Дизайнер
Курсы
          • Основы вёрстки
          • Веб для начинающих
          • JavaScript
          • Vue.js
          • React.js
          • Node.js
          • PHP
          • Контекстная реклама
          • SMM
          • SEO для всех
          • Android: базовый
          • Android: продвинутый
          • UX/UI-дизайн: базовый
          • UX/UI-дизайн: PRO
          • Python для начинающих
          • Python: машинное обучение
        Профессия Дизайнер со скидкой
        -20%
        До конца акции:
        14
        23
        21
        Дней
        Часов
        Минут
        • Главная
        • Блог
        • Статьи
        • Урок 4. Основы программирования. Функции
        Полезный блог
        Статьи
        Опубликовано 17.11.2020 10:07

        Урок 4. Основы программирования. Функции

        Чем больше в вашей программе строк, тем сложнее она для понимания. Поскольку программу придётся актуализировать, дополнять и изменять бесконечно, то объёмный код в этой задаче не помощник. Для его упрощения есть функции. Благодаря им вы сократите время на разработку и уберёте дублирующиеся части. Понимать и тестировать программу станет проще. Как всё работает, сейчас покажем.

        Сначала теория

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

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

        Зачем обращаться к функции? Чтобы не прописывать тот же самый алгоритм повторно в другом месте. Вместо этого достаточно написать только имя функции. Код становится лаконичным и понятным, его легко отлаживать и сопровождать.

        Объясняем

        Например, вы хотите написать программу, которая проигрывает песню. И в ней 5 раз звучит игра на барабанах. Вы бы прописали следующий алгоритм для барабанщика:

        1. Взять палочки.

        2. Поднять руку.

        3. Совершить удар по барабану.

        4. Нажать на педаль ногой.

        5. Помотать головой в такт.

        Без функции вам пришлось бы прописывать 5 раз одно и то же в тех частях композиции, где нужны ударные. Но гораздо удобнее оформить этот алгоритм в функцию playDrums и вызывать её каждый раз, когда необходимо. Это экономит время.

        По сути, это алгоритм в алгоритме, который вызывается по имени с помощью команды. Например, лай собаки – это функция, которая выполняется по определённому алгоритму и вызывается командой «Голос».

        Аргументы

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

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

        Например, если взять функцию человека ходить, то в качестве аргументов в неё передаётся «обувь».

        Обувь – это параметр.

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

        Кроссовки и сапоги – это аргументы.

        Алгоритм при этом не поменяется: каждый раз человек ходит одинаково, но в разной обуви.

        При вызове функции в строке происходит следующее:

        1. Язык программирования находит её в той части программы, где она прописана.

        2. Выполняет команды, содержащиеся в ней, с учетом указанных при вызове аргументов.

        3. Возвращается обратно к строке, которая её вызвала.

        4. Переходит к следующей строке.

        Некоторые функции уже встроены в язык программирования, например, console.log() в JavaScript, с которой мы уже познакомились :)

        Пользовательские функции

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

        В JavaScript специальное слово для определения функций – function. После него указывается:

        — название;

        — список аргументов в круглых скобках;

        — тело функции в фигурных скобках.

        Создадим простейшую функцию без параметров с именем greeting, которая будет выводить строку 'Hello!':

        function greeting() {
         console.log('Hello!');
        }

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

        Если позже нам понадобится вызвать функцию в другой части программы, то мы вызовем её только по имени – «greeting();» – и нажмём :

        greeting();

        Увидим в консоли результат:

        "Hello!"

        Функция выполнена.

        Тренировка

        1. Напишем на JS функцию height() с двумя аргументами: высота в полных метрах (m) и остаток в сантиметрах (cm). Объявление функции выглядит так:

        function height(m, cm) {
        }

        (m, cm) - это параметры, которые необходимо передавать в функцию, чтобы она заработала.

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

        2. По нашей задумке функция height() должна вычислять общую высоту в сантиметрах и выводить её в консоль. Для этого мы составим формулу вычисления, по которой функция произведет расчёт:

        100 * m + cm 

        Мы указали, что для расчета общей высоты в сантиметрах необходимо взять значение аргумента m, умножить его на 100, а затем прибавить значение аргумента cm.

        3. Запишем эту формулу в переменную total. Наша функция теперь выглядит так:

        function height(m, cm) {
        	let total = 100 * m + cm;
        }

        4. Попросим функцию сразу выводить значение переменной total, которое получилось после произведённого рассчета:

        function height(m, cm) {
        	let total = 100 * m + cm;
        	console.log(total);
        }

        5. Вызовем функцию с аргументами 1 и 70:

        height(1,70);

        Что произойдёт? Компьютер понимает, что функции height(m, cm) переданы аргументы 1 и 70 и подставляет их соответственно: m = 1, cm = 70. Затем производится расчёт по формуле:

        100*1+70

        Результат вычисления 170 записывается в переменную total. Далее – значение переменной total выводится в консоль:

        170

        6. Теперь попросим функцию выводить не просто результат расчёта, а добавлять к нему обозначение результата 'cm tall' и снова вызовем функцию с теми же аргументами:

        function height(m, cm) {
        	let total = 100 * m + cm;
        	console.log(total + 'cm tall');
        }
        height(1,70);

        Алгоритм работы функции не поменяется. Но при выводе результата вычисления – в нашем случае 170 – выполняется конкатенация (склейка) двух строк таким образом:

        — значение переменной total автоматически преобразуется в строку благодаря неявному преобразованию в JavaScript: число 170 превращается в строку '170';

        — строка 'cm tall' склеивается со строкой '170'.

        Теперь результат в консоли выглядит так:

        "170cm tall"

        Возвращение значений

        Функции могут возвращать значения – результаты вычислений. Эти значения удобно присвоить переменной и использовать при необходимости для выполнения дальнейших вычислений.

        Чтобы «научить» функцию возвращать значения потребуется ввести ключевое слово return. А после него указать значение какой переменной необходимо вернуть.

        Напишем функцию с именем calc(), которая бы принимала два числовых параметра и суммировала их. Запишем алгоритмическое выражение в переменную total:

        function calc(a,b) {
        	let total = a + b;
        }

        Справка! Переменной присваивается не само выражение a + b, а результат, который в итоге получится.

        Теперь попросим функцию возвращать значение переменной total:

        function calc(a,b) {
        	let total = a + b;
        	return total;
        }

        При вычислении функция получит результат, присвоит его переменной total и вернёт это значение как результат функции.

        Например, вызовем функцию calc() с параметрами 4 и 5:

        console.log(calc(4,5));

        Результат:

        9

        Такие хитрости упрощают жизнь разработчика. Без функций на прописывание повторов в коде уходило бы время, за которое программист напишет еще 30-40% программы.

        Домашнее задание

        Напишите функцию на языке JavaScript, которая бы считала количество минут в днях.

          Поделись публикацией

          Категории

          • Все записи блога
            • Трудоустройство
              • Истории выпускников LoftSchool
              • Полезные советы
            • Полезные ссылки
              • Книги
              • Инструменты
            • Новости школы
              • Команда LoftSchool
              • Информация о курсах
            • Статьи
              • Архив материалов
                • DevNews
                • DevShow
                • Loftnews
                • Loftschool
                • Loftvlog
                • Интервью
                • Видеоуроки
              • © 2012 - 2023 LOFT

                Школа онлайн образования

              • © 2012 - 2023 LOFT

                Школа онлайн образования

                • +7 (800) 600 09 54
                • +7 (812) 339 22 01
                • [email protected]
                УчастникSkolkovo
              • Полезная рассылка

                Подпишись, чтобы быть в курсе наших новостей, акций и скидок.

              • Полезное
                • О нас
                • Карта курсов
                • B2B
                • Работодателям
                • Партнерская программа
                • Вакансии
                • Стать автором
                • Подарочные сертификаты
                • Вебинары
                • Блог
                • FAQ
              • Информация
                • Публичная оферта портала
                • Политика конфиденциальности
                Безопасная передача данных