javaScript {函数的概念、如何定义、怎样调用、声明式和赋值式的区别}

208 阅读4分钟

函数的概念

在程序设计中,将一段经常使用的代码“封装”起来,需要时可以直接进行调用

函数的定义

//声明式定义
    function fn1() {
        // 这里边写上将来调用时要执行的代码
        console.log('声明式');
    }
//赋值式定义
    var fn = function () {
        // 这里边写上将来调用时要执行的代码
        console.log('声明式');
    }

函数的调用

函数名();

声明式与赋值式的区别

声明式可以在函数前调用,赋值式不能在函数前调用

函数的预解析

浏览器预解析后,赋值式函数需要变量提升,提升后函数形如 未定义的变量,所以打印后值为undefined,而声明式在预解析时不需要声明提升,所以可以正常输出

函数的参数

函数的参数:函数有了参数才可以实现执行不同的代码块以及输出不同的结果,函数的参数分为形参和实参

形参:写在声明函数的小括号里的参数,意为形式上的参数
实参:写在调用函数的小括号里的参数,意为实际上的参数
function fun1(a,b){
    调用函数执行的语句;
}
fun1(a1,b1);
//a,b为形参,a1,b1为实参,由实参传入形参,代入函数里面进行运算和执行,当实参多形参少时函数能正常调用执行但会输出 NaN,函数中没有匹配到实参的形参值是 undefined,当实参少 形参多时,实参对应的值就说形参对应的值,多余的形参没有值

函数的参数默认值

function fun1(a , b = 100 , c = 300){  //fun1是函数名
    //b=100、c=300即为函数的默认参数,在调用时未传入实参,b c的值为100 300,当传入实参时,b c的返回值为传入的实参
        console.log(a,b,c);
 }
 fun1(20);   //形参比实参多,按照顺序依次传入, a=300b c的默认值不会被发生改变 b c的值还是100300
 fun1(300,100);  //形参比实参多,按照顺序依次传入, a=300 b=100 c的默认值不会被发生改变还是300
 fun1(400,700,1200); //实参和形参数量一样多,a=400,b的默认参数100会被传入的实参700替代,c的默认参数300会被1200替代

函数的调用案列

  1. 书写一个函数, 求任意两个数字的和, 把结果打印在控制台
//声明式函数
        var fun5 = function(a , b){
            console.log('a+b=', a+b);
        }
        fun5(400,200);
        
        
//赋值式函数
        var fun5 = function(a , b){  //fun5为函数名  a,b为函数形参
            console.log('a+b=', a+b); //控制打印a+b的和
        }
        fun5(400,200);
  1. 书写一个函数, 求任意两个数字的和, 把结果输出在页面上
//声明式函数
        function fun3(a , b){  //fun3为函数名  a,b为函数形参
            document.write('a+b=',a+b); //页面打印输入a+b的和
        }
        fun3(120,30);
        
        
//赋值式函数
        var fun6 = function(a , b){
            document.write('a+b=',a+b); //页面打印输入a+b的和
        }
        fun6(120,30);  //调用函数 实参为120 30  a=120 b=30
  1. 书写一个函数, 求任意两个数字的和, 把结果以弹窗的形式展示
// 计算两个函数的和,需要两个函数 a b  ,a+b=sum ;  计算出sum的值
//声明式函数  fun1为函数名  括号里面的a b 为形参  
        function fun1(a , b){   //写一个函数,写入两个形参 a b
            alert('a+b='+(a+b)); //以弹窗形式弹出a+b的和
        }
        fun1(200,300); //调用函数  200为a的实参  300为b的实参
        
//定义式函数
        //fun4为函数名
        var fun4 = function(a , b){  //写一个函数,写入两个形参 a b
            alert('a+b='+(a+b));  //以弹窗形式弹出a+b的和
        }
        fun4(200,300);    //调用函数

函数的返回值

每一个函数都有返回值, 不管是否写了返回值
每个函数 默认都会有返回值 ---> 默认返回 undefined
如果我们自己手写了 返回值, 那么就不会返回默认值了, 返回的是 我们书写的
函数返回值书写语法
return 要返回的内容
注意点:
函数的返回值具有中断函数的功能, 所以我们手写返回值需要放在最后

课堂练习

  1. 封装一个函数, 判断一个数字是不是质数
/*判断一个数是否是质数
      1.封装一个函数
      2.函数内用if语句判断判断是否为质数
      3.一个数如果是质数 return返回一个false,不是return返回一个true
      
*/
        function fun1(n) {    //n为形参
            var prime = true;      //定义一个变量存储判断结果
            for (var i = 2; i < n; i++) {
                if (n % i == 0) {
                    prime = false;   // 不是质数 变量存储false
                }
            }
            if (prime) {     //判断prime是否为真
                return true;   // 变量为真则为质数,返回true
            } else {
                return false;  //变量为假则不是质数,返回false
            }
        }
        console.log(fun1(7)); //调用函数