Js函数的定义

函数:封装了一段可反复执行调用的代码块。

目标:能够让大量代码重复使用

求和

函数的命名是动词,而变量名的命名是名词
        function getSum(num1, num2) {            var sum = 0;            for (var i = num1; i <= num2; i++) {                sum = sum + i;            }            return sum;        }        console.log(getSum(1, 100)); //求~100的和        console.log(getSum(1, 1000)); //求1~1000的和    </script>

函数的应用?

1.申明函数

2.调用函数

申明函数

    function 函数名() {        //函数体    }

调用函数

  函数名()

注意事项

  • function是申明函数的关键字,必须是小写
  • 函数是做某件事情,因而函数名为动词
  • 函数自身不执行,必须调用能力应用
  • 调用函数不要遗记加小括号呀

案例

    <script>        //申明函数        function sayHi() {            return '尧子陌'        }        //调用函数        console.log(sayHi())    </script>

函数的封装

函数的封装:简略而言,就是把一个性能或多个性能以函数的形式进行封装,对外提供一个简略的函数接口。简略了解:相似于快递打包。

求1~10之间的相乘的后果

    <script>        function getSum(num1, num2) {            var sum = 1;            for (var i = num1; i <= num2; i++) {                sum = sum *i;            }            return sum;        }        console.log(getSum(1, 10)); //求~10的相乘的后果    </script>

带参数的函数

  • 函数的参数:形参加实参
  • 形参:申明函数时,函数名前面的小括号外面的参数是形参,形参是模式上的参数。形参是为了承受理论参数传递的值。
  • 实参:调用函数时,函数名前面的小括号外面的参数是实参,实参是实际上的参数。
  • 参数:函数外部的值不固定,咱们能够通过参数调用函数传递不同的值进去

      //申明函数  function 函数名(形参1,形参2...){        }  //调用函数   函数名(实参1,实参2...) 
    <script>        //申明函数        function cook(arr) {            return arr        }                //调用函数        console.log(cook("酸辣土豆丝"))        console.log(cook("香辣大白菜"))    </script>

函数的参数能够有,也能够没有,依据状况而定

函数的案例

求任意两个数的和

    <script>        // 申明函数        function getSum(num1, num2) {            return num1 + num2        }        //调用函数        console.log(getSum(100, 200))        console.log(getSum(10, 20))    </script>

求任意两个数之间的和

<script>    //申明函数    function getSum(star, end) {        var sum = 0;        for (var i = star; i <= end; i++) {            sum = sum + i;        }        return sum    }    //调用函数    console.log(getSum(20, 50))    console.log(getSum(1, 100))</script>

函数形参加实参个数的匹配

函数形参加实参个数统一的状况下,则失常输入后果

<script>    //申明函数    function getSum(num1, num2) {        return num1 + num2    }    //调用函数    console.log(getSum(10, 20))</script>

函数形参的个数小于实参的个数,则取形参的个数

<script>    //申明函数    function getSum(num1, num2) {        return num1 + num2    }    //调用函数    console.log(getSum(1, 200, 500))</script>

函数形参的个数大于实参的个数,则后果为undefined

剖析如下

  • 函数的形参能够看作是未声明的变量,后果为undefined
  • 任何数值加undefind最终后果都为NaN(不是一个数值)
<script>    //申明函数    function getSum(num1, num2, num3) {        return num1 + num2 + num3    }    //调用函数    console.log(getSum(100, 200)) //形参的个数大于实参的个数的状况下     console.log(getSum(100, 200, 500)) //形参的个数与实参的个数统一的状况下</script>

函数参数的总结

  • 函数能够带参数,也能够不带参数
  • 函数的参数有多个时,两头用英文状态下的逗号相隔
  • 申明函数时,函数名小括号里的参数为形参,其默认值为undefined
  • 调用函数时,函数名前面的小括号为实参,用来传递值给形参
  • 函数的形参加实参的个数该当统一,否则后果难以预计。

函数的返回值

函数是做某件事情或实现某种性能,最终都会把后果返回给函数调用者
<script>    //申明函数    function getResult() {        return 520    }    //调用函数    console.log(getResult())</script>

察看执行过程,在函数执行过程中,遇到retern便会把前面的后果返回给函数的调用者

求两个数之间的最大值

第一种办法:利用if语句

<script>    function comParison(num1, num2) {        if (num1 > num2) {            return num1        } else {            return num2        }    }    console.log(comParison(20, 50))</script>

第二种办法:利用三元表达式

<script>    function comParison(num1, num2) {        return num1 > num2 ? num1 : num2    }    console.log(comParison(20, 50))</script>

利用函数求最大值

留神:在理论开发过程中,通常用变量接管函数的返回值

<script>    function getMax(arr) {        var max = arr[0];        for (var i = 0; i <= arr.length; i++) {            if (max < arr[i]) {                max = arr[i]            }        }        return max    }    // 在理论开发中,咱们通常用一个变量来接管函数的返回值。    var result = getMax([5, 2, 22, 96, 85])    console.log(result)</script>

return 终止函数

在函数外部 retur返回的后果前面的语句不执行

<script>    function getSum(num1,num2) {        return num1+num2;        alert("return 终止函数")  //return 后果前面的代码块不会执行    }   console.log( getSum(20,50))</script>

return前面只能返回一个值

<script>    function  getSum(num1,num2) {        return num1,num2    }console.log(getSum(2,5))</script>

利用数组能够返回多个值

<script>    function getSum(num1,num2) {        return [num1*num2,num1/num2,num1+num2,num1- num2]    }    console.log(getSum(20,50))</script> 

break continue nreturn的区别

  • break:完结以后循环
  • continue:跳出以后循环,持续下一次循环
  • return:不仅能够跳出循环而且能够完结函数体内的代码,返回return前面的后果

通过榨汁机来看透函数

arguments的应用

当咱们不确定传递多少个实参的时候,能够应用arguments对象,arguments对象是函数内置的对象,存储着所有传递过去的实参
<script>    function fn() {        console.log(arguments);        for(var i =0;i<arguments.length;i++) {                    return arguments[i]        }    }    console.log(fn(20,20,50,80))    console.log(fn(20,20,50,80,100))</script>

注意事项

  • arguments是伪数组,并不是真正的数组
  • 具备length属性,依照索引的形式进行存储
  • 不能应用真正的数组办法,如push() pop()等等

利用arguments求任意个数的最大值

  • 思路如下 数组中求最大值的思路一样,只不过采纳arguments对象来获取数组中的最大值。
<script>            function getMax() {        // 申明一个最大变量Max        var Max = 0;        for(var i=0;i<arguments.length;i++) {            if(Max<arguments[i]) {                Max = arguments[i]            }        }        return Max;    }        console.log(getMax(20,50,60)) //60    console.log(getMax(20,50,60,100)) //100    </script></script>

函数封装的案例

采纳函数封装的形式 反转任意数组

<script>    function reserve(arr) {        var newArr= [];        for(var i = arr.length-1 ;i>=0;i--) {            newArr[newArr.length] = arr[i]        }        return newArr    }    console.log(reserve([10,20,50]));     console.log(reserve([10,20,50,500,4522,205]));</script>

利用函数封装的形式 实现冒泡排序

<script>    function sorce(arr) {        for(var i = 0;i<arr.length-1;i++){            for(var j = 0;j<arr.length-i-1;j++) {                if(arr[j]>arr[j+1]) {                    var temp = arr[j];                    arr[j] = arr[j+1];                    arr[j+1] = temp                }            }        }        return arr    }    console.log(sorce([20,50,80,30,15,60]))    console.log(sorce([200,510,880,30,195,60]))</script>

利用函数封装的形式 实现判断是否是平年

申明一把锁,如果是平年,则返回true,如果不是平年,则返回false

<script>    function isRunYear(year) {                var flag  = false;        if(year % 4 ==0 && year % 400 != 0 || year % 400 == 0) {            flag = true;        }        return flag    }    console.log(isRunYear(2000))     console.log(isRunYear(2001))</script>

函数之间能够相互调用

每个函数都是一个独立的代码块,为了实现特殊任务,函数之间能够互相调用
<script>    function fn1() {        console.log('111')         fn2() //调用fn2()    }    fn1()    function fn2() {        console.log('222');            }</script> 

求下列代码的后果

<script>    function fn1() {        console.log(111);        fn2();                console.log('fn1')    }    function fn2() {        console.log(222);        console.log('fn2')    }    fn1()</script>

判断以后年份的二月份有多少天?

在feBruary函数中,if判断语句中调用isRunYear函数并传参进去,如果为true,则弹出2月份有29天,如果是false,则弹出二月份有28天
<script> function  feBruary() {     var year = prompt("请输出以后的年份")    if(isRunYear(year)) {        alert('以后是平年 2月份有29天')            }else {        alert('以后是平年 2月份有28天')    } } feBruary() //调用函数    function isRunYear(year) {                var flag  = false;        if(year % 4 ==0 && year % 400 != 0 || year % 400 == 0) {            flag = true;        }        return flag    }    console.log(isRunYear(2000))    console.log(isRunYear(2001))</script>

函数的两种申明形式

函数的第一种申明形式:function关键字申明

function fn() {    console.log('hello')}fn()

函数的第二种申明形式:函数表达式申明函数

<script>    var fn = function(str) {        console.log(str)    }    fn('hello word')</script>

留神:

  • fn是变量名 而不是函数名
  • 申明变量和申明函数的形式差不多,只不过变量外面存储的值,函数表达式外面存储的是函数
  • 函数表达式也能够传递参数