2021-11-28

七、Math和Date

1.排序算法

sort()方法,用于对数组排序。注意:该排序方法,是根据数组中,每一个元素首字符的unicode编码进行排序的

手写排序算法:

1.冒泡排序算法

2.选择排序算法

<!DOCTYPE html>

<html>

<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>数组的排序方法</title>

</head>

<body>

    <script>

        // sort()方法,用于对数组排序

        let arr1 = [33,55,22,11,44]

        // console.log(arr1);

        // 注意:该排序方法,是根据数组中,每一个元素首字符的unicode编码进行排序的

        // arr1.sort()

        // 冒泡排序算法

        // 第一层循环,控制比较的轮数 (数组长度为5,比较4轮)

        for(let i=0;i<arr1.length-1;i++){

            // 第二层循环,控制每轮比较的次数(第一轮比较4次,第四轮比较1次)

            for(let j=0;j<arr1.length-1-i;j++){

                // 每次用前一个数 去比较 后一个数

                if(arr1[j] > arr1[j+1]){

                    //如果前一个数 大于 后一个数 就 互换位置

                    //定义一个中间变量,去换位置

                    let temp = arr1[j]

                    arr1[j] = arr1[j+1]

                    arr1[j+1] = temp

                }

            }

        }

        console.log(arr1);

        // 选择排序算法

        // 第一层循环,控制每轮选择的数

        for(let i=0;i<arr1.length-1;i++){

            // 第二层循环,控制每轮参与比较的数(第一轮,j从1-4;第二轮,j从2-4)

            for(let j=i+1;j<arr1.length;j++){

                //如果选择的数 大于 参与比较的数 就互换

                if(arr1[i] > arr1[j]){

                    let temp = arr1[i]

                    arr1[i] = arr1[j]

                    arr1[j] = temp

                }

            }

        }

        console.log(arr1);

    </script>

</body>

</html>

控制台显示:

2.Math对象

Math对象 里面提供的方法,可以帮助我们解决算术问题

提供的方法:

1.Math.random() 返回一个0到1之间的随机数

2.abs() 返回一个数的绝对值

3.ceil() 向上取整

4.floor() 向下取整

5.max() 返回最大值

6.min() 返回最小值

7.pow() 返回指定数的次幂

8.round() 四舍五入

9.PI属性,返回圆周率

<!DOCTYPE html>

<html>

<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>Math对象</title>

</head>

<body>

    <script>

        // Math对象 里面提供的方法,可以帮助我们解决算术问题

        // PI属性,返回的是圆周率

        console.log(Math.PI);

        // random() 返回一个0到1之间的随机数

        console.log(Math.random());

        // 随机返回一个1000-2000之间的数

        console.log(parseInt(Math.random()*1001)+1000);

        // abs() 返回一个数的绝对值

        console.log(Math.abs(-55));

        // ceil() 向上取整(只要有小数,就进一)

        console.log(Math.ceil(55.01));

        // floor() 向下取整(去掉所有小数点)

        console.log(Math.floor(55.99))

        // max() 返回最大值

        console.log(Math.max(11,22,33,38,2,3,4));

        // min() 返回最小值

        console.log(Math.min(11,22,33,38,2,3,4));

        // pow() 返回指定数的次幂

        console.log(Math.pow(3,3));

        console.log(Math.pow(4,4));

        // round() 四舍五入

        console.log(Math.round(55.5));

        console.log(Math.round(55.4));

        console.log(Math.round(-55.5));

        console.log(Math.round(-55.6));

        // sqrt() 开平方根

        console.log(Math.sqrt(16));

    </script>

</body>

</html>

控制台显示:

3.Date对象

创建并返回系统当前日期

let date1 = new Date()

在创建日期对象时,可以传递一个时间戳参数 。时间戳:是从1970-1-1开始的毫秒数

let date2 = new Date(123456789)

也可以根据一个指定的时间,返回一个日期对象

let date3 = new Date('2011-1-1 12:12:12')

提供的方法:

1.getFullYear() 返回年份

2.getMonth() 返回月份 返回的值是0-11(0表示1月份,11表示12月份)

3.getDate() 返回月份的日期

4.getDay() 返回星期几 返回的值是0-6,(0表示星期天)

5.getHours() 返回小时 返回的值是0-23(0表示凌晨12点)

6.getMinutes() 返回分钟

7.getSeconds() 返回秒

8.getMilliseconds() 返回毫秒

9.getTime() 返回时间戳

getXXX方法用于获取时间对象中指定的部分

setXXX方法用于设置时间对象中指定的部分

练习题:

1.计算两个日期相差多少天,注意:两日期对象相减,返回的是两个日期时间戳相减后的值

2.时间效果

<!DOCTYPE html>

<html>

<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>Date对象</title>

</head>

<body>

    <script>

        // 创建并返回系统当前日期

        let date1 = new Date()

        console.log(date1);

        // 也可以根据一个指定的时间,返回一个日期对象

        let date2 = new Date('2020-11-11 3:3:3')

        console.log(date2);

        // 在创建日期对象时,可以传递一个时间戳参数

        // 时间戳:是从1970-1-1开始的毫秒数

        let date3 = new Date(1234234234232)

        console.log(date3);

        console.log('------------------------------');

        // getFullYear() 返回年份

        let year = date1.getFullYear()

        console.log(year);

        // getMonth() 返回月份 返回的值是0-11(0表示1月份,11表示12月份)

        let month = date1.getMonth()+1

        console.log(month);

        // getDate() 返回月份的日期

        let date = date1.getDate()

        console.log(date);

        console.log(`${year}-${month}-${date}`);

        // getHours() 返回小时 返回的值是0-23(0表示凌晨12点)

        let hour = date1.getHours()

        console.log(hour);

        // getMinutes() 返回分钟

        let minute = date1.getMinutes()

        console.log(minute);

        // getSeconds() 返回秒

        let second = date1.getSeconds()

        console.log(second);

        console.log(`${year}-${month}-${date} ${hour}:${minute}:${second}`);

        // getMilliseconds() 返回毫秒

        let millisecond = date1.getMilliseconds()

        console.log(millisecond);

        // getDay() 返回星期几 返回的值是0-6,(0表示星期天)

        let day = date1.getDay()

        console.log(day);

        console.log('------------------------------');

        // 时间对象的方法getXXX()用于获取指定的时间部分,setXXX()用于设置时间的指定部分

        // 每一个get方法都有一个对应的set方法。

        date1.setMonth(9)

        date1.setFullYear(2020)

        console.log(date1);

        console.log('------------------------------');

        // 两个日期对象,可以加减运算,返回的是两个日期对象时间戳加减后的结果

        let d1 = new Date('2002-10-14')

        let d2 = new Date()

        let time = d2-d1  //两个日期相减后的毫秒数

        console.log(time);

        console.log(Math.floor(time/1000));

        console.log(Math.floor(time/1000/60));

        console.log(Math.floor(time/1000/60/60));

        console.log(Math.floor(time/1000/60/60/24));

    </script>

</body>

</html>

控制台显示:

<!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>时间效果</title>

    <style>

        div {

            font-size: 30px;

            background-color: #369;

            color: white;

            display: inline-block;

            padding: 2px 10px;

        }

    </style>

</head>

<body>

    <div id="date">

    </div>

    <script>

        // 获取网页中的div元素(根据元素的id选择器,获取元素)

        let div = document.getElementById('date')

        //定时器,让定时器1000毫秒执行一次

        setInterval(() => {

            // 创建一个当前日期对象

            let now_date = new Date()

            // 获取年月日,时分秒

            let year = now_date.getFullYear()

            let month = now_date.getMonth() + 1

            let date = now_date.getDate()

            let hour = now_date.getHours()

            let minute = now_date.getMinutes()

            let second = now_date.getSeconds()

            //将获取到的时间信息,拼接成一个字符串

            let str = [year, month, date].join('-') + ' ' + [hour, minute, second].join(':')

            //将拼接后的时间数据,显示在div中

            div.innerText = str

        }, 1000);

    </script>

</body>

</html>

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容