javaScript-函数

JavaScript函数

在JavaScript中函数实际也是一种对象,每个函数都是Function类型的实例,能够定义不同类型的属性和方法

一、函数的定义

函数的定义大致上可以分为3种,分别是函数的声明、函数表达式和Function构造函数

1、函数声明

  • 函数的声明是直接使用function关键字接一个函数名,函数名后面是接收函数的形参
1
2
3
function sum(num1, num2){
return num1 + num2;
}

2、函数表达式

  • 函数表达式的形式类似于普通变量的初始化,只不过这个变量初始化的值时函数
1
2
3
let sum = function(num1, num2){
return num1 + num2;
}

3、Function()构造函数

  • 使用new操作符,调用Function()构造函数,传入对应的参数,也可以定义一个函数
1
let sum = new Function("a", "b", "return a + b");
  • 其中除了最后一个参数是执行的函数体,其他参数都是函数的形参

  • Function()构造函数每次执行时,都会解析函数主体,并创建一个新的函数对象

  • Function()函数在A函数中执行时无法访问A函数内的局部变量,只能访问全局变量

函数声明和函数表达式的区别

  • 在使用函数声明时,是必须设置函数名称的,这个函数名称相当于一个变量,以后函数的调用也会通过这个变量进行。

  • 而对于一个函数表达式来说,函数名称是可选的,可以定义一个匿名表达式,并赋给一个变量,然后通过变量进行函数的调用。

  • 对应函数声明,存在函数提升,函数的调用可以在函数声明之前使用,而函数表达式不存在。

二、函数的调用

1、函数调用模式

函数调用模式是通过函数声明或者函数表达式的方式定义函数,然后通过直接函数名调用的模式

1
2
3
4
5
6
7
8
9
10
11
12
// 函数声明
function add(a1, a2){
return a1 + a2;
}

// 函数表达式
let sub = function(a1, a2){
return a1 - a2;
}

add(1, 2);
sub(11, 6);

2、方法调用模式

方法调用模式会优先定义一个对象obj,然后在对象内部定义值为函数的属性property,通过对象obj.property()来调用

1
2
3
4
5
6
7
8
9
10
// 定义对象
let obj = {
name: "node",
// 定义getName属性,值为一个函数
getName: function(){
return this.name;
}
};
obj.getName(); // 通过点调用
obj['getName'](); // 通过中括号调用

如果函数返回对象本身this,则可以利用链式调用的原理进行连续的函数调用

1
2
3
4
5
6
7
8
9
10
11
12
let obj = {
name: "node",
// 定义getName属性,值为一个函数
getName: function(){
return this.name;
}
setName: function(name){
this.name = name;
return this; // 在函数内部返回函数对象本身
}
};
obj.setName("Node").getName(); // 链式函数调用

3、构造器调用模式

构造器调用模式会定义一个函数,在函数中定义实例属性,在原型上定义函数,然后通过new操作符生成函数实例,在通过实例调用原型上定义的函数。

1
2
3
4
5
6
7
8
9
10
11
12
13
// 定义函数对象
function Person(name){
this.name = name;
}
// 原型上定义函数
Person.property.getName = function(){
return this.name;
};

// 通过new操作符生成实例
let person = new Person('node');
// 通过实例调用函数
person.getName()

4、call()函数、apply()函数调用模式

通过call()函数或者apply()函数可以改变函数执行的主体,使得某些不具有特定函数的对象可以直接调用该特定函数。

1
2
3
4
5
6
7
8
9
// 定义一个函数
function sum(num1, num2){
return num1 + num2;
}
// 定义一个对象
let person = {};
// 通过call()或者apply()函数调用sum()函数
sum.call(person, 1, 2);
sum.apply(person, [1, 2]);

5、匿名函数调用模式

匿名函数,就是没有函数名称的函数。匿名函数的调用有两种方式,一种是通过函数表达式调用函数,并赋值给变量,通过变量进行调用。

1
2
3
4
5
let sum = function(num1, num2){
return num1 + num2;
};
// 通过sum()函数进行匿名函数调用
sum(1, 2);

另一种是使用小括号()将匿名函数括起来,然后在后面使用小括号(),传递对应参数进行调用。

1
2
3
(function(num1, num2){
return num1 + num2;
})(1, 2); // 3