一篇文章学会 js :函数function

js函数function(一)


function函数
function的英文是[功能],[数] 函数;职责;盛大的集会的意思
在js里,就是函数的意思。在Java里叫做方法。

定义函数
function fun(参数){
//函数体
//return可有可无,根据实际要求加或不加
}

使用函数
//函数名()
fun();
ps:在js里,我们的方法可以先调用后声明,也就是调用寒素的代码可以写在定义函数的前面。

实参、形参
实参:简单理解就是实际的参数,在调用函数的时候传的
形参:简单理解就是在定义函数时,用来接收调用时传的值

var n1=123 , n2=456
//调用函数
fun(n1 , n2)

//定义函数
function fun( a , b){
    a += 100
    b += 100
    console.log(a , b)
}
console.log(n1 , n2)

//运行结果:223 , 556
//123 , 456

ps:我们可以看出,实参和形参并不是同一个变量
不太严谨的参数列表
先看一段代码:

function fun(a , b , c){
    console.log(a*10 , b+10 , c-10)
}
//调用
fun(1,2,3)//输出结果10,12,-7
//这里是没毛病的,正常输出

//但是下面这个调用呢???
fun(20,2)
fun()
fun(12,32,14,5)

ps:上面的写法,都不会报错…如果不信可以自己试试。

我们在定义函数的时候,定义了多少个参数,按道理来说,就应该严格按照规范传参,但是没办法,js里比较‘宽容’,你传了多少个参数,就接收多少个参数
如果多传了就无视你多传的参数,从第一个','前的参数为第一个参数算

如果少传了,没有传的那几个参数,就为**undefined**。都没传那就值都为undefined

return关键字
首先,在js里,并没有规定函数在定义的时候,一定要有返回值或者返回值类型这一说法,很活跃的,你想返回什么结果都可以
其次,如果要返回结果或者结束函数体,就要用到return关键字

 return用于返回函数的值给调用者

return一旦执行,则立马结束当前的函数,注意:必须时返回具体的值才会结束(可以思考一下递归调用)
return函数中可以有多个,返回不同条件下的值。比如在switch中,每个case后面可以用return返回具体的值
arguments
在es5里,arguments是一个对象,用来接收所有的参数,用法和数组一致;不过目前已被废弃,有更好的代替它
es6:(推荐使用)

function fun( n1, n2, ...args ){
    //args只能接收n2后面的数
    //用...接收的就是一个数组,可以遍历
}

ps:…后面不一定要写args,可以自己随便命名,符合字符串规范就行。一般用args表示

关于…args的用法
args不能放在参数列表的前面
args有且只有一个
关于函数的耦合问题
先看代码:

var num = 100
var res = fun(1)
//定义函数
function fun(n){
    console.log( num + n )
}
//输出为101

ps:上面的代码运行结果没问题,但是,耦合度很高,因为在函数体内,用全局变量运算,这就很忌讳,如果项目要移植,这些用到的变量就会拖泥带水的,耦合度高。这在以后的工作中这么干容易被炒鱿鱼…
注意:如果要使用,传参数就好了,千万别使用全局变量

函数名的问题
var f = function fun(){
console.log(“my name is rainbow”)
}
console.log(f)
ps:我们把一个函数体,赋值给了一个变量,那么这个变量打印出来会怎么样呢?
**结果:**并不会报错,而是直接打印出了整个函数体的内容。我们可以这么想,调用函数的时候,我们写的是fun(),也就是 函数名() 就变成了调用了。其实,js里面还真是这么干的,函数名加括号就是调用了一次函数。
在这里,大家和我想一个问题,这个方法体赋值给了变量,那这个变量是什么类型呢???

匿名函数
简单理解就是,你要使用一个函数,但是这个函数没有名字,这要怎么使用呢。
很简单,上面不是说了吗?

调用函数就是 函数名()
而又因为 函数名 = 方法体
那么 方法体() = 函数名()
这样就调用了一次函数
var a = 10;
var b = 20;****************
var f = function(){
console.log(n1+n2)
};
f(a,b)//输出结果30
自执行函数
自执行函数就是自己定义自己执行
这个就是匿名函数的应用
复制
(function(){
console.log(‘this is rainbow !’)
})();
例子
使用函数
//函数名()
fun();
ps:在js里,我们的方法可以先调用后声明,也就是调用寒素的代码可以写在定义函数的前面。

实参、形参
实参:简单理解就是实际的参数,在调用函数的时候传的
形参:简单理解就是在定义函数时,用来接收调用时传的值

var n1=123 , n2=456
//调用函数
fun(n1 , n2)

//定义函数
function fun( a , b){
    a += 100
    b += 100
    console.log(a , b)
}
console.log(n1 , n2)

//运行结果:223 , 556
//123 , 456

ps:我们可以看出,实参和形参并不是同一个变量

不太严谨的参数列表
先看一段代码:

function fun(a , b , c){
    console.log(a*10 , b+10 , c-10)
}
//调用
fun(1,2,3)//输出结果10,12,-7
//这里是没毛病的,正常输出

//但是下面这个调用呢???
fun(20,2)
fun()
fun(12,32,14,5)

ps:上面的写法,都不会报错…如果不信可以自己试试。

我们在定义函数的时候,定义了多少个参数,按道理来说,就应该严格按照规范传参,但是没办法,js里比较‘宽容’,你传了多少个参数,就接收多少个参数
如果多传了就无视你多传的参数,从第一个’,'前的参数为第一个参数算
如果少传了,没有传的那几个参数,就为undefined。都没传那就值都为undefined
return关键字
首先,在js里,并没有规定函数在定义的时候,一定要有返回值或者返回值类型这一说法,很活跃的,你想返回什么结果都可以
其次,如果要返回结果或者结束函数体,就要用到return关键字

return用于返回函数的值给调用者
return一旦执行,则立马结束当前的函数,注意:必须时返回具体的值才会结束(可以思考一下递归调用)
return函数中可以有多个,返回不同条件下的值。比如在switch中,每个case后面可以用return返回具体的值
arguments
在es5里,arguments是一个对象,用来接收所有的参数,用法和数组一致;不过目前已被废弃,有更好的代替它
es6:(推荐使用)

function fun( n1, n2, ...args ){
    //args只能接收n2后面的数
    //用...接收的就是一个数组,可以遍历
}

ps:…后面不一定要写args,可以自己随便命名,符合字符串规范就行。一般用args表示

关于…args的用法
args不能放在参数列表的前面
args有且只有一个
关于函数的耦合问题
先看代码:

var num = 100
var res = fun(1)
//定义函数
function fun(n){
    console.log( num + n )
}
//输出为101

ps:上面的代码运行结果没问题,但是,耦合度很高,因为在函数体内,用全局变量运算,这就很忌讳,如果项目要移植,这些用到的变量就会拖泥带水的,耦合度高。这在以后的工作中这么干容易被炒鱿鱼…
注意:如果要使用,传参数就好了,千万别使用全局变量

函数名的问题
var f = function fun(){
console.log(“my name is rainbow”)
}
console.log(f)
ps:我们把一个函数体,赋值给了一个变量,那么这个变量打印出来会怎么样呢?
结果:并不会报错,而是直接打印出了整个函数体的内容。我们可以这么想,调用函数的时候,我们写的是fun(),也就是 函数名() 就变成了调用了。其实,js里面还真是这么干的,函数名加括号就是调用了一次函数。
在这里,大家和我想一个问题,这个方法体赋值给了变量,那这个变量是什么类型呢???

匿名函数
简单理解就是,你要使用一个函数,但是这个函数没有名字,这要怎么使用呢。
很简单,上面不是说了吗?

调用函数就是 函数名()
而又因为 函数名 = 方法体
那么 方法体() = 函数名()
这样就调用了一次函数
var a = 10;
var b = 20;****************
var f = function(){
console.log(n1+n2)
};
f(a,b)//输出结果30
自执行函数
自执行函数就是自己定义自己执行
这个就是匿名函数的应用
复制
(function(){
console.log(‘this is rainbow !’)
})();
例子
var a = 10;
var b = 20;
(function( n1 , n2 ) {
console.log( n2 + n1)
})(a ,b);
//输出结果为30

ps

自执行函数的函数体必须要用()包起来。建议最后加上分号 ';'
自执行应用场景一般在一些类库上

猜你喜欢

转载自blog.csdn.net/weixin_52630329/article/details/112726957