Вызов переменной из другой функции - это плохо?

Question

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

Я поделился здесь фрагментом кода.

спасибо.

function getEx() {
  return document.getElementById('example')
}

function getExTwo() {
  return document.getElementById("exampleTwo");
}

function getTheValue() {
  let getExValue = getEx();
  let getExTwoValue = getExTwo();
}

Answer 1

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

Вот пример того, как это может работать.

// Note: This is new ES6/ES7 syntax for writing JavaScript functions.
// I'm using it here because it's very terse.

const add = (a, b) => a + b;

const multiply = (a, b) => a * b;

const square = (a) => multiply(a, a);

const sumOfSquares = (arr) => {
  let sum = 0;
  arr.forEach(number => sum += square(number));
  return sum;
};

В (упрощенном) примере выше Мы используем разные функции, чтобы разбить отдельные логические части проблемы на более мелкие, более управляемые проблемы. Например, чтобы вычислить сумму квадратов массива [1, 10, 12], мы хотим иметь возможность добавлять вещи и мы хотим иметь возможность возводить вещи в квадраты, поэтому рекомендуется создать функции для выполнения каждого из этих шагов. Возможно, мы даже захотим использовать другие функции внутри этих функций (например, вызов multiply из square).

Теперь, возможно ли go за бортом с созданием новых функций? Да. Старайтесь избегать написания нескольких одинаковых функций. Но в остальном ... go орехи!

Answer 2

Вызов функции из другой функции неплох. Это рекомендуемый способ уменьшить количество повторений, разбивая ваш код на более мелкие части, каждый из которых обрабатывает определенные параметры c logi c. Вот упрощенная версия вашего кода:

// ps: $ is not from jquery it is just a normal variable.
const $ = document.querySelector

const getValues = () => {
  const firstVal = $('#example')
  const secondVal = $('#exampleTwo')
}