Супер простое объяснение функций JavaScript.

Супер простое объяснение функций JavaScript.

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

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

const imAFunction = function(name){
    return “Hello World, I’m “ + name + “!”;
};

Точно так же, как const foo = “Boo!”; — это строковая переменная, а const bar = 245; — целочисленная переменная, imAFunction — это функциональная переменная. На самом деле вы можете передавать функции в новые переменные точно так же, как и в другие типы данных: const imAFunctionToo = imAFunction; устанавливает imAFunctionToo равным

function(name){
    return “Hello World, I’m “ + name + “!”;
};

Уникальность функции по сравнению с целым числом, числом с плавающей запятой или строкой заключается в том, что она может что-то делать! И ключ, чтобы включить его, это скобки. Обратите внимание, что в абзаце выше я установил imAFunctionToo равным imAFunction? Передача таким образом, без () для включения, будет действовать так же, как присваивание любой другой переменной типа данных, но как только вы добавите (), произойдет волшебство: если бы я набрал const imAFunctionToo = imAFunction(“Chad”);, наша переменная с неподходящим именем, imAfunctionToo, не будет равно:

function(name){
    return “Hello World, I’m “ + name + “!”;
};

Вместо этого он будет равен строке «Hello World, I’m Chad!» Давайте посмотрим, как происходит волшебство.

Думайте о функции как о мини-программе, заключенной в коробку из фигурных скобок:

function add(){
    1 + 2;
};

— вполне допустимая функция, которая действительно будет добавлять 1 и 2. Вы можете назначить другую переменную, чтобы она равнялась ей, как я говорил: const myAdd = add; устанавливает myAdd равным function(){ 1 + 2; };, но что происходит, когда мы включаем ее с помощью скобки: const myAdd = add();? Ничего такого. Это не равно 3, это равно undefined. Что случилось? Это связано с тем, что, несмотря на то, что функция складывает внутри этих фигурных скобок, у нас нет возможности получить результаты сложения из коробки.

Вот тут-то и появляется return. Как ни странно, return говорит функции «вернуть» значение, которое находится в этой строке — разберитесь. Итак, давайте изменим добавить:

function add(){
    return 1 + 2;
};

.Теперь, когда мы назначаем const myAdd = add();, myAdd будет равно 3! Вы можете написать практически любой код внутри функции, и когда дело доходит до строки, начинающейся с return, она возвращает во внешний мир значение этой строки и останавливает функцию.

function returnDemo() {
    4 + 5; // Adds but doesn't go anywhere
    return 1 + 3; // This is what will be returned
    return 6 + 7; // We will never get to this line.
};

Итак, теперь мы можем получать значения из функции, что весьма полезно, но ограничено тем, что вы вложили в нее при написании программы. Что делать, если вы хотите передать некоторые данные в эту программу для работы? Помните, я сказал, что круглые скобки подобны ключу для включения функции? Я собираюсь немного расширить это: ключ часто является частью двери, и вы можете использовать эту дверь, чтобы передать что-то в функцию. Возьмите нашу функцию добавления сверху. Давайте изменим это, чтобы прикрепить ключ к двери:

function add(addend){
    return 1 + addend;
};

Поместив переменную в круглые скобки, мы сказали программе, что когда мы включаем добавление, мы также хотим отправить что-то в добавление и присвоить это этой переменной.

Итак, если я сделаю это с нашей функцией добавления: const sum = add(2);, это будет так, как если бы мы присвоили addend = 2, а затем выполнили программу внутри добавления: 1 + addend, и поскольку это находится в строке с возвратом, она выдает результат: 3! Вы также можете передать в функцию любое количество данных, просто добавьте больше переменных через запятую:

function math(addend, subtrahend){
    const subTotal = addend - subtrahend;
    return 1 + subTotal;
};

будет работать так же, как вы думаете: вычесть вторую переменную, которую вы передали, из первой, затем добавить этот результат к 1 и вернуть окончательный результат.

Хотите верьте, хотите нет, но большая часть того, что я здесь затронул, применима к другим языкам, а также к JavaScript с очень небольшими изменениями. Еще один пример того, что большинство языков программирования очень похожи, и как только вы выучите один, вам будет намного легче выучить следующий.

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