3JavaScript函数

Posted 2020-06-09 大扑棱蛾子

知识点

• 函数定义
• 函数调用
• 传参
• 函数的返回值
• 变量的作用域
• 匿名函数
• 回调函数
• 自调函数
• 内嵌函数
• 递归调用
• 闭包

函数定义

来看下面的代码。

function print(){
    console.log(‘123‘);
}

上面的代码定义了一个函数
- function 定义函数的关键字
- print 函数名
- {} {}中的内容为函数体，即console.log(‘123’);

函数调用

print();

使用上面的代码可以调用函数，函数的调用方法为funcName([arg1,arg2...,argN])

传参

首先定义一个带有参数的函数

function print(str){
    console.log(str);
}

在这个函数中str为参数，调用方式为print(‘123‘)。这时候将‘123‘传入了str，在函数中就可以使用str了。

Note
- 以上面的函数为例，在调用的时候可以不传入参数，语法上是不会有错的。这时str的值为undefined
- 也可以传入多个参数，如print(‘123‘,‘456‘)。因函数定义的时候只定义了一个参数，所以这里只接收第一个参数。

Javascript函数内建的arguments数组
每个函数内部都有一个内建的arguments数组，它能返回函数接收的所有参数，不管函数有没有定义参数。

function print(){
    console.log(arguments);
}

//-------------

> print(‘123‘,‘456‘)
> ["123", "456"]

这时arguments数组中有两个元素，分别是‘123‘,‘456‘。

函数的返回值

function add(num1,num2){
    return num1 + num2;
}

> var result = add(1,2)
> console.log(result );
> 3

利用arguments改造函数

function add(){
    var sum = 0;
    for(var i=0;i<arguments.length;i++){
        sum += arguments[i]
    }
    return sum;
}

函数经过改造后我们可以传任意多的参数，但是参数类型必须是number类型，如果是其他类型最终的结果只能是NaN。

> var result = add(1,2,4,5)
> console.log(result );
> 12

变量的作用域

首先以JS文件内部的变量说起。
在js所有{}之外定义的变量都为全局变量。如下

//This is a javascript file
var std = {};

全局变量在任何地方都可以使用，但是在任何一个地方对全局变量的更改都会反应到其他引用变量的地方。

var std = {};

std = 0;

console.log(std);

//这里我们定义了一个名为std的全局变量，然后为其赋值为0。然后使用console.log打印std这时std的值已经变为了0，而不是{}

函数的参数名对于函数本身来说也是一个变量，这个变量可以在函数体内的任何地方使用，但仅在函数体中有效。

function print(str){
    console.log(str);
}
//str仅在函数体中有效，在函数体外是无法使用str变量的

在{}中定义的变量仅在{}中有效

if(x > 2){
    var t = true;
    console.log(t);
}
console.log(t);

>true
>Uncaught ReferenceError: t is not defined

匿名函数和回调函数

指没有函数名的函数。

function(a){
    print(a);
}

匿名函数的应用场景
1. 作为一个变量的值

var print = function(str){
    console.log(str);
}
print(‘123‘)
> 123

1. 作为函数的参数传入

function process(data,callback){
    if(data.success){
        callback(data.msg);
    }
}

var myData = {
    success: true,
    msg: ‘hello‘
}

process(myData,function(msg){
    console.log(msg);
});

在这里

function(msg){
    console.log(msg);
}

就是一个匿名函数，同时也是一个回调函数。回调函数指将函数作为变量传入另一个函数，供其使用。
回调函数不一定是匿名函数，如下可以对上面的代码做下改造。

function print(str){
    console.log(str);
}

proccess(myData,print);

自调函数

指函数在定义后可以自行调用。

(function(){
    print(‘123‘);
})()

>123

自调函数的传参

(function(msg){
    print(msg);
})(‘123456‘)

内嵌函数

值在函数中定义函数。内嵌函数的作用域为函数体

递归调用

函数在函数体中调用其自身，通常用于遍历树状节点。