Javascript实现的StopWatch功能示例

本文实例讲述了Javascript实现的StopWatch功能。分享给大家供大家参考,具体如下:

有时会需要js来写一些函数进行测试,如果需要测试执行时间,可能需要一个stopwatch:

StopWatch类:

function stopWatch() {
}
stopWatch.prototype.Start = function () {
  this.startD = new Date();
  return this;
};
stopWatch.prototype.Stop = function () {
  this.startD = new Date();
  return this;
};
stopWatch.prototype.Seconds = function () {
  return Math.abs((new Date() - this.startD) / 1000);
};

用法示例(测试斐波那契数列):

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>StopWatch</title>
</head>
<body>
<script >
function stopWatch() {
}
stopWatch.prototype.Start = function () {
  this.startD = new Date();
  return this;
};
stopWatch.prototype.Stop = function () {
  this.startD = new Date();
  return this;
};
stopWatch.prototype.Seconds = function () {
  return Math.abs((new Date() - this.startD) / 1000);
};
var sw = new stopWatch().Start();
(function f(n){return n == 1 || n == 2 ? 1 : f(n-1)+f(n-2);})(45);
alert(sw.Seconds());
</script>
</body>
</html>

运行效果图如下:

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript字符与字符串操作技巧总结》、《JavaScript数学运算用法总结》、《JavaScript中json操作技巧总结》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript遍历算法与技巧总结》

希望本文所述对大家JavaScript程序设计有所帮助。

时间: 2017-06-11

js 页面执行时间计算代码

复制代码 代码如下: <script language=javascript> <!-- var startTime,endTime; var d=new Date(); startTime=d.getTime(); //--> </script> <script language=javascript>d=new Date();endTime=d.getTime ();document.write((endTime-startTime)/1000);<

获取焦点时,利用js定时器设定时间执行动作

进入正题,先说说定时器. 在javascritp中,有两个关于定时器的专用函数,分别为: 1.倒计定时器:timename=setTimeout("function();",delaytime); 2.循环定时器:timename=setInterval("function();",delaytime); 第一个参数"function()"是定时器触发时要执行的动作,可以是一个函数,也可以是几个函数,函数间用":"隔开即可.比

用js计算页面执行时间的函数

从别的站看到的一个不错的用js计算页面执行时间,比用asp要好点啊<script language=javascript>  <!--  var startTime,endTime;  var d=new Date();  startTime=d.getTime();  //-->  </script> <script language=javascript>d=new Date();endTime=d.getTime ();document.write((

JavaScript实现页面实时显示当前时间的简单实例

复制代码 代码如下: <html> <head> <title>JavaScript实现页面实时显示当前时间</title> </head> <body> <script language="javascript"> function showtime() { var today,hour,second,minute,year,month,date; var strDate ; today=new Da

计算100000数组js脚本的执行时间

计算100000数组的执行时间 var arr=new Array(100000).join(".;.").split(";"); var d=new Date(); for(var i=0;i [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

页面实时更新时间的JS实例代码

复制代码 代码如下: function startTime() {                     var today = new Date(); //定义日期对象                        var yyyy = today.getFullYear(); //通过日期对象的getFullYear()方法返回年                         var MM = today.getMonth() + 1; //通过日期对象的getMonth()方法返回年 

JS简单测试循环运行时间的方法

本文实例讲述了JS简单测试循环运行时间的方法.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UTF-8"> <title>JS 测试循环运行的时间</title> <script> var arr = []; var max = 10000000; //加载 window.addE

js获取当前时间显示在页面上并每秒刷新

方法很简单,代码也很简洁,直接奉上代码吧 复制代码 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>js获取当前时间显示在页面上</title> <script> window.onload=function(){ //定时器每秒调用一次fnDate() setInterval(f

js查看一个函数的执行时间实例代码

具体不多说了,请看下文代码实例讲解 如下有一个求和的函数,我们要知道这个函数执行需要的时间 function add(){ var sum = 0 ; for(var i = 0;i<1000000;i++){ sum += i; } return sum; } 定义一个测试函数,将待测函数作为参数传入 function test(func){ var start = new Date().getTime();//起始时间 func();//执行待测函数 var end = new Date()

用js实现计算加载页面所用的时间

客户端代码写法: 在页面Head部分加入初始时间 复制代码 代码如下: <script language=javascript> var t1 = new Date().getTime(); </script> 在Body中加入 复制代码 代码如下: <SCRIPT LANGUAGE="JavaScript"> window.onload = function() { document.getElementById("TimeShow&qu

js实现网页倒计时、网站已运行时间功能的代码3例

1.jQuery.countdown插件 显示格式:50 周 01 天 07 小时 18 分 41 秒(秒为跑秒)一个页面可以有多个倒计时实例,可以停止和开始,它没有提供太多的功能,但时间格式和输出的尺寸都可以自定义.目前最新版v2.0.2,官方地址http://hilios.github.io/jQuery.countdown/例如: 复制代码 代码如下: <div id="getting-started"></div><script src="

js执行时间查看器

效果如图所示:演示代码: test onerror = function() { location.reload(); return true; } Test.run( '内部定义' ); for( var i=0; i [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 文中所用到的runtime.js下载地址

移动端js图片查看器

本文实例为大家分享了js图片查看器插件的使用方法,制作手机使用的网页图片查看器,供大家参考,具体内容如下 这几天抽空在为项目开发一个量身的图片查看器,目前已初步完成需求. 开发场景是:在一个多文件下载展示列表中,如检测某些文件为图片时,则点击该文件时打开图片查看器展示该图片,并将列表内其它图片同时展示查看器队列内,可供前后滑动查看及其它附带功能. 乍一听功能点似乎有点多而且有些复杂,需要梳理一下 功能点整理 首先,我们要获得点击的图片文件对象及符合条件的图片文件对象集 其次,图片查看器的制作及图

js图片查看器插件用法示例

本文实例讲述了js图片查看器插件.分享给大家供大家参考,具体如下: 首先 在github上下载 js,css点击打开链接 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="../css/

基于touch.js手势库+zepto.js插件开发图片查看器(滑动、缩放、双击缩放)

最近由于公司项目需要图片查看器,网上搜了一圈,感觉资料很少,所以决定基于百度的touch.js手势库+zepto.js自己写了一个小插件,实现了左右滑动,双指缩放,双击缩放功能,基本使用还行,但是有时候还是不太顺畅,后续会慢慢完善:写的不好的地方望各位能够给出好的建议,谢谢! 源码地址:https://github.com/GLwen/molong_photoSwipe.git 演示:http://runjs.cn/detail/iceaaogh molong.css *{padding:0;m

JS网页图片查看器(兼容IE、FF)可控制图片放大缩小移动

修正了网上其它版本的一些错误.完美无错版 JS网页图片查看器-可控制图片放大缩小还原移动效果 body { font-family: "Verdana", "Arial", "Helvetica", "sans-serif"; font-size: 12px; line-height: 180%; } td { font-size: 12px; line-height: 150%; } drag = 0 move = 0 //

CSS+JS构建的图片查看器

这是一个使用 CSS + JS 构建的简易图片查看器,采用缩略图点击查看大图,可以分别显示每张图片的描述,大图显示位置采用固定宽度和高度,超出部分隐藏,点击大图可查看完全尺寸,兼容性:IE.Firefox .Opera. JS部分 function showPic (whichpic) {  if (document.getElementById) {   document.getElementById('placeholder').src = whichpic.href; if (whichp

require、backbone等重构手机图片查看器

本文是对之前的部分补充,也是对最近学习require.backbone的一次实例化的实践,希望对正在学习理解中的同学们有帮助 前文请前往:制作手机使用的网页图片查看器 新手机图片查看器 网页部分 require引入是重点,指明了主函数所在文件路径 <!doctype html> <html lang="zh-cn"> <head> <title>webapp图片查看器</title> <meta charset=&quo

jQuery实现简单的图片查看器

项目中自己diy了一个图片查看器.因为初始代码不是自己的,只是在上面改了一下也没有弄的很漂亮.等以后有时间了在重写一下样式和封装,作为备用的只是积累吧.如果有童鞋有用到,完全可以在此基础上改,比较容易,代码也比较简单 图片查看器主要有几个功能: 1.显示图片和图片信息(图片名称.发布者等等) 2.切换图片 3.关闭图片查看器 初始化接口函数pictureViewer.init: function(picInfos,tapNumber,isBig) picInfos: 传入图片组信息,必须,格式如

javascript布局查看器效果代码

body{ margin:0 auto; width:950px; font-size:12px; text-align:center; } #wholebody{ width:950px; } .newline{/*仅应用于右侧*/ clear:both; width:700px; } #top{ height:auto; } .left_square{ } .right_square{ } #topic{ height:100px; } #left{ float:left; width:25

网页中的图片查看器viewjs使用方法

需求分析: 对于网页中的图片进行连续放大(便于用户清晰查看内容).缩小,旋转等操作,可以使用viewjs图片查看器插件实现. viewjs官方网址:https://github.com/fengyuanchen/viewerjs 具体使用方法请参照官网说明. 下面做2个简单的示例: 1.示例一:单一图片 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"