手写代码

 <ul class="nav">
        <li>榴莲</li>
        <li>臭豆腐</li>
        <li>鲱鱼罐头</li>
        <li>大猪蹄子</li>
    </ul>
    <script>
        // 1.输出当前时间 
        function showTime() {
            var nowdate = new Date();
            var year = nowdate.getFullYear(),
                month = nowdate.getMonth() + 1,
                date = nowdate.getDate(),
                day = nowdate.getDay(),
                week = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"],
                h = nowdate.getHours(),
                m = nowdate.getMinutes(),
                s = nowdate.getSeconds(),
                h = checkTime(h),
                m = checkTime(m),
                s = checkTime(s);
            return year + "年" + month + "月" + date + "日" + week[day] + h + ":" + m + ":" + s;

        };
        function checkTime(i) {
            return i < 10 ? '0' + i : i;
        };
        console.log(showTime());

        // 2.倒计时效果
        function countTime(time) {
            var nowTime = +new Date(); // 返回的是当前时间总的毫秒数
            var inputTime = +new Date(time); // 返回的是用户输入时间总的毫秒数
            var times = (inputTime - nowTime) / 1000; // times是剩余时间总的秒数 
            var d = parseInt(times / 60 / 60 / 24),
                h = parseInt(times / 60 / 60 % 24),
                m = parseInt(times / 60 % 60),
                s = parseInt(times % 60),
                d = checkTime(d),
                h = checkTime(h),
                m = checkTime(m),
                s = checkTime(s);
            return d + '天' + h + '时' + m + '分' + s + '秒';
        }
        function checkTime(i) {
            return i < 10 ? '0' + i : i;
        };
        console.log(countTime('2022-6-7 23:30:00'));

        // 3.数组去重

        // 方法一
        function unique(arr) {
            //定义一个新的临时数组 
            var newArr = [];
            //遍历当前数组 
            for (var i = 0; i < arr.length; i++) {
                if (newArr.indexOf(arr[i]) === -1) {  //indexOf() 判断数组中有没有字符串值，如果没有则返回 -1 
                    newArr.push(arr[i]);
                }
            }
            console.log(newArr)
        }
        var arr = [1, 1, 2, 2, 3, 4, 4, 4, 4, 5, 5, 6];
        console.log(unique(arr));

        // 方法二
        function unique(arr) {
            var newArr = [];
            arr.map((v, i) => {
                if (arr.indexOf(arr[i]) == i) {
                    newArr.push(arr[i]);
                }
            })
            return newArr;
        };
        var arr = [115, 22, 22, 554, 95, 884, 56, 115, 22];
        console.log(unique(arr));

        // 方法三
        function unique(arr) {
            // Array.from方法可以将 Set 结构转为数组。
            return Array.from(new Set(arr));
        }
        var arr = ['aa', 'bb', 'cc', 'cc', 'dd', 'dd', 'ee', 'ee']
        console.log(unique(arr));

        // 4.查找字符串"abcoefoxyozzopp"中所有o出现的位置以及次数
        function getStr(str) {
            var index = str.indexOf('o');
            var num = 0;
            while (index !== -1) {
                console.log(index);
                num++;
                index = str.indexOf('o', index + 1);
            }
            return 'o出现了' + num + '次';
        }
        console.log(getStr('abcoefoxyozzopp'));

        // 5. // 判断一个字符串 'abcoefoxyozzopp' 中出现次数最多的字符，并统计其次数。
        function getMaxStr(str) {
            var o = {};
            for (var i = 0; i < str.length; i++) {
                var chars = str.charAt(i);
                if (o[chars]) {
                    o[chars]++; // o[chars] 属性值
                } else {
                    o[chars] = 1;
                }
            }
            // 遍历对象
            var max = 0;
            var ch = '';
            for (var k in o) {
                if (o[k] > max) {
                    // k 得到是 属性名
                    // o[k] 得到的是属性值
                    max = o[k];
                    ch = k;
                }
            }
            return '出现最多的是' + ch + '它的次数为' + max;
        }
        console.log(getMaxStr('abcoefoxyozzopp'));


        // 6. 闭包应用-点击li输出当前li的索引号
        // 1. 我们可以利用动态添加属性的方式
        var lis = document.querySelector('.nav').querySelectorAll('li');
        for (var i = 0; i < lis.length; i++) {
            lis[i].index = i;
            lis[i].onclick = function () {
                // console.log(i);
                console.log(this.index);

            }
        }
        // 2. 利用闭包的方式得到当前小li 的索引号
        for (var i = 0; i < lis.length; i++) {
            // 利用for循环创建了4个立即执行函数
            // 立即执行函数也成为小闭包因为立即执行函数里面的任何一个函数都可以使用它的i这变量
            (function (i) {
                // console.log(i);
                lis[i].onclick = function () {
                    console.log(i);

                }
            })(i);
        }

        // 7. 深浅拷贝
        // 1. 浅拷贝
        var obj = {
            id: 1,
            name: 'andy',
            msg: {
                age: 18
            }
        };
        var o = {};
        Object.assign(o, obj);
        console.log(o);

        // 2. 深拷贝
        // 封装函数 
        function deepCopy(newobj, oldobj) {
            for (var k in oldobj) {
                // 判断我们的属性值属于那种数据类型
                // 1. 获取属性值  oldobj[k]
                var item = oldobj[k];
                // 2. 判断这个值是否是数组
                if (item instanceof Array) {
                    newobj[k] = [];
                    deepCopy(newobj[k], item)
                } else if (item instanceof Object) {
                    // 3. 判断这个值是否是对象
                    newobj[k] = {};
                    deepCopy(newobj[k], item)
                } else {
                    // 4. 属于简单数据类型
                    newobj[k] = item;
                }

            }
        }
        deepCopy(o, obj);