防抖和节流的理解，及其应用场景
防抖和节流的理解，及其应用场景 01 概 念 目的： 当多次执行某一动作，进行函数调用次数的限制，节省资源 防抖： 在事件触发n秒后执行函数，如果在n秒内再次出发，重新计时 节流： 当多次执行某一动作，每隔一段时间，只执行一次函数。 区别： 函数节流不管事件触发有多频繁，都会保证在规定时间内一定会执行一次真正的事件处理函数，而函数防抖只是在最后一次事件后才触发一次函数。 比如在页面的无限加载场景下，我们需要用户在滚动页面时，每隔一段时间...
JS中的toString、Object.toString、Object.prototype.toString
Object.toString与Object.prototype.toString的区别 首先明确一下toString相同的调用方式： Object 上的toString方法可以用于对象类型的判断，如常用的区分数组与普通对象。（ ） 由此而引出疑问，为何通过Object.toString的方式不能调用原型链上的toString方法呢？ 虽然所有对象的原型链最顶端都是Object.prototype，但同时Object本身也是一个构造函数...
addEventListener() 方法
定义和用法 () 方法用于向指定元素添加事件句柄。 提示： 使用 removeEventListener() 方法来移除 addEventListener() 方法添加的事件句柄。 语法 参数值 event 必须。字符串，指定事件名。 注意: 不要使用 “on” 前缀。 例如，使用 “click” ,而不是使用 “onclick”。 function 必须。指定要事件触发时执行的函数。 当事件对象会作为第一个参数传入函数。 事件对象的类...
JS常见内存泄漏及解决方案
内存泄漏 官方解释：内存泄漏（Memory Leak）是指程序中己动态分配的堆内存由于某种原因程序未释放或无法释放，造成系统内存的浪费，导致程序运行速度减慢甚至系统崩溃等严重后果。 通俗点就是指由于疏忽或者错误造成程序未能释放已经不再使用的内存，不再用到的内存却没有及时释放，从而造成内存上的浪费。 避免内存泄漏 在局部作用域中，等函数执行完毕，变量就没有存在的必要了，垃圾回收机制很快地做出判断并且回收，但是对于全局变量，很难判断什么时候...
浅析图片懒加载(三种实现方法与两种优化方式)
写在前面 上一篇文章介绍了 ，那么今天我们就来康康图片懒加载(中间会涉及到 的优化问题) 你将了解到 的实现的三种方法(整体位置比较和视图位置比较和 ) 和优化的两种方式( 和 ) 写得不对的地方，希望大家能够批评指正！ 在不使用图片懒加载的情况下,我们打开开发者工具康康 这里 给 是为了让图片变成块元素，这样图片会自己换行，这样更方便后面进行懒加载的操作 注意勾选 ，和 ，这样效果更加明显 <img width="962" heigh...
函数柯里化
定义 维基百科中对柯里化 (Currying) 的定义为： In mathematics and computer science, currying is the technique of translating the evaluation of a function that takes multiple arguments (or a tuple of arguments) into evaluating a sequence...
如何写出一个惊艳面试官的深拷贝
导读 最近经常看到很多 手写代码的文章总结，里面提供了很多 的手写实现。 里面的题目实现大多类似，而且说实话很多代码在我看来是非常简陋的，如果我作为面试官，看到这样的代码，在我心里是不会合格的，本篇文章我拿最简单的深拷贝来讲一讲。 看本文之前先问自己三个问题： 你真的理解什么是深拷贝吗？ 在面试官眼里，什么样的深拷贝才算合格？ 什么样的深拷贝能让面试官感到惊艳？ 本文由浅入深，带你一步一步实现一个惊艳面试官的深拷贝。 本文测试代码：ht...
什么是宏任务、微任务？宏任务、微任务有哪些？又是怎么执行的？
一、那么宏任务和微任务是什么呢？ 首先，我们要先了解下 Js 。js 是一种单线程语言，简单的说就是：只有一条通道，那么在任务多的情况下，就会出现拥挤的情况，这种情况下就产生了 ‘多线程’ ，但是这种“多线程”是通过单线程模仿的，也就是假的。那么就产生了同步任务和异步任务。 ES6 规范中，microtask 称为 jobs，macrotask 称为 task 宏任务是由宿主发起的，而微任务由JavaScript自身发起。 在ES3以及...
js 实现call和apply方法
壹 ❀ 引 我在 一文中，我们提到 属于显示绑定，这三个方法都能直接修改this指向。其中call与apply比较特殊，它们在修改this的同时还会直接执行方法，而bind只是返回一个修改完this的 并未执行，那么今天我们来讲讲如果通过JavaScript模拟实现call与apply方法。 贰 ❀ 关于call与apply 贰 ✿ 壹 call与apply区别 除了都能改变this指向并执行函数，call与apply唯一区别在于参数不...