ECMAScript/ES6函数

ECMAScript/ES6函数

函数是一组输入语句,它们执行特定的计算并产生输出结果。 它是在执行特定任务的代码块。 当它被调用(或调用)时执行。 函数能够以有组织的方式重用和编写代码。 JavaScript中的函数用于执行操作。

在JavaScript中,通过使用function关键字后跟名称和小括号()来定义函数。 函数名称可以包括数字,字母,美元符号和下划线。 函数名称中的方括号可能包含用逗号分隔的参数名称。 函数的主体应放在花括号{}中。

定义标准函数的语法如下:

function function_name() {  
    //body of the function  
}

要强制执行函数中的代码,需要调用函数。 这被称为函数调用。 调用函数的语法如下:

function_name()

示例代码:

function hello() //defining a function  
{  
   console.log ("hello function called");  
}  
hello(); //calling of function

在上面的代码中,定义了一个函数hello()。一对括号{}定义函数的主体,称为函数范围。

输出结果如下:

hello function called

1.参数化函数

参数是函数定义中列出的名称,它们是将值传递给函数的机制。参数的值在调用期间传递给函数。 除非明确指定,否则传递给函数的值的数量必须与定义的参数数量匹配。

语法

定义参数化函数的语法为:

function function_name( parameter1,parameter2 ,…..parameterN) {     
     //body of the function  
}

以下参数化函数示例中,我们定义了一个函数mul(),该函数接受两个参数:xy,并返回结果的乘积。参数值在调用期间传递给函数。

function mul( x , y) {   
    var c = x * y;  
    console.log("x = "+x);  
    console.log("y = "+y);  
    console.log("x * y = "+c);   
 }   
mul(20,30);

上面示例代码,得到以下结果:

x = 20
y = 30
x * y = 600

2.默认函数参数

在ES6中,如果未定义参数或未向其传递任何值,则函数允许使用默认值初始化参数。

在以下代码中演示如何使用默认值初始化参数:

function show (num1, num2=200)   
{  
    console.log("num1 = " +num1);  
    console.log("num2 = " +num2);  

}  
show(100);

在上述函数中,默认将num2的值设置为200。 如果未显式传递num2的值,则该函数将始终将num2的值视为200

100 200

如果函数显式传递其值,则参数num2的默认值将被覆盖。 可以通过以下示例了解如何使用:

例如

function show(num1, num2=200)   
{  
    console.log("num1 = " +num1);  
    console.log("num2 = " +num2);  
}  
show(100,500);

执行上面示例代码:

100 500

3.Rest参数

Rest参数不限制传递到函数中参数值的数量,但所有传递的值必须是相同的类型。 我们也可以说rest参数充当相同类型的多个参数的占位符。

声明rest参数时,参数名称应以具有三个句点(不超过三个或不小于三个)的散布运算符为前缀。

在以下示例中,您可以看到相同的插图:

function show(a, ...args)  
{  
    console.log(a + " " + args);  
}  
show(50,60,70,80,90,100);

执行上面示例代码,得到以下输出结果:

50,60,70,80,90,100

注意:reset参数应在函数参数列表的最后位置。

4.返回值函数

该函数还通过使用return语句将值返回给调用方。 这样的函数称为返回函数。 返回函数应始终以return语句结尾。 一个函数中一般只有一个return语句,因为当调用return语句后函数返回退出执行,并且return语句应该是该函数中的最后一条语句。

当JavaScript到达return语句时,该函数将停止执行并立即退出。 因此,可以使用return语句立即停止执行该函数。

语法

函数可以使用return语句后跟一个值或表达式来返回该值。返回函数的语法如下:

function function_name() {   
    //code to be executed  
    return value;   
}

示例代码:

function add( a, b )  
{  
    return a+b;  
}  
var sum = add(10,20);  
console.log(sum);

在上面的示例中,我们定义了函数add(),它具有两个参数:ab。此函数将参数的值相加后返回给调用方。

执行以上代码后,将获得以下输出结果:

30

5.生成器函数

生成器(或生成器函数)是ES6中引入的新概念。 它提供了一种处理迭代器和函数的新方式。ES6生成器是另一种函数,可以在中间暂停一次或多次,然后可以恢复。

6.匿名函数

匿名函数可以定义为没有名称的函数。 匿名函数不与标识符绑定。 可以在运行时动态声明它。 匿名函数最初创建后无法访问。可以在变量内分配匿名函数。 这种表达称为功能表达。 匿名函数的语法如下。

语法

var y = function( [arguments] )   
{   
     //code to be executed  
}

示例:

var hello = function() {  
   console.log('Hello World');    
   console.log('这是一个匿名函数~');   
}  

hello();

执行上面示例代码,得到以下结果:

Hello World
这是一个匿名函数~

当执行上述代码时,它将在两秒钟后显示输出。

Hello World

7.参数化匿名函数

示例:

var anon = function(a,b)  
{   
   return a+b   
}  
function sum() {   
   var res;   
   res = anon(100,200);   
   console.log("Sum: "+res)    
}   
sum()

执行上面示例代码,得到以下结果:

Sum: 300

8.箭头函数

ES6中引入了箭头函数,它提供了一种更准确的JavaScript编写方法。 它们使我们能够编写较小的函数语法。 箭头函数使代码更具可读性和结构性。

单击此链接ES6箭头函数,可以了解有关箭头函数的更多信息。

9.函数吊装

如变量吊装,我们也可以执行函数吊装。 与变量吊装不同,当吊装函数声明时,它仅吊装函数定义,而不仅仅是吊装函数名称。通过以下示例来说明JavaScript中的函数吊装:
在下面示例中,在编写函数之前先对其进行调用。在编写函数之前调用函数会发生什么。

hello();  
function hello() {  
  console.log("Hello world ");  
}

执行上面示例代码,得到以下结果:

Hello world

在上面的代码中,在编写函数之前先调用了函数,但是代码仍然有效。但是,不能吊装函数表达式。在以下是一个吊装函数表达式的示例。

hello();  

var hello = function() {  
  console.log("Hello world ");  
}

当执行上述代码时,将收到“TypeError:hello不是函数”,发生这种情况是因为无法悬挂函数表达式。

TypeError:hello不是函数

10.函数构造器

这是定义新函数的方式,函数语句不是定义新函数的唯一方法;还可以通过使用Function()构造函数以及new运算符来动态定义函数。它比使用函数表达式或函数语句声明函数效率低。

语法

使用Function()构造函数创建函数的语法。

var variable_name = new Function(arg1, arg2..., "Body of the Function");

使用参数

它的语法包括:

arg1,arg2,…argN:这些是函数用作形式参数的名称,每个参数必须是与JavaScript的有效标识符相对应的字符串。
函数体:它是一个包含JavaScript语句的字符串,其中包含构成函数定义的JavaScript。

它可以包含任意数量的字符串参数。最后一个参数是函数的主体,它可以包含JavaScript的任意语句,这些语句之间用分号分隔。

function()构造函数不会传递任何为其创建的函数指定名称的参数。

// 创建一个接受两个参数并返回两个参数的乘积的函数。
var mul = new Function('a', 'b', 'return a * b');  

// calling of function  
console.log("The product of the numbers is: " +mul(5, 5));

执行上面示例代码得到以下结果:

The product of the numbers is: 25

11.立即调用函数表达式(IIFE)

它是JavaScript中的一个函数,它在定义后立即运行。 可以使用IIFE(立即调用函数表达式)来避免从块内部进行变量提升。 它允许公众访问方法,同时保留函数中定义的变量的私密性。

可以通过单击此链接来了解有关IIFE的更多信息,立即调用函数表达式(IIFE)

12.JavaScript函数和递归

当函数调用自身时,它称为递归函数。 递归是一种通过重复调用函数直到其达到结果来迭代操作的技术。当需要在循环中定期调用具有不同参数的同一函数时的最佳方法。

示例

function fact(num) {  
      if (num <= 1) {  
          return 1;  
      } else {  
          return num * fact(num - 1);  
      }  
  }   
  console.log(fact(6));  
  console.log(fact(5));  
  console.log(fact(4));

执行上面示例代码,得到以下结果:

720
120
24

13.函数表达式与函数声明

两者之间的根本区别在于,函数声明是在执行之前进行解析的,而函数表达式只有在脚本引擎在执行过程中遇到它时才进行解析。与函数声明不同,JavaScript中的函数表达式不会吊装。 在定义函数表达式之前,不能使用它们。

函数声明和函数表达式之间的主要区别在于函数的名称,可以在创建匿名函数的函数表达式中将其省略。