A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

穷醒

初级黑马

  • 黑马币:

  • 帖子:

  • 精华:

每个JavaScript开发者都用过回调函数,有些人很喜欢它们,而有些人会有些讨厌它们,但你不能否认的是:只要你接触到了JavaScript代码你就不得不涉及到回调函数。
由于某种原因,有两个漂亮函数的概念并不被很多人所知,这就是分别现存于Underscore库和LoDash库,被称为debounce和throttle的两个函数。
当你在一个时间已经停止发生而你想执行一个动作时,第一个函数会特别有用。例如,一个markdown预览工具可能想在用户停止输入后要等一秒,才能真正的把文本解析到markdown。debounce能够接受一个函数并且返回一个新函数,这个新函数会根据Underscore文档中记录的从上次调用这个函数起到目前为止所耗费的时间,并将延迟它在等待毫秒级的时间后才执行。
如果你不想仅仅为了这个函数而包含整个库,你可以使用这个小技巧,使用用一个debounce的改编版本就好了。
我想谈论的第二个函数是throttle,这个函数能接受一个函数作为参数,并在返回一个新函数,这个函数“当被重复调用的时候,将实际上在每次毫秒级的等待中至多只调用原函数一次”。这点对于发生的太快的事件真的特别有用,因为使用这个函数我们就能够限制调用它的频率,比如对调整大小和滚动事件来说就是这样的。
另外,如果你必须爱那个包含这个函数库,同样也有一个throttle的改编版本。
函数使用实例
下面就让我们来看看在规则的jQuery javascript里面这些函数被用到的例子:
view sourceprint?
01.// Let's make sure we don't computate stuff too often
02.
03.// by calling the event handler at most once every 500ms
04.
05.$(window).resize(throttle(function (e) {
06.
07./* event handling code in here */
08.
09.}, 500));
总结
正如大家所见,开始使用这些函数实际上非常容易,通过使用它们你极有可能会体验到你正在开发的Web应用整体UI响应性的显著提升。这两个 函数是前端开发者很实用的工具,但是要记住:“当你有一把锤子的时候,一切看起来都像是钉子”,尽管误用它们是比较难的,但还是要明智的使用它们吧。 PHP100为您推荐与回调函数有关的优秀文章:《JavaScript回调函数应用浅析》,另外为您推荐JavaScript相关的优秀文章:《2014年12月最棒的15个JavaScript库》、《JavaScript 6 的新特性介绍》、《JavaScript开发人员的10个关键习惯》,愿这几篇文章中的知识能让你学到更实用的编程知识和技巧。

8 个回复

正序浏览

做一个比昨天更好的人,是给自己最好的礼物。
回复 使用道具 举报
加油啊,世界上最可爱的你
回复 使用道具 举报
能让人成长的绝对不是停留在舒适圈
回复 使用道具 举报
放轻松 就当漫游地球

别害怕 宇宙都温柔
回复 使用道具 举报
当你停下来休息的时候,不要忘记别人还在奔跑。
回复 使用道具 举报



我不怕千万人阻挡,只怕自己投降
回复 使用道具 举报




最可怕的是你庸庸碌碌过一生,还骗自己平淡才是真
回复 使用道具 举报



女孩的裙摆撑得起所有温柔和盛夏
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 加入黑马