hello,JS:03-01函数

总结:数字+undefined===Nan

一、函数的使用

1、什么是语句:先看这几个概念

表达式:

1
2
a=1 a+b
typeof

语句:代表一定功能的表达式的组合

1
a+b;

2、但是特定功能需要几条语句实现,太复杂

1
2
3
statement1; 
statement2;
statement3;

那么,可以将语句打包成一个函数,然后调用这个函数即可,如:

1
function  doSomething(){ statement1; statement2; statement3;  }

调用这个函数。调用函数通过函数名称( )的形式调用

1
doSomething();  //需要的时候就调用

实例:

1
2
3
4
5
6
7
8
function  sum(){ 
console.log('hello')
console.log('wangxiaoqin')
} sum()
//返回
//"hello"
//"wangxiaoqin"
`

二、声明函数

ECMAScript规定三种声明函数方式

1、函数声明

1
2
3
4
5
6
//使用function关键字可以声明一个函数  
//printName() 即函数名称() ,可调用
function printName(){
console.log('世界');
}
printName();

2、函数表达式

1
2
3
4
5
6
7
8
/* 通过var 进行一个声明变量,这里的  变量  等同于 函数表达式*/
var printName = function(){
console.log('饥人谷')
};
printName()

//等同于
var printName = 3;

函数声明VS函数表达式

3、构造函数(不常用)

通过构造函数,使用new来创建一个函数对象

1
var printName =  new  Function("console.log('Byron');");

三、参数

1、只使用定义函数较为僵化,可通过参数方式让函数调用、复用。

举例说明:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
   function  printName(name){ 
//括号中的name为函数的参数
console.log(name)
}
printName('hunger')
printName('valley) //等同于在函数设置变量
function printName(){ //括号为空括号
var name = arguments[0]
console.log(name);
}
printName('hunger');

//假设没有传递参数
function printName(){ //括号为空括号
var name = arguments[0]
console.log(name);
}
printName(); //arguments[0] 为undefined,name=undefined ,那么结果为undefined

//函数在定义的时候可以写多个参数
function printPersonInfo(name, age, sex){
console.log(name)
console.log(age)
console.log(sex) }

2、Arguments传参数

通过函数内部的arguments对象获取到该函数的所有传入参数(按顺序传入),通过

1
console.log(arguments)  //输出每一个参数的值

即:

1
2
function  printPersonInfo(name, age, sex){ console.log(name) console.log(age) console.log(sex) console.log(arguments) 即:
console.log(arguments[0]===name) console.log(arguments.length) console.log(arguments[1] === age) }

3、实例

例1:
image

例2:
image

例3:

1
2
3
4
5
6
7
8
9
10
11
function  getInfo(name, age, sex){ 
console.log('name:',name);
console.log('age:', age);
console.log('sex:', sex);
console.log(arguments);
arguments[0] = 'valley';
console.log('name', name);
}
getInfo('小明', 2, '男');
getInfo('小小明', 3);
getInfo('男');

即:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
function  getInfo(name, age, sex){ 
console.log('name:',name);
console.log('age:', age);
console.log('sex:', sex);
console.log(arguments);
arguments[0] = 'valley';
console.log('name', name);
}
getInfo('小明', 2, '男');

传递的参数:最终获得的值
name:小明 //函数内部对参数无赋值,所以选择输入的值。
age: 2 //理由同上
sex: 男 //理由同上
0:valley //console.log(arguments)表示输出每一个参数的值。
于是先读取getInfo函数自己的局部环境,读取到了valley。
于是显示valley。
1: 2 //先读取getInfo函数自己的局部环境,没读取到值。于是向上找,找到了输入的值2。
3: 男 //理由同上
name: valley //在getInfo函数的局部环境里向上读取,在上方发现了name赋值,所以显示valley。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function  getInfo(name, age, sex){ 
console.log('name:',name);
console.log('age:', age);
console.log('sex:', sex);
console.log(arguments);
arguments[0] = 'valley';
console.log('name', name);
}
getInfo('小小明', 3);

name: 小小明 //函数内部对参数无赋值,所以选择输入的值。
age: 3 //理由同上。
sex: undefined //第三个参数没有输入,所以显示undefined。
0: valley //console.log(arguments)表示输出每一个参数的值。于是先读取getInfo函数自己的局部环境, //读取到了valley。于是显示valley。
1: 3 //函数内部对参数无赋值,所以选择输入的值。
name: valley //在函数局部环境内向上读取发现已经对name赋值,所以显示valley。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
function  getInfo(name, age, sex){  
console.log('name:',name);
console.log('age:', age);
console.log('sex:', sex);
console.log(arguments);
arguments[0] = 'valley';
console.log('name', name); \
}
getInfo('男');

name: 男 //在自己的局部环境的上方没有读取到值,所以向上一级读取,显示为男。
age:undefined //整个环境内都没有赋值,所以显示为undefined sex:undefined //整个环境内都没有赋值,所以显示为undefined
0: valley //console.log(arguments)表示输出每一个参数的值。于是先读取getInfo函数自己的局部环境, 读取到了valley。于是显示valley。
name:valley //在函数局部环境内向上读取发现已经对name赋值,所以显示valley。

题外话:
函数是有参数的,在声明函数的时候可以在定义的函数旁加一个参数,当你要执行的时候,需要调用带有该参数的函数,如果没有传递这个参数的话,相当于这个带有参数的函数结果就为:undefined
如:

1
2
3
4
5
6
7
function  printName(){ 
var name = arguments[0]
console.log(name);
}
printName()

-->输出:undefined

图:
image

5、函数返回值

函数,即把一段语句包装起来,调用函数的参数的时候,就会执行这些语句,更多的是得到一些结果。就像表达式给一个结果,希望函数执行后给一个反馈,我们可以通过return来实现
如:

1
2
3
4
5
function  sum(a,b,c){ 
console.log(a+b) //只是把计算的结果展示在控制台,无其他事(用户若不打开控制台无意义)
return a+b }
var result = sum(4,6)
console.log(result) //返回10

假设:没有return,会出现什么结果呢?
image

以上结果以说明,console.log(a+b),输出10,只是把计算结果呈现在控制台,表示它做了这件事情,只不过没有把结果返回。但是console.log(a+b)本身也是一个函数,整个函数本质上执行的结果为undefined,调用result,结果也是undefined

❌错误写法:

1
2
3
4
5
6
7
function  sum(a,b,c){ 
return console.log(a+b)
}
var result = sum(4,6)
console.log(result)
//返回10
//undefined

但是有这样的写法:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
         function  fn(score){ 
if(score<0)
return console.log(score)
}
fn(-3)

//等同于

function fn(score){
if(score<0) {
return undefined
}
console.log(score)
}
fn(-3)

//等同于
function fn(score){
if(score<0) {
}
else{
console.log(score)
}
}
fn(-3)

四、重载

1、什么是函数重载

重载是很多面向对象语言实现多态的手段之一,在静态语言中确定一个函数的手段是靠方法签名——函数名+参数列表,也就是说相同名字的函数参数个数不同或者顺序不同都被认为是不同的函数,称为函数重载。

2、JS没有函数重载

在JavaScript中没有函数重载的概念,函数通过名字确定唯一性,参数不同也被认为是相同的函数,后面的覆盖前面。函数调用没必要把所有参数都传入,只要你函数体内做好处理就行,但前提是传的参数永远被当做前几个
传递不同的参数,做不同的事情,根据函数中参数类型和个数去进行逻辑判断。

-------------本文结束感谢您的阅读-------------