JavaScript高级程序设计高级技巧

fun1();

fun2();

// 须要履行20ms的工作单位

function act(functionName) {

console.log(functionName, Date.now() - scriptBegin);

let begin = Date.now();

while(Date.now() - begin < 20);

}

function fun1() {

let fun3 = () => act("fun3");

setTimeout(fun3, 0);

act("fun1");

}

function fun2() {

act("fun2 - 1");

var fun4 = () => act("fun4");

setInterval(fun4, 20);

act("fun2 - 2");

}

这个代码的履行模型是如许的：

控制台输出：

JS高等法度榜样设计高等技能

与膳绫擎的模型分析一致。

3. 函数绑定

接着再评论辩论最后一个话题，函数撙节

7. 函数撙节throttling

撙节的目标是为了不想触发履行得太快，如：

—监听input触发搜刮
—监听resize做响应式调剂
—监听mousemove调剂地位

我们先看一下，resize/mousemove事宜1s种能触发若干次，于是写了以下驱动代码：

let begin = 0; 
let count = 0; 
window.onresize = function() { 
    count++; 
    let now = Date.now(); 
    if (!begin) { 
        begin = now; 
        return; 
    } 
    if((now - begin) % 3000 < 60) { 
        console.log(now - begin, 
           count / (now - begin) * 1000); 
    } 
};

当把窗口拉得比较快的时刻，resize事宜大年夜概是1s触发40次：

JS高等法度榜样设计高等技能

须要留意的是，并不是说你拉得越快，触发得就越快。实际情况是，拉得越快触发得越慢，因为拉动的时刻页面须要重绘，变更得越快，重绘的次数也就越多，所以导致触发得更少了。

7/9 首页上一页 5 6 7 8 9 下一页尾页

　　推荐阅读

　　JS高级程序设计高级技巧

本篇是看的《JS高等法度榜样设计》第23章《高等技能》做的读书分享。本篇按照书里的思路根据本身的懂得和经验，进行扩大延长，同时指出版里的一些问题。将会评论辩论安然的类型检测、惰性>>>详细阅读

本文标题：JavaScript高级程序设计高级技巧

地址：http://www.17bianji.com/lsqh/37134.html

1/2 1