web学习笔记（十五）

1.Date对象

1.1日期对象的概念

1.2Date()方法的使用

1.3Date()常用方法汇总

1.4例题：用函数编写一个倒计时

2.函数

2.1函数的概念

2.2函数的使用

2.3函数的参数

2.4函数的声明

2.5函数的返回值

2.6异步函数

3特殊函数类型

3.1匿名函数

3.2箭头函数

3.3 函数形参和实参个数不匹配问题

3.4break ,continue ,return 的区别

1.Date对象

1.1日期对象的概念

Date对象和Math对象不一样，他是一个构造函数，所以我们需要实例化后才能使用
Date实例用来处理日期和时间。

1.2Date()方法的使用

格式：let now = new Date();

console.log(now);

当Date()没有参数时，默认返回当前的时间。
当Date()里面写参数时，就返回括号内输入的时间，此处的参数可以有多种格式， eg:'2024-1-11 12:00:00' '2024 1 11 12:00:00' '2024/1/11 12:00:00'

1.3Date()常用方法汇总

1.4例题：用函数编写一个倒计时

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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        #div {
            width: 800px;
            height: 100px;
            margin: 200px auto;
            background-color: black;
            color: #fff;
            font-size: 30px;
            text-align: center;
            line-height: 100px;
            border-radius: 20px;
        }
    </style>
</head>

<body>


<div id="div"> </div>
    <script>
        function countdown() {
            var targetDate = new Date("2024-01-15 12:00:00");
            var currentDate = new Date();
            var timeDiff = targetDate.getTime() - currentDate.getTime();
            var days = Math.floor(timeDiff / (1000 * 60 * 60 * 24));
            var hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
            var minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / (1000 * 60));
            var seconds = Math.floor((timeDiff % (1000 * 60)) / 1000);
            let time = `距离2024-01-15 12:00:00还有：${days}天${ hours}时${minutes}分${seconds}秒 `;
            document.querySelector('#div').innerHTML = time;
        }
        countdown()
        setInterval(function () {
            countdown()
        }, 1000);
    </script>
</body>

</html>

效果：

2.函数

2.1函数的概念

函数就是封装了一段可被重复调用执行的代码块。通过此代码块可以实现大量代码的重复使用。函数对任何语言来说都是一个核心的概念，通过函数可以封装任意多条语句，而且可以在任何地方，任何时候调用执行。

2.2函数的使用

（1）声明函数： function 函数名（）{

代码块

}

（2）调用函数： 函数名（）

可以多次对函数进行调用，调用位置不限，前调和后调都可以。

2.3函数的参数

（1）形参：声明函数的参数叫形参，是局部变量，在函数之外是不起作用的（形参的个数和类型没有限制，多个参数之间以逗号隔开）

（2）实参： 调用函数时传的参数叫做实参

（3）补充：

在JavaScript中，形参的默认值是undefined。
函数分为三种：有参、无参和带返回值。
函数可以带参数，也可以不带参数，不带参数的函数叫做无参函数。