JavaScript 2.2 - Функции, вызывающие функции

RedDeveloper
01.04.2023 11:58
JavaScript 2.2 - Функции, вызывающие функции

JavaScript 2.2 - Функции, вызывающие функции

Функции, вызывающие другие функции

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

Чтобы вызвать функцию в JavaScript, вы просто используете ее имя, за которым следуют круглые скобки "()". Если функция требует ввода, вы помещаете эти вводы внутрь круглых скобок, разделяя их запятыми.

Например, если у вас есть функция с именем "greet", которая принимает один аргумент, вы можете вызвать ее следующим образом:

function greet(name) {
  console.info(`Hello, ${name}!`);
}
greet("Alice"); // Output: "Hello, Alice!"
greet("Bob");   // Output: "Hello, Bob!"

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

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

Примеры

function addNumbers(a, b) {
  return a + b;
}
function doubleNumber(n) {
  return n * 2;
}
function addAndDouble(a, b) {
  const sum = addNumbers(a, b);
  const result = doubleNumber(sum);
  return result;
}
const result = addAndDouble(2, 3);
console.info(result); // 10

В этом примере функция addAndDouble вызывает функцию addNumbers для сложения двух входных чисел, а затем вызывает функцию doubleNumber для удвоения результата. Конечный результат функции addAndDouble возвращается и сохраняется в переменной result.

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

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

function calculateArea(radius) {
  return Math.PI * radius * radius;
}
function convertToString(number) {
  return number.toString();
}
function calculateAndConvert(radius) {
  const area = calculateArea(radius);
  const result = convertToString(area);
  return result;
}
const result = calculateAndConvert(3);
console.info(result); // "28.274333882308138"

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

function toUpperCase(str) {
  return str.toUpperCase();
}
function filterByLetter(letter) {
  return function(str) {
    return !str.includes(letter);
  };
}
function mapAndFilter(arr, fn1, fn2) {
  const mapped = arr.map(fn1);
  const filtered = mapped.filter(fn2);
  return filtered;
}
const names = ['Alice', 'Bob', 'Charlie', 'Dave'];
const result = mapAndFilter(names, toUpperCase, filterByLetter('A'));
console.info(result); // ["BOB", "CHARLIE"]

В этом примере функция mapAndFilter принимает массив и две другие функции в качестве аргументов. Функция toUpperCase используется для преобразования каждой строки в массиве в верхний регистр, а функция filterByLetter используется для фильтрации строк, содержащих букву 'A'. Конечным результатом является массив строк в верхнем регистре, не содержащих букву 'A'.

Генерация случайного числа между двумя значениями с последующим округлением до ближайшего целого числа:

function generateRandom(min, max) {
  return Math.random() * (max - min) + min;
}
function roundToInteger(number) {
  return Math.round(number);
}
function generateAndRound(min, max) {
  const random = generateRandom(min, max);
  const rounded = roundToInteger(random);
  return rounded;
}
const result = generateAndRound(0, 10);
console.info(result); // 4

Функции - краткое содержание

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

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

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

Стрелочные функции - это сокращенный синтаксис для написания функций, который широко используется в современном JavaScript. Важно понимать их синтаксис и то, чем они отличаются от обычных функций.

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

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

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

Стоит ли изучать PHP в 2023-2024 годах?
Стоит ли изучать PHP в 2023-2024 годах?

20.08.2023 18:21

Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в 2023-2024 годах? Или это полная лажа?".

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

20.08.2023 17:46

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox

19.08.2023 18:39

Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в частности, магию поплавков и гибкость flexbox.

Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest

19.08.2023 17:22

В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для чтения благодаря своей простоте. Кроме того, мы всегда хотим проверить самые последние возможности в наших проектах!

Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️

18.08.2023 20:33

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

Пользовательский скаляр GraphQL
Пользовательский скаляр GraphQL

14.08.2023 14:49

Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип предназначен для представления неделимого значения.