MooTools - 函数


MooTools 中的函数是来自 JavaScript 的概念。我们已经知道如何在 JavaScript 中使用函数。一般来说,最好将函数保留在 script 标签中的页面主体之外。在 MooTools 中,我们遵循相同的模式。在这里,您可以根据需要设计自己的功能。我们现在必须在domready函数中调用所有用户定义的函数。

查看以下语法以了解如何在 MooTools 中使用通用函数。

句法

<script type = "text/javascript">
   /*
   Function definitions go here
   */
   window.addEvent('domready', function() {
      /* Calls to functions go here */
   });
</script>

基本结构

在 MooTools 中定义函数有几种基本方法。JavaScript 和 MooTools 的函数语法没有区别,区别在于调用函数。让我们举一个小例子,定义一个名为 demo_function 的函数。看看下面的代码。

例子

<html>

   <head>
      <script type = "text/javascript" src = "MooTools-Core-1.6.0.js"></script>
      <script type = "text/javascript" src = "MooTools-More-1.6.0.js"></script>
      
      <script type = "text/javascript">
         //Define simple_function as a function
         var simple_function = function(){
            document.write('This is a simple function');
         }
         
         window.addEvent('domready', function() {
            //Call simple_function when the dom(page) is ready
            simple_function();
         });
      </script>
   </head>
   
   <body>
   </body>
   
</html>

您将收到以下输出 -

输出

单参数函数

您还可以创建一个接受参数的函数。要在函数中使用参数,您需要在括号中添加变量名称。一旦提供它,该变量就可以在内部使用。让我们举一个例子,它定义了一个函数,该函数接受单个参数并随参数一起打印一条消息。

看看下面的代码。

例子

<!DOCTYPE html>
<html>

   <head>
      <script type = "text/javascript" src = "MooTools-Core-1.6.0.js"></script>
      <script type = "text/javascript" src = "MooTools-More-1.6.0.js"></script>
      
      <script type = "text/javascript">
         var single_parameter_function = function(parameter){
            document.write('The parameter is : ' + parameter);
         }
         
         window.addEvent('domready', function(){
            single_parameter_function('DEMO PARAMETER');
         });
      </script>
   </head>
   
   <body>
   </body>
   
</html>

您将收到以下输出 -

输出

返回一个值

每当您想要使用一个函数的结果作为另一个变量的输入时,您都需要使用该函数的返回值。您可以使用 return 关键字从函数返回值。让我们举一个例子,它定义了一个函数,该函数接受两个参数值并返回这两个参数的总和。看看下面的代码。

例子

<!DOCTYPE html>
<html>

   <head>
      <script type = "text/javascript" src = "MooTools-Core-1.6.0.js"></script>
      <script type = "text/javascript" src = "MooTools-More-1.6.0.js"></script>
      
      <script type = "text/javascript">
         var two_parameter_returning_function = function(first_number, second_number){
            var third_number = first_number + second_number;
            return third_number;
         }
         
         window.addEvent('domready', function(){
            var return_value = two_parameter_returning_function(10, 5);
            document.write("Return value is : " + return_value);
         });
      </script>
   </head>
   
   <body>
   </body>
   
</html>

您将收到以下输出 -

输出