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

Итак, согласно веб-документации Mozilla (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions), они определяют функции как один из фундаментальных строительных блоков в JavaScript. Функция в JavaScript похожа на процедуру — набор операторов, которые выполняют задачу или вычисляют значение, но для того, чтобы процедуру можно было квалифицировать как функцию, она должна принимать некоторые входные данные и возвращать выходные данные, где существует некоторая очевидная связь между ввод и вывод. Чтобы использовать функцию, вы должны определить ее где-то в той области видимости, из которой вы хотите ее вызвать.

Определение функций

Просто, я видел и делал это много раз раньше:

function square(number) {
  return number * number;
}

Здесь вы можете видеть, что квадрат принимает один параметр, number.

Просто для уточнения:

  • Параметр: переменная или заполнитель, определенный в объявлении функции. Он действует как заполнитель для значения, которое будет передано в функцию при ее вызове.
  • Аргумент: это фактическое значение, которое передается в функцию при ее вызове. Итак, допустим, у вас есть параметры function add(a, b), a и b, но a имеет значение 3, а b имеет значение 4, которые являются значениями, которые передаются в функцию. Эти значения являются аргументами.

Параметры в основном передаются в функции по значению — поэтому, если код в теле функции присваивает совершенно новое значение параметру, который был передан в функцию, изменение не отражается глобально или в код, вызвавший эту функцию. (Таким образом, изменение изменяется только в объеме этой конкретной функции).

Когда вы передаете объект в качестве параметра, если функция изменяет свойства объекта, это изменение видно вне функции, как показано в следующем примере (таким образом, свойства объектов влияют на глобальную область видимости):

function myFunc(theObject) {
  theObject.make = "Toyota";
}

const mycar = {
  make: "Honda",
  model: "Accord",
  year: 1998,
};

console.log(mycar.make); // "Honda"
myFunc(mycar);
console.log(mycar.make); // "Toyota"

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

function myFunc(theArr) {
  theArr[0] = 30;
}

const arr = [45];

console.log(arr[0]); // 45
myFunc(arr);
console.log(arr[0]); // 30

Выражения функций

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

Такая функция может быть анонимной; у него не должно быть имени (что полезно, если вам просто нужна быстрая функция для передачи аргумента в другую функцию). Например, функция square может быть определена как:

const square = function (number) {
  return number * number;
};

console.log(square(4)); // 16

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

const factorial = function fac(n) {
  return n < 2 ? 1 : n * fac(n - 1);
};

console.log(factorial(3)); // 6

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

  • Факториал 3: 3*2*1 = 6
  • Факториал 5: 5*4*3*2*1 = 120

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

function map(f, a) {
  const result = new Array(a.length);
  for (let i = 0; i < a.length; i++) {
    result[i] = f(a[i]);
  }
  return result;
}

В следующем коде функция получает функцию, определенную функциональным выражением, и выполняет ее для каждого элемента массива, полученного в качестве второго аргумента:

function map(f, a) {
  const result = new Array(a.length);
  for (let i = 0; i < a.length; i++) {
    result[i] = f(a[i]);
  }
  return result;
}

const cube = function (x) {
  return x * x * x;
};

const numbers = [0, 1, 2, 5, 10];
console.log(map(cube, numbers)); // [0, 1, 8, 125, 1000]

В JavaScript функцию можно определить на основе условия. Например, следующее определение функции определяет myFunc, только если numравно 0:

let myFunc;
if (num === 0) {
  myFunc = function (theObject) {
    theObject.make = "Toyota";
  };
}

Помимо определения функций, как описано здесь, вы также можете использовать конструктор Function для создания функций из строки во время выполнения, подобно eval().

Вкратце, метод — это функция, являющаяся свойством объекта.

Вызов функций

Достаточно просто, как square(5);

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

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

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

function factorial(n) {
  if (n === 0 || n === 1) {
    return 1;
  } else {
    return n * factorial(n - 1);
  }
}

Затем вы можете вычислить факториалы от 1 до 5 следующим образом:

console.log(factorial(1)); // 1
console.log(factorial(2)); // 2
console.log(factorial(3)); // 6
console.log(factorial(4)); // 24
console.log(factorial(5)); // 120

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

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

Поднятие функций

Рассмотрим пример ниже:

console.log(square(5)); // 25

function square(n) {
  return n * n;
}

Этот код выполняется без ошибок, несмотря на то, что squarefunction вызывается до ее объявления. Это связано с тем, что интерпретатор JavaScript поднимает все объявление функции наверх текущей области, поэтому приведенный выше код эквивалентен следующему:

// All function declarations are effectively at the top of the scope
function square(n) {
  return n * n;
}

console.log(square(5)); // 25

Подъем функций работает только с объявлениями функций, но не с функциональными выражениями (функциональные выражения используются для подобных безымянных функций, так что вы видите, что там просто написано функция(n), а имени нет?). Таким образом, следующий код не будет работать:

console.log(square(5)); // ReferenceError: Cannot access 'square' before initialization
const square = function (n) {
  return n * n;
};

Конец

Хорошо! Это наша запись в блоге для определения функций, выражений функций, вызова функций и подъема функций. Я думаю, что здорово пройтись по всем функциям, даже если предпосылки их довольно просты, в них есть намного больше, чем стоит знать. Я думаю, что определенно стоит просмотреть документацию и понять, что они могут сделать, поскольку, когда я буду прогрессировать и читать более продвинутый JavaScript, React и, наконец, Angular, они будут использовать некоторые из этих концепций и, возможно, даже применять их еще больше, поэтому если бы я не прочитал эту документацию и не написал об этом, я бы не знал, что именно делается. На эти документы приятно оглянуться назад, если я застрял, поскольку я объяснил их таким образом, что мой мозг учится, понимает и представляет информацию. Я надеюсь, что это стоит сделать, я думаю, что это хороший способ изучения JS, поскольку я могу прополоть вещи, которые, как мне кажется, я уже знаю достаточно, и я нахожу это довольно разочаровывающим в учебных пособиях или интерактивных обучающих веб-сайтах, где вам приходится выполнять действия по основам. Я думаю, что изучение документации, кодовые войны и вопросы по коду, а затем создание проектов — это лучший способ изучить код, и если вы действительно хотите убедиться, что ваше обучение и понимание могут быть выполнены на самом высоком уровне, я бы подумал о том, чтобы получить GPT- 4 подписки, так как он прекрасно объясняет вам концепции, которые вы не можете понять в Google. Это довольно мощный инструмент, и он заставляет меня чувствовать, что я могу выучить что угодно, потому что я знаю, что GPT может объяснить мне все что угодно. В любом случае, довольно длинное окончание, давайте перейдем к следующему блогу!