函数

有关更多示例和说明，请参阅有关函数的JavaScript指南。

描述

在JavaScript中，每个函数其实都是一个Function对象。查看Function页面了解其属性和方法。

如果一个函数中没有使用return语句，则它默认返回undefined。要想返回一个特定的值，则函数必须使用 return 语句来指定一个要返回的值。(使用new关键字调用一个构造函数除外)。

调用函数时，传递给函数的值被称为函数的实参（值传递），对应位置的函数参数名叫作形参。如果实参是一个包含原始值(数字，字符串，布尔值)的变量，则就算函数在内部改变了对应形参的值，返回后，该实参变量的值也不会改变。如果实参是一个对象引用，则对应形参会和该实参指向同一个对象。假如函数在内部改变了对应形参的值，返回后，实参指向的对象的值也会改变：

 /* 定义函数 myFunc */
 function myFunc(theObject)
 {
   //实参 mycar 和形参 theObject 指向同一个对象.
   theObject.brand = "Toyota";
 }
 /*
  * 定义变量 mycar;
  * 创建并初始化一个对象;
  * 将对象的引用赋值给变量 mycar
  */
 var mycar = {
   brand: "Honda",
   model: "Accord",
   year: 1998
 };
 /* 弹出 'Honda' */
 window.alert(mycar.brand);
 /* 将对象引用传给函数 */
 myFunc(mycar);
 /*
  * 弹出 'Toyota',对象的属性已被修改.
  */
 console.log(mycar.brand);

在函数执行时，this 关键字并不会指向正在运行的函数本身，而是指向调用该函数的对象。所以，如果你想在函数内部获取函数自身的引用，只能使用函数名或者使用arguments.callee属性(严格模式下不可用)，如果该函数是一个匿名函数,则你只能使用后者。

函数定义

定义函数有多种方法:

函数声明 (函数语句)

有一个特殊的语法来声明函数(查看函数语句了解详情)：

function name([param[, param[, ... param]]]) { statements }

name

函数名.

param

传递给函数的参数的名称，一个函数最多可以有255个参数。

statements

组成函数体的声明语句。

函数表达式 (function expression)

函数表达式和函数声明非常相似，它们甚至有相同的语法（查看函数表达式了解详情）。一个函数表达式可能是一个更大的表达式的一部分。可以定义函数“名字”（例如可以在调用堆栈时使用）或者使用“匿名”函数。函数表达式不会放到开头，所以不能在定义之前调用。

function [name]([param] [, param] [..., param]) { statements }

name

函数名，可以省略。当省略函数名的时候，该函数就成为了匿名函数。

param

传递给函数的参数的名称，一个函数最多可以有255个参数.

statements

组成函数体的声明语句。

下面是匿名函数的一个例子（函数没有名字）：

var myFunction = function() {
    statements
}

也可以在定义时为函数命名：

var myFunction = function namedFunction(){
    statements
}

命名函数表达式的好处是当我们遇到错误时，堆栈跟踪会显示函数名，容易寻找错误。

可以看到，上面的两个例子都不以function开头。不以function开头的函数语句就是函数表达式定义。

当函数只使用一次时，通常使用IIFE (Immediately Invokable Function Expressions)。

(function() {
    statements
})();

IIFE是在函数声明后立即调用的函数表达式。

函数生成器声明 (function* 语句)

函数声明有一种特殊的语法 (详情请查阅function* statement )：

function* name([param[, param[, ...param]]]) { statements }

name

函数名称.

param

传递给函数的参数的名称，一个函数最多可以有255个参数。

statements

组成函数体的声明语句。

函数生成器表达式 (function* 表达式)

构造函数表达式和函数声明类似，并且有着相同的语法 (详情请查阅  function* expression ):

function* [name]([param] [, param] [..., param]) { statements }

name

函数名称。函数名可以被省略，在这种情况下该函数将变成匿名函数。

param

传递给函数的参数的名称。一个函数可以有多达255个参数

statements

组成函数体的声明语句。

箭头函数表达式 (=>)

箭头函数表达式有着更短的语法，并在词汇方面结合这个值  (详情请查阅 arrow functions ):

([param] [, param]) => { statements } param => expression

param

参数名称. 零参数需要用()表示.  只有一个参数时不需要括号. (例如 foo => 1)

statements or expression

多个声明statements需要用大括号括起来，而单个表达式时则不需要。表达式expression也是该函数的隐式返回值。

 Function构造函数

所有其他对象, Function 对象可以用new操作符创建:

new Function (arg1, arg2, ... argN, functionBody)

arg1, arg2, ... argN

函数使用零个或多个名称作为正式的参数名称。每一个必须是一个符合有效的JavaScript标识符规则的字符串或用逗号分隔的字符串列表,例如“x”,“theValue”或“a,b”。

functionBody

一个构成的函数定义的，包含JavaScript声明语句的字符串。

把Function的构造函数当作函数一样调用(不使用new操作符)的效果与作为Function的构造函数调用一样。

生成器函数的构造函数

所有其他对象, GeneratorFunction 对象可以用 new 操作符创建：

new GeneratorFunction (arg1, arg2, ... argN, functionBody)

arg1, arg2, ... argN

函数使用零个或多个名称作为正式的参数名称。每一个必须是一个符合有效的JavaScript标识符规则的字符串或用逗号分隔的字符串列表,例如“x”,“theValue”或“a,b”。

functionBody

一个构成的函数定义的，包含JavaScript声明语句的字符串。

把Function的构造函数当作函数一样调用(不使用new操作符)的效果与作为Function的构造函数调用一样。

Function 参数

默认(Default)参数

如果没有值或传入了未定义的值，默认函数参数允许形式参数使用默认值初始化。 详情请查阅：default parameters.

其它(Rest)参数

其它(rest)参数语法允许将数量不限的参数(arguments)描述成一个数组。 详情请查阅： rest parameters.

参数(arguments)对象

你可以参阅在函数里使用arguments对象的函数参数。查阅： arguments.

• arguments: 一个包含了传递给当前执行函数参数的类似于数组的对象。
• arguments.callee  : 当前正在执行的函数。
• arguments.caller  : 调用当前执行函数的函数。
• arguments.length: 传给函数的参数的数目。

方法函数定义

Getter 和 setter 函数

你可以在支持添加新属性的任何标准的内置对象或用户定义的对象内定义getter(访问方法)和setter(设置方法)。使用对象字面量语法定义getters和setters方法。

get

当查找某个对象属性时，该对象属性将会与被调用函数绑定。

set

当试图设置该属性时，对象属性与被调用函数绑定。

方法定义语法

从ECMAScript 6开始, 你可以用更短的语法定义自己的方法，类似于getters和setters。详情请查阅 method definitions .

 var obj = {
   foo() {},
   bar() {}
 };

Function构造函数 vs 函数声明 vs 函数表达式

对比下面的例子：

一个用Function构造函数定义的函数,被赋值给变量multiply：

var multiply = new Function('x', 'y', 'return x * y');

一个名为multiply的函数声明：

function multiply(x, y) {
   return x * y;
} // 没有分号

一个匿名函数的函数表达式，被赋值给变量multiply:

 var multiply = function(x, y) {
   return x * y;
 };

一个命名为func_named的函数的函数表达式，被赋值给变量multiply:

var multiply = function func_name(x, y) {
   return x * y;
};

差别

虽然有一些细微的差别，但所起的作用都差不多：

函数名和函数的变量存在着差别。函数名不能被改变，但函数的变量却能够被再分配。函数名只能在函数体内使用。倘若在函数体外使用函数名将会导致错误（如果函数之前是通过一个var语句声明的则是undefined）。例如：

var y = function x() {};
alert(x); // throws an error

当函数是通过 Function's toString method被序列化时，函数名同样也会出现。

另一方面，被函数赋值的变量仅仅受限于它的作用域，该作用域确保包含着该函数被声明时的作用域。

正如第四个例子所展示的那样，函数名与被函数赋值的变量是不相同的. 彼此之间没有关系。函数声明同时也创建了一个和函数名相同的变量。因此，与函数表达式定义不同，以函数声明定义的函数能够在它们被定义的作用域内通过函数名而被访问到：

使用用 'new Function'定义的函数没有函数名。 然而，在 SpiderMonkey JavaScript引擎中，其函数的序列化形式表现的好像它拥有一个名叫"anonymous"的名称一样。比如，使用 alert(new Function()) 输出：

function anonymous() {
}

而实际上其函数并没有名称，anonymous 不是一个可以在函数内被访问到的变量。例如，下面的例子将会导致错误：

var foo = new Function("alert(anonymous);");
foo();

和通过函数表达式定义或者通过Function构造函数定义的函数不同，函数声明定义的函数可以在它被声明之前使用。举个例子：

foo(); // alerts FOO!
function foo() {
   alert('FOO!');
}

函数表达式定义的函数继承了当前的作用域。换言之，函数构成了闭包。另一方面，Function构造函数定义的函数不继承任何全局作用域以外的作用域(那些所有函数都继承的)。

通过函数表达式定义的函数和通过函数声明定义的函数只会被解析一次，而Function构造函数定义的函数却不同。也就是说，每次构造函数被调用，传递给Function构造函数的函数体字符串都要被解析一次 。虽然函数表达式每次都创建了一个闭包，但函数体不会被重复解析，因此函数表达式仍然要快于"new Function(...)"。 所以Function构造函数应尽可能地避免使用。

有一点应该要注意的，在通过解析Function构造函数字符串产生的函数里，内嵌的函数表达式和函数声明不会被重复解析。例如：

var foo = (new Function("var bar = \'FOO!\';\nreturn(function() {\n\talert(bar);\n});"))();
foo(); // 函数体字符串"function() {\n\talert(bar);\n}"的这一部分不会被重复解析。

函数声明非常容易（经常是意外地）转换为函数表达式。当它不再是一个函数声明：

• 成为表达式的一部分
• 不再是函数或者script自身的“源元素” （source element）。在script或者函数体内“源元素”并非是内嵌的语句（statement）。

var x = 0;               // source element
if (x === 0) {           // source element
   x = 10;               // 非source element
   function boo() {}     // 非 source element
}
function foo() {         // source element
   var y = 20;           // source element
   function bar() {}     // source element
   while (y === 10) {    // source element
      function blah() {} // 非 source element
      y++;               //非source element
   }
}

例子

// 函数声明
function foo() {}
// 函数表达式
(function bar() {})
// 函数表达式
x = function hello() {}
if (x) {
   // 函数表达式
   function world() {}
}
// 函数声明
function a() {
   // 函数声明
   function b() {}
   if (0) {
      //函数表达式
      function c() {}
   }
}

Block-level functions

从ECMAScript 6开始，在严格模式下，块里的函数作用域为这个块。ECMAScript 6之前不建议block-level functions在严格模式下使用。

'use strict';
function f() {
  return 1;
}
{
  function f() {
    return 2;
  }
}
f() === 1; // true
// f() === 2 in non-strict mode

非严格模式下的Block-level functions

一句话：不要用。

在非严格模式下，块中的函数声明表现奇怪。例如：

if (shouldDefineZero) {
   function zero() {     // DANGER: 兼容性风险
      console.log("This is zero.");
   }
}

ECMAScript 6中，如果shouldDefineZero是false，则永远不会定义zero,因为这个块从不执行。然而，这是标准的新的一部分。这是历史遗留问题，无论这个块是否执行，一些浏览器会定义zero。

在严格模式下，所有支持ECMAScript 6的浏览器以相同的方式处理：只有在shouldDefineZero为true的情况下定义zero，并且作用域只是这个块内。

有条件地定义一个函数的一个更安全的方法是把函数表达式赋给一个变量：

var zero;
if (0) {
   zero = function() {
      console.log("This is zero.");
   };
}

示例

返回格式化数字

下面的函数返回一个字符串，其中包含了一个格式化的、以一个由0开头并填充的数字。

// 这个函数返回一个由0开头并填充的字符串
function padZeros(num, totalLen) {
   var numStr = num.toString();             // 用字符串返回值进行初始化
   var numZeros = totalLen - numStr.length; // 计算zeros顺序
   for (var i = 1; i <= numZeros; i++) {
      numStr = "0" + numStr;
   }
   return numStr;
}

下面的语句调用了padZeros函数：

var result;
result = padZeros(42,4); // returns "0042"
result = padZeros(42,2); // returns "42"
result = padZeros(5,4);  // returns "0005"

检测函数是否存在

你可以通过 typeof 操作符检测一个函数是否存在。在下面的例子中，用一个测试来演示检测window对象是否拥有一个noFunc函数的属性。如果存在，那就使用它；否则就采取其它的一些操作。

if ('function' === typeof window.noFunc) {
   // use noFunc()
 } else {
   // do something else
 }

注意在if语句中，使用了noFunc的引用--在函数名的后面没有括号“（）”，所以实际函数并没有被调用。

规范

浏览器兼容性

参阅

• function statement
• function expression
• function* statement
• function* expression
• Function
• GeneratorFunction
• Arrow functions
• Default parameters
• Rest parameters
• Arguments object
• getter
• setter
• Method definitions
• Functions and function scope