JavaScript 函数的使用

JavaScript 函数的使用

• 函数的定义： 函数就是用来执行任务的代码块，函数须要经过调用的方式来完成代码的执行。函数的最大好处：包含在函数内容的代码块，能够重复执行

• 函数的做用： 将完成任务的代码块"封装”起来，供其余调用方 无限制 的使用。

• 函数的分类：
     若是按照参数的个数来分：无参函数、有参函数
     若是按照返回值来分：有返回值函数、无返回值函数
     若是按照编写函数的对象来分：预约义函数（系统函数）和自定义函数

• 函数的优势：

  1.代码灵活度高，经过传递不一样的参数，能够取得不一样的效果。

  2.代码的复用性强，函数一旦定义，任何地方均可以调用，而不须要再次编写。

  3.JS中的函数能够响应网页的事件，JS中的事件驱动模型就是经过网页事件结合JS函数来作到的。

• 在JS中，定义函数有三种方式：函数声明（函数定义），函数表达式，箭头函数(此篇不做介绍)

• 函数的命名： 容许字母、数字、$、下划线

• 函数声明：

function Test([可选参数1],[可选参数2], ...){    
     //函数体代码
}  
复制代码

function 是一个关键字 Test 叫函数名 ()是函数的特殊标志 { }叫函数体
在()中，能够给这个功能块一些数据，那么在{}中这个功能块能够给你返回一些数据

示例： 定义一个函数，用来计算两个数的和

function add(x,y){    // x,y为形式参数  
    // 你能够把形参看成在函数体中的局部变量
    var sub =   x+y;  
    return sub;  
}  
add(1,2);     // 1,2为实际参数
var m = add(1,2);  
console.log(m)
复制代码

• 在函数调用时，能够给这个功能块传递真实的数据，调用时，传递的数据，叫实际参数，简称为实参

• 函数调用的过程就是实参向形参赋值的过程，就是把实参copy一份给形参

• return 表示函数的返回值 返回值是返回到函数的调用处 (若是函数没有使用return返回内容，可是你依旧想获得函数的返回值，那么你获得的值，只能是undefined)

• 使用function声明的函数，也是会提高的（和 变量 相似，具体查看我写的《JavaScript 变量的使用》）

示例：

Test();  
function Test(){  
    console.log("函数的提高...");  
}  
复制代码

上面代码 至关于 以下代码

function Test(){  
    console.log("函数的提高...");  
}    
Test(); 
复制代码

定义一个函数,打印九九乘法表

function Table(){   
    let str = "";  
    // 计算出这个九九乘法表  
    // 外面的for循环表示多少行  
    for(let i = 1; i<=9; i++){  
        // 里面的for循环表示一行有多少个  
        for(let j=1; j<=i; j++){  
            str += j+"*"+i+"="+i*j+" ";  //拼凑
        }  
        str += "\n";  
    }  
    console.log(str)  
}  
Table();  
Table();  
Table();
复制代码

把这个函数封装起来，等到使用的时候，只需调用就能够 Table() 这个方法就是调用九九乘法表，而且能够无限制的调用，上面的例子调用了三次，因此输出了三个 九九乘法表

• 函数表达式 （在js中函数也是值，咱们能够把一个函数赋给一个变量）

示例：

var Test = function(){  
    console.log("函数表达式...");  
}    
Test(); 
复制代码

注： 函数表达式以前调用函数，能够吗？答：不能够
缘由：var Test; 会提高 本质是变量 它提高到最前面时 var Test; 而后Test()

• 函数返回值

在JS中，若是一个函数没有指定返回值，那么这个函数返回undefined

function f(){  
    return undefined;  // 这行可写可不写  
}  
console.log(f());   
复制代码

---

函数能够返回多个值吗？
示例：声明一个函数，这个函数的功能是求两个数的最大值，最小值，平均值

function f(m,n){  
    var max = m>n ? m:n;  
    var min = m<n ? m:n;  
    var avg = (m+n)/2;  
    return max,avg,min;  
}  
console.log(f(1,9));  //输出结果：1  
复制代码

return 语句只能返回一个值，不能返回多值，(若是返回多个值，则默认返回最后一个值)

函数内能够有多个 return 吗？

function f(m,n){  
    var max = m>n ? m:n;    
    return max; 
    var min = m<n ? m:n;    
    return min; 
    var avg = (m+n)/2;  
    return avg;  
}  
console.log(f(1,9));  //输出结果：9  
复制代码

在一个函数中若是遇到了 return 语句，那么 return 语句后面的代码都不会执行

如何解决上面的问题？

function f(m,n){  
    var max = m>n ? m:n;    
    var min = m<n ? m:n;     
    var avg = (m+n)/2;  
    return [max,min,avg];
}  
console.log(f(1,9));  //输出结果：9,1,5
复制代码

由于 return 只能返回一个值，若是你要返回多个值，那么就把多个值放到一个容器中（数组，对象）

• 回调函数

在函数式编程中，你能够把一个函数看成另外一个函数的参数
若是一个函数看成了另外一个函数的参数，那么咱们就称这个函数为回调函数
示例：

//计算两个数的和  
function add(x,y){  
    return x+y;  
}    

//计算两个数的差  
function sub(x,y){  
    return x-y;  
}    

function Test(f,a,b){
    return f(a,b);
}    

console.log(Test(add,1,2)); 输出结果：3
console.log(Test(sub,1,2));  输出结果：-1
复制代码

你要封装一个函数，这个函数的功能是计算两个数的和或差
Test 这个函数有三个参数：
  第一个参数是一个回调函数
  第二个和第三个参数是形参

函数表达式

var add = function(x,y){
    return x+y;  
}  
  
var sub = function(x,y){
    return x-y;  
}  
 
function Test(f,a,b){
    return f(a,b);
}    
  
console.log(Test(add,1,2)); 输出结果：3
console.log(Test(sub,1,2));  输出结果：-1
复制代码

之后用这种方式多一点

function Test(f,a,b){
    return f(a,b);
}      

var m = Test(function(x,y){
     return x+y;
},1,2)    

console.log(m);  输出结果：3
复制代码

如需了解更多，还需深刻学习哦！

---

^_<