1

JavaScript 函数(Functions)

Posted by 撒得一地 on 2016年5月7日 in JavaScript教程

函数是一组可重用代码的集合,可以在程序中的任何位置调用。这消除了需要一次又一次编写相同的代码,提供了编程效率。它可以帮助程序员编写模块化代码。函数允许程序员将一个大的程序划分为一块块比较小且易于处理的模块。

像任何其他高级的编程语言一样,JavaScript 也支持编写函数,使用模块化代码所需的所有功能。你一定见过诸如如 alert() 和 write() 等函数。我们一次一次的使用这些函数,但它们在 JavaScript 内核中仅仅只被编写过一次,只是在使用过程中被重复调用。

JavaScript 允许我们编写自己的函数。这一节解释了如何在 JavaScript 中编写自己的函数。

函数定义

我们使用一个函数之前,我们需要定义它。定义一个函数在 JavaScript 中的最常见方式是通过使用函数关键字,其次是一个独一无二的函数名,紧接着是参数列表 (参数可能为空),并由大括号包围的语句块。单单这样讲有些抽象,直接看语法。

语法

基本语法如下所示。

<script type="text/javascript">
   <!--
      function functionname(parameter1,parameter2...)
      {
         statements
      }
   //-->
</script>

注意:上面的 function 是关键字,functionname 是函数名,每个函数名不能重复。可以定义多个参数列表,每个参数有逗号(,)隔开。

示例

请尝试下面的示例。它定义了一个没有参数名为 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>
      <p>Use different text in write method and then try...</p>
  </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>

      <p>Use different parameters inside the function and then try...</p>
   </body>
</html>

亲自试一试

return 语句

每个 JavaScript 函数都有一个可选的 return 语句。如果你想要从函数返回一个值这是必需的。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>

亲自试一试

关于 JavaScript 函数还有很多要学习,然而在本教程中,我们已经涵盖最重要的概念。包括:

JavaScript 嵌套函数

JavaScript 构造函数

JavaScript 函数文本(匿名函数)

上一篇:

下一篇:

相关推荐

1 Comment

Comments are closed. Would you like to contact the author directly?
网站地图|XML地图

Copyright © 2015-2024 技术拉近你我! All rights reserved.
闽ICP备15015576号-1 版权所有©psz.