Javascript中的函数

159 阅读4分钟

Javascript中的函数

1.为什么要用函数?

1.函数可以把具有相同或相似逻辑的代码“包裹”起来,通过函数调用执行这些被“包裹”的代码逻辑,这么做的优势是有利于精简代码方便复用。

2.提高效率

2.函数如何使用

函数的语法书写有两部分

1.声明函数

for 函数名 () {

​ 函数体

}

函数体是函数的构成部分,它负责将相同或相似代码“包裹”起来,直到函数调用时函数体内的代码才会被执行。函数的功能代码都要写在函数体当中。

注意的是: 声明(定义)的函数必须调用才会真正被执行,使用 () 调用函数

2.函数调用

函数名();

注意:函数声明之后可以被多次调用,重新执行

alert() , parseInt() 这种名字后面跟小括号的本质都是函数的调用

<script>

        //函数使用分两步
        //1.声明函数

        function sayHi() {
            console.log('你好');
            console.log('你好啊');
            console.log('敲代码啊');
            
        }
        //2.调用函数
        sayHi()

    </script>

1.函数名的书写注意事项

1.函数名命名规范

2.和变量命名基本一致

3.尽量小驼峰式命名法

4.前缀应该为动词

5.命名建议:常用动词约定

1648739892341

3.函数的参数

声明语法

for 函数名( 参数列表) {

​ 函数体

}

调用函数

函数名 (传递的参数列表)

1.函数的形参

声明函数时写在函数名右边小括号里的叫形参(形式上的参数)

形参可以理解为是在这个函数内声明的变量(比如 num1 = 10)实参可以理解为是给这个变量赋值

1648740320331

2.函数的实参

调用函数时写在函数名右边小括号里的叫实参(实际上的参数)

形参可以理解为是在这个函数内声明的(比如 )实参可以

开发中尽量保持形参和实参个数一致,参数之间用逗号隔开

4.函数的返回值

当函数需要返回数据出去时,用return关键字

1.返回值语法书写

for 函数名( 参数列表) {

​ 函数体代码

​ return 返回值

}

调用函数

函数名 (传递的参数列表)

 <script>
        //声明函数
        function fn (x , y)  {
            //返回值给函数
            return x+y

        }
        //调用函数
        fn (20,30) // 50
        console.log( fn (20,30)); //50
    </script>

2.返回值注意的事项

在函数体中使用 return 关键字能将内部的执行结果交给函数外部使用

函数内部只能运行到 1 次 return,并且 return 后面代码不会再被执行,所以 return 后面的数据不要换行写

return会立即结束当前函数

函数可以没有 return,这种情况函数默认返回值为 undefined

5.作用域概述

通常来说,一段程序代码中所用到的名字并不总是有效和可用的,而限定这个名字的可用性的代码范围就是这个名字的作用域。作用域的使用提高了程序逻辑的局部性,增强了程序的可靠性,减少了名字冲突。

1.全局作用域

作用于所有代码执行的环境(整个 script 标签内部)或者一个独立的 js 文件


    <script>

        //再script里面运行的叫全局作用域

        let num = 10 ; //全局
        
     </script>

2.局部作用域(函数作用域)

作用于函数内的代码环境,就是局部作用域。 因为跟函数有关系,所以也称为函数作用域。

  <script>   
   		function getMax() {
            //这个区域就叫局部作用域
            //也可以叫函数作用域
            let num = 100

            return num
        	}

        getMax()
   </script>

3.块级作用域

let定义的变量,只能在块作用域里访问,不能跨块访问,也不能跨函数访问

  <script> 
        for ( let i = 1 ; i <1 ; i++) {

            //块级作用域
            let num1 = 320;
            
        }


        while (true) {

            //块级作用域
            let num2 = 20;
        }
        
    </script>

6.变量的作用域

在JavaScript中,根据作用域的不同,变量可以分为全局变量,局部变量,块级变量

1.全局变量

全局变量在变量定义之后区域可以访问和修改

2.局部变量(函数内部变量)

局部变量只能在当前函数内部访问和修改

3.块级变量({}里面的变量)

let定义的变量,只能在块作用域里访问,不能跨块访问,也不能跨函数访问

4.变量的作用域特殊情况

如果函数内部或者块级作用域内部,变量没有声明,直接赋值,也当全局变量看,但是强烈不推荐

函数内部的形参可以看做是局部变量,所以形参相当于函数内部定义的局部变量,只有在函数内部可以使用

7.函数封装两个数的和案例

需求,由用户输入两个数字,然后得到两个数字的和



    <script>
        //用户输入两个数字
        let mess1 = +prompt('请输入第一个数字')
        let mess2 = +prompt('请输入第二个数字')

        //声明函数中的是形参
        function getSum (num1,num2) {
            //页面输出
            document.write(num1 + num2)

        }

        //调用函数括号里面的是实参
        getSum (mess1,mess2)

    </script>

8.函数封装数组中的和案例

需求是,求某数组中的元素和


    <script>

        //有一个数组
        let arr1 = [ 10,64,37,46,02,61]

        //函数封装关于数组的总和
        function calcSum(arr) {
            //声明一个变量来代表数组的和
            let sum =  0
            for ( let i = 0 ; i < arr.length ; i++) {
                //循环累加数组的值
                sum +=  arr[i]

            }   
            //页面输出苏数组的和
            document.write(`${sum}`)

        }

        //调用函数
        calcSum(arr1)

    </script>