test```html hello title 1 2 3 4 folo title 1 2 3ot ```

<!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>Document</title>
</head>

<body>

    <div id="root">
        <!-- 头部 -->
        <div>
            hello
            <p>
                title
            <ul>
                <li>1</li>
                <li>2</li>
                <li>3</li>
                <li>4</li>
            </ul>
            </p>
        </div>
        <!-- 尾部 -->
        <div>
            foot

        </div>
        <p id="time"></p>
    </div>
    <script>

        let num = 10

        let timer = setInterval(() => {

            num--

            document.querySelector('#time').innerHTML = num
            if (num <= 0) clearInterval(timer)

        }, 1000)




        class Statistical {
            constructor(productId) {
                this.productId = productId
                this.initPerformance()
                this.initError()
            }

            // 发送到服务端
            send(url, params = {}) {
                let paramArr = []
                for (let key in params) {
                    paramArr.push(`${key}=${params[key]}`)
                }
                const el = document.createElement('img')
                el.src = `${url}?${paramArr.join('&')}`
            }

            // 性能
            initPerformance(url) {
                url = '/performance'
                let params = performance.timing
                this.send(url, params)
            }

            event(url,) { }

            // 错误统计
            initError() {

            }

            // 页面统计
            initPv() {

            }
        }

        // let s = new Statistical('1111')


        function Foo2() {
            Foo2.a = function () { console.log(1); }
            this.a = function () { console.log(2); }
        }
        Foo2.prototype.a = function () { console.log(3); }
        Foo2.a = function () { console.log(4); }


        Foo2.a() // 4
        let obj2 = new Foo2()
        obj2.a() // 2
        Foo2.a() // 1

        const arr = [
            { id: 6, name: '部门F', parentId: 3 },
            { id: 7, name: '部门Q', parentId: 10 },
            { id: 6, name: '部门W', parentId: 4 },
            { id: 6, name: '部门R', parentId: 5 },
            { id: 6, name: '部门T', parentId: 1 },

            { id: 1, name: '部门A', parentId: 0 },
            { id: 2, name: '部门B', parentId: 1 },
            { id: 3, name: '部门C', parentId: 1 },
            { id: 4, name: '部门D', parentId: 2 },
            { id: 5, name: '部门E', parentId: 2 },
        ]

        function convert(arr) {
            let map = {};
            let res = []
            /*
              {
                1: {id: 1, name: '部门A', parentId: 0},
                2: {id: 2, name: '部门B', parentId: 1},
                3: {id: 3, name: '部门C', parentId: 1},
                4: {id: 4, name: '部门D', parentId: 2},
                5: {id: 5, name: '部门E', parentId: 2},
                6: {id: 6, name: '部门F', parentId: 3}
              }
    
            */
            arr.map(item => {
                map[item.id] = item
            })

            arr.forEach(item => {
                if (map[item.parentId]) {
                    map[item.parentId].children = map[item.parentId].children || []
                    map[item.parentId].children.push(item)
                } else {
                    res.push(item)
                }
            })

            return res;

        }

        function tree2array(tree) {
            let res = []
            const dfs = (tree) => {
                res.push({ id: tree.id, name: tree.name, parentId: tree.parentId })
                if (tree.children) {
                    tree.children.forEach(dfs)
                }
            }
            tree.forEach(dfs)
            return res;
        }

        [1, 2, 3].map((item, index) => {
            return parseInt(item, index)
        })


        const getType = target => Object.prototype.toString.call(target)

        function deepClone(obj, map = new WeakMap()) {
            if (typeof obj !== "object" || obj === null) return obj;
            if (map.has(obj)) {
                return obj;
            }

            map.set(obj, true);

            let res;
            let type = getType(obj);

            switch (type) {

                case "[object Map]":
                    res = new Map();
                    obj.forEach((item, key) => {
                        res.set(key, deepClone(item, map));
                    });
                    break;

                case "[object Set]":
                    res = new Set();
                    obj.forEach((item) => {
                        res.add(item, deepClone(item, map));
                    });
                    break;
                default:
                    res = type === '[onject Object]' ? {} : []
                    for (let key in obj) {
                        typeof obj[key] === "object"
                            ? (res[key] = deepClone(obj[key], map))
                            : (res[key] = obj[key]);
                    }
                    break;
            }
            return res;
        }

        function fn1(a, b) {
            console.log('fn1', a, b);
        }

        function fn2(a, b) {
            console.log('fn2', a, b);
        }

        function fn3(a, b) {
            console.log('fn3', a, b);
        }

        class LRU {
            constructor(deep) {
                this.deep = deep
                this.list = []
            }

            set(key, val) {
                this.list = this.list.filter(item => item.key !== key)
                this.list.push({ key, val })
                if (this.list.length > this.deep) {
                    this.list.shift()
                }

            }

            get(key) {
                let val = null;
                this.list = this.list.filter(item => {
                    if (item['key'] === key) {
                        val = item['key']
                    }
                    return item['key'] !== key
                })
                if (val) {
                    this.list.push({ key, val })
                }
                return val
            }


        }

        // const lru = new LRU(2)

        // lru.set(1,1) // 1=>1
        // lru.set(2,2) // 2=>2

        // 自定义事件
        class EventBus {
            constructor() {
                /*
                  {
                    'key1': [{fn: fn1, isOnce: false}, {fn: fn2, isOnce: false}]
                  }
     
     
                */
                this.events = {}
            }

            on(key, fn, isOnce = false) {
                this.events[key] ? this.events[key].push({ fn, isOnce }) : this.events[key] = [{ fn, isOnce }]
            }

            once(key, fn) {
                this.on(key, fn, true)
            }

            off(key, fn) {
                if (!fn) {
                    this.events[key] = []
                } else {
                    this.events[key] = this.events[key].filter(item => item.fn !== fn)
                }
            }

            emit(key, ...args) {

                this.events[key] = this.events[key].filter(item => {
                    const { fn, isOnce } = item
                    fn(...args)
                    return !isOnce
                })

            }
        }

        // const e = new EventBus()

        // e.on('key1', fn1)
        // e.on('key1', fn2)
        // e.once('key1', fn3)





        function add(a, b, c) {
            return a + b + c
        }

        function curry(fn) {
            const argLength = fn.length
            let args = []

            const calc = function (...newArgs) {
                args = [...args, ...newArgs]
                if (args.length === argLength) {
                    return fn(...args)
                } else {
                    return calc
                }
            }

            return calc


        }

        const curryFn = curry(add)
        let res = curryFn(10, 20)(30) // 60
        console.log(res);

        class LazyMan {
            constructor(name) {
                this.name = name
                this.tasks = []
                setTimeout(() => {
                    this.next()
                })
            }
            next() {
                const t = this.tasks.shift()
                t && t()
            }
            eat(food) {
                const task = () => {
                    console.log(`${this.name} eat ${food}`);
                    this.next()
                }
                this.tasks.push(task)
                return this
            }
            sleep(sec) {
                const task = () => {
                    console.log(`${this.name} 开始睡觉`);
                    setTimeout(() => {
                        console.log(`${this.name} 睡觉 ${sec}秒结束`);
                        this.next()
                    }, sec * 1000)
                }
                this.tasks.push(task)
                return this
            }
        }

        const lazyMan = new LazyMan('wky')
        // lazyMan.eat('西瓜')
        // lazyMan.eat('西瓜2')
        // lazyMan.eat('西瓜3')
        // lazyMan.sleep(5)
        // lazyMan.eat('西瓜4')
        // lazyMan.sleep(2)
        // lazyMan.eat('香蕉')


        function dfsNode() {
            let node = document.querySelector('#root')
            let res = []

            const dfs = (root) => {
                if (root instanceof Comment) {
                    res.push(root.textContent)

                }
                if (root instanceof Text) {
                    root.textContent?.trim() && res.push(root.textContent?.trim())
                }
                if (root instanceof HTMLElement) {
                    res.push(root.nodeName)
                }

                if (root.childNodes && root.childNodes.length) {
                    root.childNodes.forEach(dfs)
                }
            }

            dfs(node)
            return res;
        }

        function bfsNode() {
            let node = document.querySelector('#root')
            let queue = [node]
            let res = []
            while (queue.length) {
                const root = queue.shift()
                if (root instanceof Comment) {
                    res.push(root.textContent)

                }
                if (root instanceof Text) {
                    res.push(root.textContent?.trim())
                }
                if (root instanceof HTMLElement) {
                    res.push(root.nodeName)
                }

                if (root.childNodes && root.childNodes.length) {
                    root.childNodes.forEach(n => {
                        queue.push(n)
                    })
                }
            }
            return res
        }

        // add(1)(2)(3)(4) => 10

        const tree = {
            val: 1,
            children: [{
                val: 2,
                children: [
                    {
                        val: 55
                    }
                ]
            }, {
                val: 3
            }, {
                val: 4,
                children: [
                    {
                        val: 5,
                    }, {
                        val: 6,
                        children: [
                            {
                                val: 7
                            }
                        ]
                    }
                ]
            }]
        }

        function dfs(tree) {
            let res = []

            const fn = (t) => {
                res.push(t.val)
                t.children && t.children.forEach(fn)
            }
            fn(tree)
            return res
        }

        function bfs(tree) {
            let res = []
            let queue = [tree]

            while (queue.length) {
                const q = queue.shift()
                res.push(q.val)
                q.children && q.children.forEach(item => {
                    queue.push(item)
                })
            }

            return res;
        }

        // 链表、原型链

        function myinstanceof(left, right) {
            let p = left.prototype
            while (p) {
                //   p = p.prototype
                if (p === right.prototype) return true
                p = p.__proto__
            }
            return false
        }
        // myNew

        function myNew(construtor, ...args) {
            let obj = Object.create(construtor.prototype);
            construtor.call(obj, ...args);
            return obj;
        }

        // call,apply,bind

        Function.prototype.myCall = function (con, ...args) {
            let fn = this;
            con.fn = fn;
            return con.fn(...args);
        };

        Function.prototype.myApply = function (con, arg) {
            let fn = this;
            con.fn = fn;
            return con.fn(...arg);
        };

        Function.prototype.myBind = function (con, ...args) {
            let fn = this;
            con.fn = fn;
            return function () {
                return con.fn(...args);
            };
        };

        let obj = {
            name: "wky",
        };

        function callfn(...args) {
            console.log(args);
            return this.name + "-" + args;
        }

        callfn.call(obj, 12, 13, 14);

        function Foo(name, age) {
            this.name = name;
            this.age = age;
        }

        Foo.prototype.getPerson = function () {
            return `hello,my name is ${this.name}, my age is ${this.age}`;
        };

        let f = myNew(Foo, "wky", 18);
        f.getPerson();

    </script>
</body>

</html>