重学Javascript基础（八）JavaScript常见内置类

文章	分类	评论
60	3	9

01.奇怪现象-原始类型调用方法

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var name = "Hello World"
        var height = 1.88
        // function String(str){
        //     this.str = str
        //     this.length = 11
        //     this.split = function(){

        //     }
        // }

        // 在调用原始类型的属性和方法时，内部的操作 name = new String(name)
        console.log(name.length)
        console.log(name.split(" "))
        console.log(height.toFixed(2))

        // var obj = {
        //     name:"kobe",
        //     running:function(){

        //     }
        // }
        // obj.running()

        // 原始类型默认也是可以动手的创建对象（没有必要这样来做）
        var name1 = new String("Hello World")
        console.log(typeof name,typeof name1);
        // Number/String
        
    </script>
</body>
</html>

02.包装类型-Number类型的使用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
    <script>
        // Number构造函数 -> window.Number
        // var num = 123 // new Number(num)
        
        // 类属性
        // Number中本身是有自己的属性
        console.log(Number.MAX_VALUE)
        console.log(Number.MIN_VALUE)

        // integer:整数
        console.log(Number.MAX_SAFE_INTEGER)
        console.log(Number.MIN_SAFE_INTEGER)

        // 对象的方法
        // toString(base)
        var num = 1000
        console.log(num.toString(),typeof num.toString())
        console.log(num.toString(2))
        console.log(num.toString(8))
        console.log(num.toString(16))

        // console.log(123..toString(2))

        // toFixed的使用（重要）
        var pi = 3.1415926
        console.log(pi.toFixed(3))

        // 类的方法
        // parseInt
        // parseFloat
        // 整数：123
        // 浮点数：小数 123.321
        var num1 = "123.521"
        console.log(Number(num1).toFixed(0))
        console.log(Number.parseInt(num1))
        console.log(Number.parseFloat(num1))

        // window对象上面
        console.log(parseInt(num1))
        console.log(parseFloat(num1))

        // function HYNumber(){

        // }
        // HYNumber.parseInt2 = function(){

        // }
        // window.parseInt2 = HYNumber.parseInt2
        // console.log(window.parseInt2 === HYNumber.parseInt2)

        console.log(parseInt === Number.parseInt)
    </script>
</body>
</html>

03.内置对象-Math对象使用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // console.log(typeof Number) // function
        // var num = new Number()

        // Math -> 对象
        // window/obj/console
        // console.log(typeof Math)
        // var math = new Math()

        // Math对象的属性
        // console.log(Math.PI)

        // // Math对象的方法
        // var num = 3.55
        // console.log(Math.floor(num)) // 3
        // console.log(Math.ceil(num)) // 4
        // console.log(Math.round(num)) // 4

        // 另外方法
        // random：随机生成[0,1)
        // console.log(Math.random())
        // 需求：[5~50）的随机数
        // [a,b)
        // y = a 
        // x = b -a 
        // Math.floor(Math.random() * x) + y
        for(var i = 0;i<1000;i++){
            var randomNum = Math.floor(Math.random() * 45) + 5
            console.log(randomNum)
        }

        // Math.pow(x,y)
        console.log(Math.pow(2,4))
    </script>
</body>
</html>

04.包装类型-String类型的使用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
    <script>
        var message = "Hello World"
        // 1.属性：length
        console.log(message.length)

        // 2.访问字符串中某个位置的字符
        console.log(message[4])
        console.log(message.charAt(4))
        console.log(message[20])
        console.log(message.charAt(20))

        // 3.字符串的遍历
        // for普通遍历
        for(var i = 0;i < message.length;i++){
            console.log(message[i])
        }

        // for..of的遍历 -> 迭代器
        // 目前可迭代对象：字符串/数组
        // 对象是不支持for..of
        // String对象内部是将字符串变成了一个可迭代对象
        for(var char of message){
            console.log(char)
        }
    </script>
</body>
</html>

05.包装类型-String修改字符串

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var message = "Hello World"

        // 1.严格的修改字符串,之前的字符串内部修改掉
        // message[2] = "a"
        // console.log(message)

        // String两个方法：（重要）
        // toUpperCase:将所有的字符串变成大写
        // toLowerCase:将所有的字符串变成小写

        // var message1 = message.toUpperCase()
        // console.log(message)
        // console.log("message1:",message1)
        // message = message.toUpperCase()

        var message2 = message.toLocaleLowerCase()
        console.log(message2)
        
    </script>
</body>
</html>

06.包装类型-String查找字符串

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var message = "my name is why."
        var name = "why"

        // 判断一个字符串中是否有另外一个字符串
        // 1.indexOf(searchString,fromIndex)
        /*
            index:
                情况一：搜索到,搜索字符串所在的索引位置
                情况二：没有搜索到,返回-1
        */
       var index = message.indexOf(name)
       if(message.indexOf(name) !== -1){
        console.log("message中包含name")
       } else {
        console.log("message不包含name")
       }

       //    2.includes：ES6中新增一个方法,就是用来判断包含关系
       if(message.includes(name)){
        console.log("message中包含name")
       }

       // 3.startsWith:是否以xxx开头
       if(message.startsWith("my")){
        console.log("message以my开头")
       }

       // 4.endWith:是否以xxx结束
       if(message.endsWith("why")){
        console.log("message以why结尾")
       }

       // 5.replace 替换字符串
    //    var newMessage = message.replace("why","kobe")
    //    console.log(message)
    //    console.log(newMessage)
       var newName = "kobe"
       var newMessage = message.replace("why",function(){
        return newName.toUpperCase()
       })
       console.log(newMessage)

    </script>
</body>
</html>

07.包装类型-String字符串获取

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var message = "Hello World"

        // 获取子字符串
        console.log(message.slice(3,7))
        console.log(message.slice(3,-1))
        console.log(message.slice(3))

        // substr
        console.log(message.substr(3,7))
    </script>
</body>
</html>

08.包装类型-String的拼接

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var str1 = "Hello"
        var str2 = "World"
        var str3 = "Kobe"

        // 1.字符串拼接
        // ＋
        // var newString = str1+str2+str3
        // console.log(newString)
        // concat方法:链式调用
        var newString2 = str1.concat(str2).concat(str3)
        var newString3 = str1.concat(str2,str3,"abc","cba")
        console.log(newString2)
        console.log(newString3)

        // 2.删除收尾的空格
        console.log(" why abc".trim())

        // 3.字符串切割split
        var message = "abc-cba-nba-mba"
        var items = message.split("-")
        var newMessage = items.join("*")
        console.log(newMessage)
        
    </script>
</body>
</html>

09.数组Array-创建数组的方式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
    <script>
        // 1.创建数组的方式
        var names = ["why","kobe","james","curry"]

        var product1 = {name:"苹果",print:10}
        var products = [
            {name:"鼠标",price:98},
            {name:"键盘",price:100},
            {name:"西瓜",price:20},
            product1
        ]

        // 2.创建方式二:类Array
        var arr1 = new Array()
        var arr2 = new Array("abc","abc","nba") // ["abc","cba","nba"]
        console.log(arr3,arr3[0])
        var arr4 = [5]

        // 3.通过索引访问元素
        console.log(names[0]) // 第一个元素
        console.log(names[names.length-1]) // 最后一个元素
    </script>
</body>
</html>

10.数组Array-数组的基本操作

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 对于某一个结构的操作:增删改查(数据库)
        var names = ["abc","cba","nba"]

        // 1.访问数组中的元素
        console.log(names[0])
        console.log(names.at(0))

        console.log(names[-1])
        console.log(names.at(-1))

        // 2.修改数组中的元素
        // names[0] = "why"
        // console.log(names)

        // 3.新增数组中的元素(了解)
        names[3] = "kobe"
        names[4] = "james"
        console.log(names)

        // 4.删除数组中的元素(了解)
        delete names[1]
        console.log(names)
        console.log(name[1])
    </script>
</body>
</html>

11.数组Array-新增和删除元素

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
    <script>
        var names = ["abc","cba","nba","mba","abcd"]

        // 1.在数组的尾部添加和删除元素
        // // push方法
        // names.push("why","kobe")
        // console.log(names)
        // // pop方法
        // names.pop()
        // names.pop()
        // console.log(names)

        // 2.在数组的头部添加和删除元素
        // unshift方法
        // names.unshift("why","kobe")
        console.log(names)
        // shift方法
        names.shift()
        console.log(names)

        // 3.在任意位置添加/删除/替换元素
        var names = ["abc","cba","nba","mba","abcd"]
        // 参数一:start,从什么位置开始操作元素
        // 参数二:deleteCount,删除元素的个数

        // 3.1. 删除元素
        names.splice(1,2)
        console.log(names)

        // 3.2 新增元素
        // deleteCount:0,后面可以添加新的元素
        names.splice(1,0,"why","kobe")
        console.log(names)

        // 3.3 替换元素
        names.splice(1,2,"why","kobe","james")
        console.log(names)
        
    </script>
</body>
</html>

12.数组Array-属性length

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var names = ["abc","cba","nba","mba"]

        // 1.属性length
        // 获取数组的长度length
        // console.log(names.length)  // 4

        // length属性可写的(扩容)
        name.length = 10
        console.log(names)

        // 设置的length小于原来的元素个数
        names.length = 0 
        console.log(names)

        // 2.数组的遍历
        // 2.1 普通的for循环
        for(var i = 0;i<names.length;i++){
            console.log(names[i])
        }
        // 2.2 for..in
        for(var index in names){
            console.log(index,names[index])
        }
        // 2.3 for..of
        for(var item of names){
            console.log(item)
        }
    </script>
</body>
</html>

13.数组Array-slice-concat-join

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var names = ["abc","cba","nba","mba","why","kobe"]

        // 1.slice方法:不会修改原数组
        // splice有区别:splice修改原有的数组
        // start 从什么位置开始
        // end 结束位置,不包含end本身
        // var newNames = names.slice(2,4)
        // console.log(newNames)

        // 2.concat方法:将多个数组拼接在一起
        var names1 = ["abc","cba"]
        var names2 = ["nba","mba"]
        var name3 = ["why","kobe"]
        var newNames2 = names1.concat(names2,name3)
        console.log(newNames2)

        // 3.join方法:字符串split
        console.log(names.join("-"))
    </script>
</body>
</html>

14.数组Array-数组中查找元素

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        /**
            indexOf方式.
            手动for循环
            数组的find方法 
        */
       // 1. 数组中存放的是原始类型
       var names = ["abc","cba","nba","mba"]
       // 1.1 indexOf
       // 可以找到,返回对应的索引
       // 没有找到,返回-1
       // console.log(names.indexOf("nbb"))

       // 2.数组中存放的是对象类型
    //    var students = [
    //     { id:100,name:"why",age:18},
    //     {id:101,name:"kobe",age:30},
    //     {id:102,name:"james",age:25},
    //     {id:103,name:"why",age:22}
    //    ]
        // 查找的id是为101的学生信息
        // 2.1 自己写一个for循环
        // var stu = null
        // for(var i = 0;i<students.length;i++){
        //     if(students[i].id === 101){
        //         stu = students[i]
        //         break
        //     }
        // }

        // 判断上面的算法没有找到对应的学生
        // if(stu){
        //     console.log("找到了对应的101学生",stu)
        // }else{
        //     console.log("没有找到对应的101学生")
        // }

        // 2.2 find方法:高阶函数
           var students = [
        { id:100,name:"why",age:18},
        {id:101,name:"kobe",age:30},
        {id:102,name:"james",age:25},
        {id:103,name:"why",age:22}
       ]

       var stu = students.find(function(item){
        if(item.id === 101) return true
       })
       console.log(stu)
       
    </script>
</body>
</html>

15.数组Array-手动实现高阶函数hyForEach

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var names = ["abc","cba","nba"]
        // forEach函数:可以帮助我们遍历数组
        // for(var i = 0;i < names.length;i++){
        //     console.log(names[i])
        // }

        // 1.hyForEach版本一(大部分同学掌握)
        function hyForEach(fn){
            for(var i = 0;i<names.length;i++){
                fn(names[i],i,names)
            }
        }

        hyForEach(function(item,index,names){
            console.log("------",item,index,names)
        })

        // // 2.hyForEach版本二
        // function hyForEach(fn,arr){
        //     for(var i = 0;i<arr.length;i++){
        //         fn(arr[i],i,arr)
        //     }
        // }

        // hyForEach(function(item,index,names){
        //     console.log("-----",item,index,names)
        // },names)

        // hyForEach(function(item,index,names){
        //     console.log("-------",item,index,names)
        // },[123,321,111,222])

        // // 3.hyForEach版本三
        // names.hyForEach = function(fn){
        //     for(var i = 0;i < this.length;i++){
        //         fn(this[i],i,this)
        //     }
        // }

        // names.hyForEach(function(item,index,names){
        //     console.log("-------",item,index,names)
        // })

        // names.forEach(function(item,index,names){
        //     console.log("---------",item,index,names)
        // })

        // 4.hyForEach版本四(了解)
        Array.prototype.hyForEach = function(fn,thisArgs){
            for(var i = 0;i < this.length;i++){
                fn(this[i],i,this)
            }
        }

        // names.hyForEach(function(item,index,names){
        //     console.log("------",item,index,names)
        // })

        // var students = [
        //     {id:100,name:"why",age:18},
        //     {id:101,name:"kobe",age:30},
        //     {id:102,name:"james",age:25},
        //     {id:103,name:"why",age:22},
        // ]

        // students.hyForEach(function(item,index,stus){
        //     console.log("++++++",item,index.stus)
        // })
    </script>
</body>
</html>

16.数组Array-手动实现高阶函数hyFind

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 1.原始类型的查找
        var name = ["abc","cba","nba","mba"]

        // 原生find方法
        var findName = names.find(function(item,index,arr){
            console.log(item,index,arr)
            return item === "nba"
        })
        console.log(findName)

        // 2.数组中对象类型的查找
        var students = [
        { id: 100, name: "why", age: 18 },
        { id: 101, name: "kobe", age: 30 },
        { id: 102, name: "james", age: 25 },
        { id: 103, name: "why", age: 22 }
        ]

        var findStu = students.find(function(item){
            return item.id === 101
        })
        console.log(findStu)

        // 3.自己实现hyFind(百分90以上的不要求)
        Array.prototype.hyFind = function(fn){
            var item = undefined
            for(var i = 0;i<this.length;i++){
                var isFlag = fn(this[i],i,this)
                if(isFlag){
                    // item = this[i]
                    // break
                    return this[i]
                }
            }
            return item
        }

        var findStu = students.hyFind(function(item,index,arr){
            console.log(item)
            return item.id === 101
        })
        console.log(findStu)
    </script>
</body>
</html>

17.数组Array-数组中查找元素

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var names = ["abc","cba","nba"]

        // indexOf/lastIndexOf
        // find:查找元素

        // includes
        // console.log(names.includes("nba"))

        // findIndex:查找元素的索引
        var findIndex = names.findIndex(function(item,index,arr){
            return item === "nba"
        })
        // var findIndex = names.findIndex(item=>item === "nba")
        console.log(findIndex)
    </script>
</body>
</html>

18.数组Array-数组的排序和反转

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var nums = [20,4,10,15,100,88]

        // sort:排序
        nums.sort(function(item1,item2){
            // // item1和item2进行比较
            // // 返回是 整数
            // // 最小谁在前面
            // return item1 - item2

            return item2 - item1
        })

        console.log(nums)
        console.log(nums.reverse());

        // 复杂类型的排序
        var students = [
            {id:100,name:"why",age:18},
            { id: 101, name: "kobe", age: 30 },
            { id: 102, name: "james", age: 25 },
            { id: 103, name: "curry", age: 22 }
        ]

        students.sort(function(item1,item2){
            return item1.age - item2.age
        })

        console.log(students)
    </script>
</body>
</html>

19.数组Array-其他高阶函数的使用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 1.forEach函数
        var names = ["abc", "cba", "nba", "mba"]
        // 三中方式,新增一种方式
        names.forEach(function(item){
            console.log(item,this)
        },{name:"why"})

        // // 2.filter函数:过滤
        // var nums = [11,20,55,100,88,32]
        // // 2.1 for循环实现
        // var newNums = []
        // for(var item of nums){
        //     if(item % 2 === 0){
        //         newNums.push(item)
        //     }
        // }
        // // 2.2 filter实现
        // var newNums = nums.filter(function(item){
        //     return item % 2 = 0
        // })
        // console.log(newNums)

        // // 3.map函数:映射
        // var nums = [11,20,55,100,88,32]
        // var newNums = nums.map(function(item){
        //     return item * item
        // })
        // console.log(newNums)

        // 4.reduce
        var nums = [11,20,55,100,88,32]
        var result = 0
        for(var item of nums){
            result += item
        }
        console.log(result)
        // 第一次执行: preValue->0 item->11
        // 第二次执行: preValue->11 item->20
        // 第三次执行: preValue->31 item->55
        // 第四次执行: preValue->86 item->100
        // 第五次执行: preValue->186 item->88
        // 第六次执行: preValue->274 item->32
        // 最后一次执行的时候 preValue + item, 它会作为reduce的返回值

        // initialValue: 初始化值, 第一次执行的时候, 对应的preValue
        // 如果initialValue没有传呢?
        // var result = nums.reduce(function(preValue, item) {
        //   console.log(`preValue:${preValue} item:${item}`)
        //   return preValue + item
        // }, 0)
        // console.log(result)

        // reduce练习
        var products = [
            {name:"鼠标",price:88,count:3},
            { name: "键盘", price: 200, count: 2 },
            { name: "耳机", price: 9.9, count: 10 },
        ]

        var totalPrice = products.reduce(function(preValue,item){
            return preValue + item.price * item.count
        },0)
        console.log(totalPrice)

        // 综合练习:
        var nums = [11,20,55,100,88,32]

        // 过滤所有的偶数,映射所有偶数的平方,并且计算他们的和
        // var total = nums.filter(function(item){
        //     return item % 2 === 0
        // }).map(function(item){
        //     return item * item
        // }).reduce(function(preValue,item){
        //     return preValue + item
        // },0)
        // console.log(total)

        // var total = nums.filter(item => item % 2 === 0).map(item=>item*item)
        //             .reduce((preValue,item)=>preValue + item,0)
        // console.log(total)
    </script>
</body>
</html>

20.时间Date-创建Date对象的方式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 创建Date对象的方式
        // 1.没有传入任何的参数,获取到当前时间
        var date1 = new Date()
        console.log(date1)

        // 2.传入参数:时间字符串
        var date2 = new Date("2022-08-08")
        console.log(date2)
        // 3.传入具体的年月日时分秒毫秒
        var date3 = new Date(2023,10,10,09,08,07,333)
        console.log(date3)

        // 4.传入一个Unix时间戳
        // 1s -> 1000ms
        var date4 = new Date(10004343433)
        console.log(date4)
    </script>
</body>
</html>

21.时间Date-Date两种表示标准

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var date = new Date()

        console.log(date)
        console.log(date.toDateString())
        console.log(date.toISOString())
    </script>
</body>
</html>

22.时间Date-Date的对象方法

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var date = new Date()
        console.log(date)
        console.log(date.toISOString())

        // 获取想要的时间信息
        var year = date.getFullYear()
        var month = date.getMonth() + 1
        var day = date.getDate()
        var hour = date.getHours()
        var minute = date.getMinutes()
        var second = date.getSeconds()
        console.log(year,month,date,hour,minute,second)
        console.log(`${year}/${month}/${day} ${hour}:${minute}:${second}`)

        var weekday = date.getDate() // 一周中的第几天
        console.log(weekday)

        // 2.也可以给date设置时间(了解)
        date.setFullYear(2033)
        // 自动校验
        date.setDate(32)
        console.log(date)
        
    </script>
</body>
</html>

23.时间Date-获取Unix时间戳

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // var date = new Date(1132324234242)
        // console.log(date)

        // Date对象,转成时间戳
        var date = new Date()
        var date2 = new Date("2023-03-03")

        // 方法一:当前时间的时间戳
        var timestamp1 = Date.now()
        console.log(timestamp1)

        // 方法二/三将一个date对象转成时间戳
        var timestamp2 = date.getTime()
        var timestamp3 = date2.valueOf()
        console.log(timestamp2,timestamp3)

        // 方法四:了解
        console.log(+date)

        // 计算这个操作所花费的时间
        var startTime = Date.now()
        for(var i = 0;i<100000;i++){
            // console.log(i)
        }
        var endTime = Date.now()
        console.log("执行100000次for循环的打印所消耗的时间:",endTime - startTime)

        // 封装一个简单函数
        function testPerformance(fn){
            var startTime = Date.now()
            fn()
            var endTime = Date.now()
        }
    </script>
</body>
</html>

24.时间Date-将字符串时间转换成时间戳

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var timeString = "03/23/2033"

        // 1.方式一:
        var date = new Date(timeString)
        var timestamp = date.getTime()

        // 方式二:
        var timestamp = Date.parse(timeString)
        console.log(timestamp)
        
    </script>
</body>
</html>

感谢大家观看，我们下次见

abzzp

十天看一部剧，还可以吧 [[呲牙]]

@梦不见的梦行，谢谢提醒,我优化一下

梦不见的梦

网站的速度有待提升，每次打开都要转半天还进不来呢

@React实战爱彼迎项目(二) - 程序员鸡皮哪里有问题了，报错了吗？ [[微笑]]

@Teacher Du 那是怕你们毕不了业，我大学那会儿给小礼品 [[发呆]]

Teacher Du

我们大学那会，献血还给学分~

夜

@ab 我想去学网安，比如网警，但分也贼高😕

@夜加油，你一样也可以成为程序员的，需要学习资料可以V我

佬发布的好多技术文章似乎我只能评论这篇，真正的程序员！！哇塞我也想去献血，过两年就成年了可以去献血了

程序员鸡皮

站点介绍