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

Как и любой другой расширенный язык программирования, JavaScript также поддерживает все функции, необходимые для написания модульного кода с использованием функций. Вы должны были видеть такие функции, как alert() и write() в предыдущих главах. Мы использовали эти функции снова и снова, но они были написаны в основном JavaScript только один раз.

JavaScript позволяет нам писать и свои собственные функции. В этом разделе объясняется, как писать свои собственные функции в JavaScript.

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

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

Синтаксис

Здесь показан основной синтаксис.

<script type="text/javascript">
   <!--
      function functionname(parameter-list)
      {
         statements
      }
   //-->
</script>
пример

Попробуйте следующий пример. Он определяет функцию, называемую sayHello, которая не принимает параметров -

<script type="text/javascript">
   <!--
      function sayHello()
      {
         alert("Hello there");
      }
   //-->
</script>

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

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

<html>
   <head>
  
      <script type="text/javascript">
         function sayHello()
         {
            document.write ("Hello there!");
         }
      </script>
     
   </head>
   <body>
      <p>Click the following button to call the function</p>
     
      <form>
         <input type="button" onclick="sayHello()" value="Say Hello">
      </form>
      
  
   </body>
</html>

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

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

пример

Попробуйте следующий пример. Здесь мы изменили функцию sayHello. Теперь он принимает два параметра.

<html>
   <head>
  
      <script type="text/javascript">
         function sayHello(name, age)
         {
            document.write (name + " is " + age + " years old.");
         }
      </script>
     
   </head>
   <body>
      <p>Click the following button to call the function</p>
     
      <form>
         <input type="button" onclick="sayHello('Zara', 7)" value="Say Hello">
      </form>
     
  
   </body>
</html>

Заявление о возврате

Функция JavaScript может иметь необязательный оператор return. Это необходимо, если вы хотите вернуть значение из функции. Это утверждение должно быть последним в функции.

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

пример

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

<html>
   <head>
     
      <script type="text/javascript">
         function concatenate(first, last)
         {
            var full;
            full = first + last;
            return full;
         }
        
         function secondFunction()
         {
            var result;
            result = concatenate('Zara', 'Ali');
            document.write (result );
         }
      </script>
     
   </head>
  
   <body>
      <p>Click the following button to call the function</p>
     
      <form>
         <input type="button" onclick="secondFunction()" value="Call Function">
      </form>
     
      <p>Use different parameters inside the function and then try...</p>
 
  </body>
</html>

Понравилась статья? Поделитесь ею с друзьями и напишите отзыв в комментариях!



Cookies make it easier for us to provide you with our services. With the usage of our services you permit us to use cookies.
Ok