JavaScript基础教程

JavaScript 对象

JavaScript 函数

JS HTML DOM

JS 浏览器BOM

AJAX 基础教程

JavaScript 参考手册

JavaScript 函数(Function)

JavaScript函数是旨在执行动作或特定任务的代码块。

函数是由程序员定义的可重用的自定义代码,可以使您的程序更具模块化和效率。

当“某物”调用JavaScript函数时,将执行该函数。

定义函数

函数定义(也称为函数声明)使用 function 关键词,函数的顺序依次为:

  • 函数名称

  • 函数的参数列表,用小括号( )括起来,并用逗号分隔

  • 定义函数的语句,用大括号括{  }起来.

以下是JavaScript中函数的语法:

function nameOfFunction(parameter1, parameter2, ..., parameterN) {
 // 要执行的代码
 }

函数名称可以包含字母,数字,下划线和美元$符号(与变量相同的规则)。

在第一个示例中,我们将进行函数声明以向文档打印问候语。

function greet() {
   document.write("Hello, World!");
}
测试看看‹/›

函数调用

定义函数不会执行。定义函数只是对函数命名,并指定调用函数时的操作。

您可以通过在函数名称后加上括号()来调用函数。

//定义greet()函数
function greet() {
   document.write("Hello, World!");
}

//调用已经定义的greet()函数
greet();
测试看看‹/›

现在,我们将greet()代码包含在一个函数中,并且可以根据需要重复使用它。

// 定义greet()函数
function greet() {
   document.write("Hello, World!");
}

// 多次调用已经定义的greet()函数
greet();
greet();
greet();
测试看看‹/›

您还可以使用其他方法来调用函数:

  • 事件发生时(用户单击按钮时)

  • 从JavaScript代码中调用它

  • 自动(自行执行)

在本教程的后面,您将学到更多有关函数调用的信息。

函数参数

在定义函数以在运行时接受输入值时,可以指定参数。

函数参数在函数定义的括号()中列出。

//定义函数
function greet(name) {
   document.write("Hello, " + name);
}

//以“ Vishal”为参数调用greet函数
greet("Vishal");
测试看看‹/›

您可以根据需要定义任意数量的参数。

//定义函数
function add(num1, num2, num3) {
   var total = num1 + num2 + num3;
   document.write(total);
}
 
// 调用函数
add(5, 20, 10); // 0utputs: 35
add(-5, 8, 7);  // 0utputs: 10
测试看看‹/›

但是,对于您指定的每个参数,在调用函数时都需要将相应的参数传递给该函数,否则其值将变得不确定。

//定义函数
function showFullname(fName, lName) {
   document.write(fName + " " + lName);
}
 
// 调用函数
showFullname("Kavy", "Mark"); // 0utputs: Kavy Mark
showFullname("John"); // 0utputs: John undefined
测试看看‹/›

参数的工作方式类似于函数中的占位符变量;它们在运行时被调用时提供给函数的值(称为参数)替换。

在函数内部,参数表现为局部变量。

您将在本教程的后面部分了解有关函数参数的更多信息。

返回值

JavaScript函数可以使用return语句将值返回给调用该函数的脚本。

返回的值可以是任何类型,包括数组和对象。

当JavaScript到达一条return语句时,该函数将停止执行。

以下函数采用一个称为数字的参数,并返回乘以自身的参数(即数字):

//定义函数
function square(number) {
   return number * number;
}

//调用函数,返回值将存储在x中
var x = square(5);
测试看看‹/›

一个函数不能返回多个值。但是,您可以通过返回值数组来获得类似的结果:

function makeArray() {
   var myArray = ["Apple", "Mango", "Banana", "Orange"];
   return myArray;
}
测试看看‹/›

()运算符调用函数

使用上面的示例,引用函数square对象,并引用函数square()结果。

如果不使用(),将返回函数定义而不是函数结果:

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

document.write(square(5));  // 输出 25
document.write(square); // 输出定义的函数
测试看看‹/›

函数表达式

虽然上面的函数声明在语法上是一个语句,但是也可以通过函数表达式创建函数。

函数表达式可以存储在变量中,并始终使用变量名来调用。

这样的函数可以是匿名的 ; 它不必具有名称。例如,函数square()可以定义为:

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

var x = square(5); // x = 25
测试看看‹/›

另一个示例:

var sum = function(a, b) {
return a + b;
};

var x = sum(100, 8);  // x = 108
测试看看‹/›

上面的函数以分号结尾,因为它是可执行语句的一部分。

函数作用范围

定义在函数内部的变量不能从函数外部的任何地方访问,它们将成为函数的局部变量。

// 此处的代码不能使用 city

function myFunc() {
   var city = "New Delhi";
  // 此处的代码能使用 city
}

// 此处的代码不能使用 city
测试看看‹/›

由于局部变量只能在其函数内部使用,因此具有相同名称的变量可以在不同的函数内部使用。

函数启动时创建局部变量,函数完成时将局部变量删除。