Меню
Спросить
JS

Функции JavaScript

14 октября 2017
Функции JavaScript

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

  1. alert ('Это очень длинный текст, который занимает очень много места в данной программе, особенно если его нужно использовать не один раз.');

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

function

Для создания функции используем системное слово function далее пишем название функции, круглые и после фигурные скобки.

  1. function НАЗВАНИЕ () {
  2.     Здесь будут действия функции
  3. }

Там где будут действия функции, это тело функции. Давайте создадим нашу функцию для вывода алерта.

  1. function msg () {
  2.     alert ('Это очень длинный текст, который занимает очень много места в данной программе, особенно если его нужно использовать не один раз.');
  3. }

Теперь достаточно просто вызвать, созданную нами, функцию msg в нужных местах.

  1. function msg () {
  2.     alert ('Это очень длинный текст, который занимает очень много места в данной программе, особенно если его нужно использовать не один раз.');
  3. }
  4. msg();
  5. че то там делаем
  6. msg();

И нам не нужно постоянно повторять наш алерт.

Параметры функции

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

  1. function msg () {
  2.     alert('Привет');
  3. }

Добавим один параметр, назову его name.

  1. function msg (name) {
  2.     alert('Привет');
  3. }

Теперь добавим параметр к выводимой строке.

  1. function msg (name) {
  2.     alert('Привет '+name);
  3. }

Осталось использовать нашу функцию в нужном нам месте кода.

  1. function msg (name) {
  2.     alert('Привет '+name);
  3. }
  4. msg('Иван');
  5. // Потом иду такой иду и встретил Степана
  6. msg('Степан');

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

return

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

  1. function sum() {

  2. }

Добавим два параметра, через которые мы будем передавать те самые два числа.

  1. function sum(b,c) {

  2. }

Объявим переменную, она будет содержать в себе ответ.

  1. function sum(b,c) {
  2.     var
  3.     a;
  4. }

Переменной "а" присвоим выражение в виде сложения двух чисел b и c.

  1. function sum(b,c) {
  2.     var
  3.     a;
  4.     a = b + c;
  5. }

Теперь вернем получившийся ответ.

  1. function sum(b,c) {
  2.     var
  3.     a;
  4.     a = b + c;
  5.     return a;
  6. }

Осталось только вызвать это функцию там где нам это нужно.

  1. function sum(b,c) {
  2.     var
  3.     a;
  4.     a = b + c;
  5.     return a;
  6. }
  7. alert(sum(5,7)); // Функция sum вычислит сложение двух чисел 5 и 7, вернет ответ и alert выведет получившийся ответ.

Пример

Давайте рассмотрим пример, используя свои знания на сегодняшний урок. Создадим функцию, которая будет решать квадратное уравнение. Запишем функцию и назовем ее quadraticEquation.

  1. function quadraticEquation () {

  2. }

Добавим три параметра, которые будут соответствовать числам из квадратного уравнения.

  1. function quadraticEquation (a,b,c) {

  2. }

Объявим три переменные, переменная "D" - это будет дискриминант, x1 и x2 - это будут корни уравнения.

  1. function quadraticEquation (a,b,c) {
  2.     var
  3.     D, x1, x2;
  4. }

Присвоим переменной "D" уравнение дискриминанта, используя три параметра.

  1. function quadraticEquation (a,b,c) {
  2.     var
  3.     D, x1, x2;
  4.     
  5.     D = b**2 - 4*a*c;
  6. }

Дальше мы должны проверить какой дискриминант получился - больше нуля, меньше нуля или равен нулю. Тут вспоминаем прошедшую тему про условия в JavaScript и проверяем дискриминант.

  1. function quadraticEquation (a,b,c) {
  2.     var
  3.     D, x1, x2;

  4.     D = b**2 - 4*a*c;
  5.     id (D > 0) {
  6.     
  7.     }
  8.     else if (D == 0) {
  9.     
  10.     }
  11.     else if (D < 0) {
  12.     
  13.     }
  14. }

Проверили, теперь осталось написать действия в зависимости от условия.
Если дискриминант больше нуля, то находим два корня по формулам и выводим ответ.

  1. function quadraticEquation (a,b,c) {
  2.     var
  3.     D, x1, x2;
  4.     
  5.     D = b**2 - 4*a*c;
  6.     id (D > 0) {
  7.         x1 = (-b + Math.sqrt(D))/(2*a);
  8.         x2 = (-b - Math.sqrt(D))/(2*a);
  9.         alert('x1 = '+x1+'   x2 = '+x2);
  10.     }
  11.     else if (D == 0) {
  12.     
  13.     }
  14.     else if (D < 0) {
  15.     
  16.     }
  17. }

Обратите внимание на "Math.sqrt(D)", это тоже функция, правильнее будет сказать, что это объект с математическими свойствами, методами или функциями, он вычисляет квадратный корень числа. Математические функции мы тоже пройдем.
Дальше, если дискриминант равен нулю, то один корень.

  1. function quadraticEquation (a,b,c) {
  2.     var
  3.     D, x1, x2;
  4.     
  5.     D = b**2 - 4*a*c;
  6.     id (D > 0) {
  7.         x1 = (-b + Math.sqrt(D))/(2*a);
  8.         x2 = (-b - Math.sqrt(D))/(2*a);
  9.         alert('x1 = '+x1+'   x2 = '+x2);
  10.     }
  11.     else if (D == 0) {
  12.         x1 = (-b)/(2*a);
  13.         alert('x = '+x1);
  14.     }
  15.     else if (D < 0) {
  16.     
  17.     }
  18. }

Отлично, последний вариант, когда дискриминант меньше нуля, тут решений нет.

  1. function quadraticEquation (a,b,c) {
  2.     var
  3.     D, x1, x2;
  4.     
  5.     D = b**2 - 4*a*c;
  6.     id (D > 0) {
  7.         x1 = (-b + Math.sqrt(D))/(2*a);
  8.         x2 = (-b - Math.sqrt(D))/(2*a);
  9.         alert('x1 = '+x1+'   x2 = '+x2);
  10.     }
  11.     else if (D == 0) {
  12.         x1 = (-b)/(2*a);
  13.         alert('x = '+x1);
  14.     }
  15.     else if (D < 0) {
  16.         alert('Решений нет, так как дискриминант меньше нуля.');
  17.     }
  18. }

Вот функция и готова, осталось вызывать ее когда нужно и передавать три параметра. Вот вам три уравнения к примеру:
5x^2 + 3x + 7 = 0,
x^2 - 2x - 3 = 0,
x^2 - 12x + 36 = 0.

Заключение

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

Следующая статьяПредыдущая статья