JavaScript函数

最新推荐文章于 2025-06-03 09:40:25 发布

曹莓养乐多多

最新推荐文章于 2025-06-03 09:40:25 发布

阅读量923

点赞数

文章标签：前端 javascript

本文链接：https://blog.youkuaiyun.com/weixin_52474888/article/details/124000849

版权

为什么需要函数

第一，将语句集合成函数的好处是方便代码重用。所谓“重用”，是指有一些代码的功能是相同的，操作是一样的，只不过针对的数据不一样，这时就可以将这种功能写成一个函数模块，以后用到这个功能时只需要调用这个函数模块就可以了，不需要再重复地编写同样的代码。这样可以解决大量同类型的问题，避免重复性操作。

第二，将语句集合成函数方便代码的维护。哪个功能出问题了，或者需要修改某个功能，那就只需要修改某个功能的函数就可以了。

所以，函数有利于程序的模块化。这实际上就是面向过程的思想。面向过程语言最基本的单位不是语句，而是函数。

什么是函数

第一，函数就是模块，一块一块的，有较强的独立性，可以相互调用，换句话说，程序中，一个函数里面可以调用 n 个函数，即大函数调用小函数，小函数又调用“小小”函数。这就是结构化程序设计，所以面向过程的语言又叫结构化语言。

第二，函数就是一系列语句的集合，能完成某个特定的功能。需要该功能的时候直接调用该函数即可，不用每次都堆叠代码。需要修改该功能时，也只需要修改和维护这一个函数即可。

定义函数

function 函数名（）{

函数体；

}

注意：function是定义函数的关键字、“函数名”是你给函数取的名字，且必须是唯一的、 “函数体”是为完成特定功能的代码。

函数定义好之后，不能自动执行，需要调用它，直接在需要的位置写上函数名。

定义函数方法：

1. 第一种情况 , 在 <script> 标签内调用

function 函数名(){

函数体;

}

函数名 ();// 函数调用，直接写函数名

    <script>
        // function sayBay() {
        //     alert("再见");
        // }
        // +function () {
        //     alert("你好");
        // }()
        -function () {
            alert("你好");
        }()
    </script>

2. 在 HTML 文件中调用，例如通过点击按钮后用定义好的函数

如：<input type=“button” value=“click” onclick=“add() ”/>

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        function sayBay() {
            alert("再见");
        }
        +function () {
            alert("你好");
        }()
            - function () {
                alert("你好");
            }()
    </script>
</head>

<body>
    <!-- <button onclick="sayBay()">点击</button>
    <button onclick="sayBay()">shishi</button>
    <button onclick="sayBay()">全部</button>
    <button onclick="sayBay()">去吧</button> -->
</body>

</html>