深浅拷贝，节流防抖

目录

1.定义

深拷贝

浅拷贝

节流

防抖

2.代码案例

---

1.定义

1. 深拷贝：基本数据类型和所指向的对象都会进行复制,内部实际指向的不是一个对象,所以在做修改时两者不会同时改变         

2. 浅拷贝：浅拷贝只会拷贝基本数据类型的值和实际的引用地址,实际指向还是同一个对象,对基本类型数据修改,原对象也会紧接着修改

3. 节流：节流就是指连续触发事件但是在 n 秒中只执行一次函数。节流会稀释函数的执行频率

4. 防抖：防抖就是指触发事件后在 n 秒内函数只能执行一次，如果在 n 秒内又触发了事件，则会重新计算函数执行时间。

2.代码案例

      //111111. <!-- 深拷贝 -->
    function deepClone(newO,old){
        for (const key in old) {
            if (Object.hasOwnProperty.call(old, key)) {
                const element = old[key];
                if(element instanceof Array){
                    newO[key] = []
                    deepClone(newO[key],element)
                }else if(element instanceof Object){
                    newO[key] = {}
                    deepClone(newO[key],element)
                }else{
                    newO[key] = element
                }
            }
        }
    }
    

    // 2.。。
    JSON.parse(JSON.stringify())


    // 浅拷贝
    // 扩展运算
    // let obj = {gae:12}
    // let obj1 = {...obj1,...obj}
    // 对象合并的方法
    // Object.assign()


    // 节流
    let btn = document.querySelector('button')
    let div = document.querySelector('div')
          throttle(2000)   //节流
      //  Anti_shake(2000) //防抖

    // 节流
    function throttle(time){
        let flag = true
        btn.addEventListener('click',function(){
           if(flag){
            flag = false
            setTimeout(()=>{
                div.innerHTML++
                flag = true
            },time)
        }
    })
    }
    // 防抖
      function  Anti_shake(time){
        let trem = null
         btn.addEventListener('click',function(){
            trem && clearTimeout(trem)
             trem = setTimeout(()=>{
                 div.innerHTML++
             },time)
     })
     }