<!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 functionif (typeof this.component[key] !== 'function') {continue;}// Add the methodvar 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>