new、this、函数防抖、函数节流

93 阅读2分钟
new详细操作步骤:
    创建一个新对象(建立新缓存)
    将构造函数的作用域赋给新对象("因此this就指向了这个新对象")
    执行构造函数中的代码(为这个新对象添加属性)
    返回新对象
    
this:
    在JavaScriptthis总是指向调用他所在的方法的对象,因为this是在函数运行时,会自动生成一个内部对象,
只能在函数中使用
    
this用法:
    全局函数对象调用:对于全局方法的调用,this指向的是全局对象window
    函数中this使用:
        全局函数中this指向的是window对象
        在new执行的函数,指向新对象
        作为对象属性,调用时,指向的是该对象
    通过call()和apply()来改变this的默认引用
    特殊函数的使用
        settimeout、setinverval
        dom模型中触发事件的回调方法执行中活动对象里的this指向该dom对象

函数防抖:
    函数防抖(debounce) ,就是指触发事件后,在n秒内函数只能执行一次,如果触发事件后在n秒内又触发了事件,
则会重新计算函数延迟执行时间
    
原因:
    开发过程中,有一些事件,常见的例如,onresize, scroll,mousemove ,mousehover等,会被频繁触发(短时间内
多次触发),不做限制的话,有可能秒之内执行几十次、几百次,如果在这些函数内部执行了其他函数,尤其是执行了
操作DOM的函数(浏览器操作DOM是很耗费性能的),那不仅会浪费计算机资源,还会降低程序运行速度,甚至造成浏览器
卡死崩溃。这种问题显然是致命的。
    
防抖使用场景

    搜索框搜索输入。只需用户最后一次输入完, 再发送请求;
    用户名、 手机号、邮箱输入验证;
    浏览器窗口大小改变后, 只需窗口调整完后,再执行resize事件中的代码,防止重复渲染

函数节流
    所谓节流,就是指连续触发事件但是在n秒中只执行一次函数 节流会稀释函数的执行频率。
    对于节流,一般有两种方式可以实现,分别是时间戳版和定时器版。
    例如:利用时间戳