一、进制转换(了解)与保留小数(掌握)

十进制转换为其他进制

十进制数字.toString(其他进制的数)

var num = 100
num.toString(2) // 将 10 进制的 100, 转换为 2 进制的数, 得到了: '1100100'
num.toString(36) // 将 10 进制的 100, 转换为 36 进制的数, 得到了: '2s'

其他进制转换为十进制

var num = parseInt(数字, 将数字视为几进制的数字然后转换为10进制的数字)

var num = parseInt(100, 2)  // 将100视为2进制的数, 然后将其转换为十进制的数字, 得到了: 4
var num = parseInt(100, 16)  // 将100视为16进制的数, 然后将其转换为十进制的数字, 得到了: 256

保留小数 toFixed, 保留小数时四舍五入, 且返回的是字符串

var num = 100.123456789
var num1 = num.toFixed(2)   // 100.12
var num2 = num.toFixed(4)   // 100.1235

二、Math 与 Date

Math 给我们提供了操作数据的一些方法, 是 JS 内置的一个对象
Date 给我们提供了操作时间的一些方法, 是 JS 内置的一个对象

1.数学方法

1.random
- 语法: Math.random()
- 作用: 得到一个随机数, 每次生成的数字都不一样, 但一定是0~1之间的,包含0 不包含1

        console.log(Math.random())//0-1之间任意的数

随机函数概率统计

       function fn() {
           // 1. 先拿到随机数
           var num = Math.random()

           // 2. 将随机数放大 10 倍
           num *= 10

           // 3. 将随机数取整 (四舍五入)
           num = Math.round(num)

           // 4. 将计算后的随机数 返回
           return num
       }
       
       // 基本版
       var obj = {}
       for (var i = 1; i <= 11000; i++) {
           var num = fn()
           // console.log(i, '===>', num)
           if (obj[num] === undefined) {
               // 当前分支执行, 表明 num 内部存储的随机数字 是 第一次出现
               obj[num] = 1
           } else {
               // 当前分支执行, 表明 num 内部存储的随机数字 之前出现过
               // obj[num] = obj[num] + 1
               obj[num] += 1
           }
       }
       console.log(obj)
       
        // 优化
       var obj = {}
       for (var i = 1; i <= 11000; i++) {
           var num = fn()
           obj[num] = obj[num] ? obj[num] + 1 : 1
       }
       console.log(obj)

2.round
- 语法: Math.round(数字)
- 作用: 将一个小数四舍五入变成整数

       console.log(Math.round(10.1))//10
       console.log(Math.round(10.9))//11

3.ceil
- 语法: Math.ceil(数字)
- 作用: 将一个小数向上取整

       console.log(Math.ceil(10.1))//11 
       console.log(Math.ceil(10.9))//11 
       console.log(Math.ceil(-10.1))//-10 
       console.log(Math.ceil(-10.9))//-10

4.floor
- 语法: Math.floor(数字)
- 作用: 将一个小数, 向下取整

       console.log(Math.floor(10.1))//10 
       console.log(Math.floor(10.9))//10 
       console.log(Math.floor(-10.1))//-11 
       console.log(Math.floor(-10.9))//-11

5.abs
- 语法: Math.abs(数字)
- 作用: 返回一个数字的绝对值

        console.log(Math.floor(10))//10 
        console.log(Math.floor(-10))//10

6.sqrt
- 语法: Math.sqrt(数字)
- 作用: 求平方根

        console.log(Math.sqrt(4))//2
        console.log(Math.sqrt(16))//4

7.pow
- 语法: Math.pow(基数, 幂)
- 作用: 返回基数的几次幂
8.max
- 语法: Math.max(数字1, 数字2, 数字3, 数字4)
- 作用: 返回最大值

       console.log(Math.max(100, 59, 77, 201, 566)) //566
       console.log(Math.max([100, 59, 77, 201, 566])) //NaN

9.min
- 语法: Math.min(数字1, 数字2, 数字3, 数字4)
- 作用: 返回最小值

       console.log(Math.min(100, 59, 77, 201, 566, 1)) //1
       console.log(Math.min([100, 59, 77, 201, 566])) //NaN

让最大值和最小值能够接收数组

       console.log(Math.max(...[100, 59, 77, 201, 566])) //566
       var arr = [100, 59, 77, 201, 566]
       console.log(Math.min(...arr)) //59

10.PI
- 语法: Math.PI
- 作用: 得到 π
封装函数: 范围内的随机整数

       function getRandom(N,M) { 
          return Math.floor(Math.random()*(M-N+1)+N) 
       }

2. 时间对象

时间对象的创建

语法: var timer = new Date()

不传参

默认返回当前时间

var timer = new Date()
console.log(timer)
// Fri Oct 07 2022 08:52:29 GMT+0800 (中国标准时间)

传参

可以获取到一个你传递进去的时间

var timer = new Date('2022-01-06 12:12:12')
console.log(timer)
// Thu Jan 06 2022 12:12:12 GMT+0800 (中国标准时间)

传递两个数字, 第一个为年, 第二个为月

var timer = new Date(2022, 00)  // 注意 月份从 0 开始计数, 0表示1月, 11表示12月
console.log(timer)
// Sat Jan 01 2022 00:00:00 GMT+0800 (中国标准时间)

传递三个数字, 前两个不变, 第三个表示该月份的第几天, 从1到31

var timer = new Date(2022, 00, 31)  // 注意 月份从 0 开始计数, 0表示1月, 11表示12月
console.log(timer)
// Mon Jan 31 2022 00:00:00 GMT+0800 (中国标准时间)

传递四个数字, 前三个不变, 第四个表示当天的几点, 0-23

var timer = new Date(2022, 00, 31, 23)  // 注意 月份从 0 开始计数, 0表示1月, 11表示12月
console.log(timer)
// Mon Jan 31 2022 23:00:00 GMT+0800 (中国标准时间)

传递五个数字, 前四个不变, 第五个为该小时的多少分钟, 0-59

var timer = new Date(2022, 00, 31, 23, 59)  // 注意 月份从 0 开始计数, 0表示1月, 11表示12月
console.log(timer)
// Mon Jan 31 2022 23:59:00 GMT+0800 (中国标准时间)

传递六个参数, 前五个不变, 第六个表示该分钟的多少秒, 0-59

var timer = new Date(2022, 00, 31, 23, 59, 59)  // 注意 月份从 0 开始计数, 0表示1月, 11表示12月
console.log(timer)
// Mon Jan 31 2022 23:59:59 GMT+0800 (中国标准时间)

传递字符串的形式

console.log(new Date('2019'))   // Tue Jan 01 2019 08:00:00 GMT+0800 (中国标准时间)

console.log(new Date('2019-02'))   // Fri Feb 01 2019 08:00:00 GMT+0800 (中国标准时间)

console.log(new Date('2019-02-28')) // Thu Feb 28 2019 08:00:00 GMT+0800 (中国标准时间)

console.log(new Date('2019-02-28 13:')) // Thu Feb 28 2019 13:00:00 GMT+0800 (中国标准时间)
 
console.log(new Date('2019-02-28 13:13:')) // Thu Feb 28 2019 13:13:00 GMT+0800 (中国标准时间)
 
console.log(new Date('2019-02-28 13:13:13')) // Thu Feb 28 2019 13:13:13 GMT+0800 (中国标准时间)

将日期对象格式化成指定内容

我们得到的时间字符串是: Thu Feb 28 2019 13:13:13 GMT+0800 (中国标准时间)
我们得到这个日期中是那年或者那天, 需要靠截取字符串的形式得到
但是现在 JS 为我们提供了一系列的方法来得到里面的指定内容

getFullYear

得到指定字符串中的那一年

var timer = new Date(2022, 00, 31, 23, 59, 59)
console.log(timer) // Mon Jan 31 2022 23:59:59 GMT+0800 (中国标准时间)
console.log(timer.getFullYear()) // 2022

getMonth

得到指定字符串中的那一月, 月的计数从 0 开始

var timer = new Date(2022, 00, 31, 23, 59, 59)
console.log(timer) // Mon Jan 31 2022 23:59:59 GMT+0800 (中国标准时间)
console.log(timer.getMonth()) // 0

getDate

得到指定字符串中的那一日

var timer = new Date(2022, 00, 31, 23, 59, 59)
console.log(timer) // Mon Jan 31 2022 23:59:59 GMT+0800 (中国标准时间)
console.log(timer.getDate()) // 31

getHours

得到指定字符串的那小时

var timer = new Date(2022, 00, 31, 23, 59, 59)
console.log(timer) // Mon Jan 31 2022 23:59:59 GMT+0800 (中国标准时间)
console.log(timer.getHours()) // 23

getMinutes

得到指定字符串中的那分钟

var timer = new Date(2022, 00, 31, 23, 59, 59)
console.log(timer) // Mon Jan 31 2022 23:59:59 GMT+0800 (中国标准时间)
console.log(timer.getMinutes()) // 59

getSeconds

得到指定字符串中的那秒钟

var timer = new Date(2022, 00, 31, 23, 59, 59)
console.log(timer) // Mon Jan 31 2022 23:59:59 GMT+0800 (中国标准时间)
console.log(timer.getSeconds()) // 59

getDay

获取当前日期是一周中的第几天(周日是0, 周六是6)

var timer = new Date(2022, 00, 31, 23, 59, 59)
console.log(timer) // Mon Jan 31 2022 23:59:59 GMT+0800 (中国标准时间)
console.log(timer.getDay()) // 1

getTime

按照格林威治时间计算从1970 年 1 月 1 日 0 时 0 分 0 秒到现在(或指定日期)的毫秒数

var timer = new Date(2022, 00, 31, 23, 59, 59)
console.log(timer) // Mon Jan 31 2022 23:59:59 GMT+0800 (中国标准时间)
console.log(timer.getTime()) // 1554681622000

设置相关

setFullYear()

语法: 时间对象.setFullYear(年份信息)
作用: 修改该时间对象内的年份信息

var time = new Date()
timer.setFullYear(2008)
console.log(timer.getFullYear())

setMonth()

语法: 时间对象.setMonth(月份信息)
作用: 修改该时间对象内的月份信息

var time = new Date()
timer.setMonth(2)
console.log(timer.getMonth())

setDate()

语法: 时间对象.setDate(日期信息)
作用: 修改该时间对象内的日期信息

var time = new Date()
timer.setDate(4)
console.log(timer.getDate())

setHours()

语法: 时间对象.setHours(小时信息)
作用: 修改该时间对象内的小时信息

var time = new Date()
timer.setHours(12)
console.log(timer.getHours())

setMinutes()

语法: 时间对象.setMinutes(分钟信息)
作用: 修改该时间对象内的分钟信息

var time = new Date()
timer.setMinutes(45)
console.log(timer.getMinutes())

setSeconds()

语法: 时间对象.setSecond(秒钟信息)
作用: 修改该时间对象内的秒钟信息

var time = new Date()
timer.setSeconds(20)
console.log(timer.getSeconds())

setMilliseconds()

语法: 时间对象.setMilliseconds(毫秒信息)
作用: 修改该时间对象内的毫秒信息

var time = new Date()
timer.setMilliseconds(857)
console.log(timer.getMilliseconds())

setTime()

语法: 时间对象.setTime(毫秒信息)
作用: 使用时间戳信息直接定位时间对象

var time = new Date()
timer.setTime(1440004004531)
console.log(timer)

三、定时器

两种定时器的介绍和作用 ( setTimeout / setInterval )

1.setInterval 计时器, 每间隔固定的时间执行一次

语法: setInterval(函数, 数字)
- 函数: 每间隔多少时间执行的代码数字: 间隔时间, 单位是毫秒

        setInterval(function () {
            console.log('定时器每次执行的时候, 我就会被打印一次')
        }, 1000)
        setInterval(function () {
            console.log('定时器每次执行的时候, 我就会被打印一次')
        }, 0)
        setInterval(function () {
            console.log('定时器每次执行的时候, 我就会被打印一次')
        })

2.setTimeout 倒计时器, 在指定时间到达后, 执行一次

语法: setTimeout(函数, 数字)
- 函数: 一段时间后执行的代码数字: 间隔时间, 单位是毫秒

        setTimeout(function () {
            console.log('倒计时器时间到的时候, 我会执行一次')
        }, 1000)
        setTimeout(function () {
            console.log('倒计时器时间到的时候, 我会执行一次')
        }, 0)
        setTimeout(function () {
            console.log('倒计时器时间到的时候, 我会执行一次')
        })

定时器的返回值及意义
- 返回值不区分定时器种类, 用于表示你这个定时器是页面中的第几个定时器
- 作用: 用来关闭定时器
- 注意: 关闭语法可以混用, 所以只要关闭定时器, 随便写上边那个都可以

        var timerId = setInterval(function () {}, 1000)
        console.log(timerId)
        var timerId = setTimeout(function () {}, 1000)
        console.log(timerId)

关闭定时器
- 不区分定时器种类, 只要给出正确的定时器返回值就可以关闭
- 语法:
  - clearTimeout(定时器返回值)
  - clearInterval(定时器返回值)

        // 利用返回值 停止定时器
        var timerID = setInterval(function () {
            console.log('定时器执行的时候~~~~~~~~~')
        }, 1000)
        setTimeout(function () {
            console.log('倒计时器执行, 停止了上边的定时器')
            clearInterval(timerID)
        }, 5000)
        
        var timerId = setTimeout(function () {
            console.log('3秒钟后我会执行')
        }, 3000)
        clearTimeout(timerId)

四、简单的代码异步执行机制

JS 的异步任务
- JS 是单线程的, 同一时间只能做一件事
- 如果只有单线程那么可能会遇到一些问题
- 上述的方案如果遇到一个中间的代码耗时很久, 那么后续的所有代码, 都需要等待上边的代码执行完毕后在执行，这种情况给用户的感觉就是非常卡顿。
- 为了解决上述的问题, JS 将代码分为两个任务
  - 同步任务:目前所接触到的内容中, 除了两个定时器之外的都是同步任务
  - 异步任务:目前所接触到的内容中, 只有两个定时器算是异步任务, 将来还会有新的异步任务
JS 中代码执行的顺序
- 代码从上往下执行
- 先将代码中所有的同步任务, 全都执行一遍
- 同步任务执行完毕后, 在执行异步任务
- 如果在代码的中间遇到了异步任务, 那么先将异步任务暂存到一个任务队列中, 等待所有的同步任务执行完毕后执行

        console.log('1. JS开始执行')

        setTimeout(function () {
            console.log('2. 一个非常耗时的任务执行完毕')
        })

        console.log('3. JS执行完毕')
         /**
         *  同步任务
         *      1. JS开始执行
         *      3. JS执行完毕
         * 
         *  异步任务
         *      2. 一个非常耗时的任务执行完毕
        */

JS---Math与Date

一、进制转换(了解)与保留小数(掌握)

二、Math 与 Date

1.数学方法

2. 时间对象

时间对象的创建

将日期对象格式化成指定内容

getFullYear

getMonth

getDate

getHours

getMinutes

getSeconds

getDay

getTime

设置相关

setFullYear()

setMonth()

setDate()

setHours()

setMinutes()

setSeconds()

setMilliseconds()

setTime()

三、定时器

1.setInterval 计时器, 每间隔固定的时间执行一次

2.setTimeout 倒计时器, 在指定时间到达后, 执行一次

四、简单的代码异步执行机制