JavaScript 函数

最新推荐文章于 2024-03-02 22:46:17 发布

MW0309

最新推荐文章于 2024-03-02 22:46:17 发布

阅读量255

点赞数

分类专栏： JavaScript 文章标签： javascript

本文链接：https://blog.csdn.net/qq_42222342/article/details/105013709

版权

JavaScript 专栏收录该内容

31 篇文章 1 订阅

订阅专栏

JavaScript 函数

函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。
作用：
使程序变得简短而清晰
有利于程序维护
可以提高程序开发效率
提高了代码的重用性（复用性）
语法：

function 函数名(){
	 函数体(具体要执行的代码);
}

实践

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>函数</title>
    <script>
        function print() {
           for (var i=1;i<=10;i++){
               document.write(i+"<br>")
           }
        }
    </script>
</head>
<body>
    <button onclick="print()">点我</button>
</body>
</html>

效果图

在这里插入图片描述

有参数无返回值的函数

有参数无返回值的函数
实参：实际传入的参数。
形参：形参上的参数。
function 函数名(形参1，形参2，...){
	 函数体(具体要执行的代码);
}
调用函数：
   格式：函数名（实参1，实参2...）;
传参：用实参给形参赋值

实践

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>有参数无返回值</title>
    <script>
        function print(n) {
            for (var i=1;i<=n;i++){
                document.write(i+"<br>")
            }
        }
        print(5);
    </script>
</head>
<body>
</body>
</html>

效果图

在这里插入图片描述

有参数有返回值的函数

封装函数步骤：
            1、分析不确定值
            2、将不确定值声明称形参
            3、函数名和形参名都要见名思意。
return 关键字
语法：
 function 函数名(形参1,形参2) {
 			函数体;
            return 表达式;
 }

实践

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>有参数有返回值</title>
    <script>
        function summer(a,b) {
            return a+b;
        }
        var res=summer(10,20);
        document.write(res)
    </script>
</head>
<body>

</body>
</html>