javascript装饰者模式应用方法性能分析器_编程设计

<!DOCTYPE html> 
<html> 
<head> 
    <title>方法性能分析器</title> 
    <meta charset="utf-8"> 
</head> 
<body> 
<div id="list-container"></div> 
  
<script> 
    function $(id){ 
        return document.getElementById(id); 
    } 
</script> 
<script> 
    // ListBuilder class. 
    var ListBuilder = function (parent, listLength) { 
        this.parent = $(parent); 
        this.listLength = listLength; 
    }; 
    ListBuilder.prototype = { 
        buildList: function (container) { 
            var list = document.createElement('ul'); 
            list.setAttribute('id', container); 
            this.parent.appendChild(list); 
            var len = this.listLength; 
  
            while (len) { 
                var item = document.createElement('li'); 
                list.appendChild(item); 
                --len; 
            } 
        }, 
        removeLists: function(id){ 
            var ele = $(id); 
            ele.parentNode.removeChild(ele); 
        } 
    }; 
  
    // SimpleProfiler class. 
    var SimpleProfiler = function (component) { 
        this.component = component; 
    }; 
    SimpleProfiler.prototype = { 
        buildList: function () { 
            var startTime = (new Date()).getTime(); 
            this.component.buildList(); 
            var elapsedTime = (new Date()).getTime() - startTime; 
            console.log('buildList:' + elapsedTime + ' ms'); 
        } 
    }; 
/* 
    var list = new ListBuilder('list-container', 5000); 
    list = new SimpleProfiler(list); 
    list.buildList(); 
*/ 
    // 通用化改造 
    // MethodProfiler class. 
    var MethodProfiler = function (component) { 
        this.component = component; 
        this.timers = {}; 
  
        for (var key in this.component) { 
            // Ensure that the property is a function 
            if (typeof this.component[key] !== 'function') { 
                continue; 
            } 
  
            // Add the method 
            var that = this; 
            (function (methodName) { 
                that[methodName] = function () { 
                    that.startTimer(methodName); 
                    var returnValue = that.component[methodName].apply(that.component, arguments); 
                    that.displayTime(methodName, that.getElapsedTime(methodName)); 
                    return returnValue; 
                }; 
            })(key); 
        } 
    }; 
    MethodProfiler.prototype = { 
        startTimer: function (methodName) { 
            this.timers[methodName] = (new Date()).getTime(); 
        }, 
        getElapsedTime: function (methodName) { 
            return (new Date()).getTime() - this.timers[methodName]; 
        }, 
        displayTime: function (methodName, time) { 
            console.log(methodName + ': ' + time + ' ms'); 
        } 
    }; 
  
    var list = new ListBuilder('list-container', 5000); 
    list = new MethodProfiler(list); 
    list.buildList('ol'); 
    list.buildList('ul'); 
    list.removeLists('ul'); 
    list.removeLists('ol'); 
</script> 
</body> 
</html>
本文参考链接：https://www.cnblogs.com/webFrontDev/archive/2013/03/24/2978517.html