[JavaScript] 用电脑计算圆周率评估计算性能

最新推荐文章于 2023-05-11 07:31:15 发布

TA远方

最新推荐文章于 2023-05-11 07:31:15 发布

阅读量880

点赞数 2

分类专栏： JavaScript编程文章标签： javascript 前端 html

本文链接：https://blog.csdn.net/zs1028/article/details/127947061

版权

JavaScript编程专栏收录该内容

19 篇文章 1 订阅

订阅专栏

据说全球第一台计算机是在1946年面世的，那它的计算性能是怎样的，至今2022年，发展这么多年，现在的普通计算机性能又是怎样的呢，接下来做一个实验，评估计算性能

1. 设计

先写一个页面文件index.html，页面代码如下

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
		<title>计算圆周率 PI</title>
	</head>
	<body>
		<div id="box"></div>
		<div style="padding: 10px;">
			<input type="range" disabled id="box3" value="0" /><span id="box4"></span>
			<div id="box2" style="height: 40px;"></div>
		</div>
		<div>
			<button id="btn1">开始</button>
			<button id="btn2" disabled>停止</button>
		</div>
		<script>
			window.onload=()=>{
				//...处理的脚本
			}
		</script>
	</body>
</html>

2. 编程

再写好处理的脚本，代码如下

let isContinue = false;
const elements = {};
const Max = 100000;

['box','box2','box3','box4','btn1','btn2'].forEach(box=>elements[box]=document.getElementById(box));
elements.box.innerText = `计算 PI=${Math.PI}`;
elements.box3.setAttribute('value',0);
elements.box3.setAttribute('max',Max);
//开始按钮点击事件
elements.btn1.onclick=()=>{
	elements.btn1.setAttribute('disabled',true);
	elements.btn2.removeAttribute('disabled');
	
	let p = 0;
	let c = 0;			
	let t = Date.now();
	const calc = () => {
		//...此处省略计算圆周率的
		
		//更新显示
		let time = (Date.now()-t)/1000;
		elements.box2.innerText = `当前值：${res}\n耗时:${time.toFixed(1)}s`;
		elements.box3.setAttribute('value',c);
		elements.box4.innerText = `${c}/${Max}`;
		
		if(!isContinue) return;
		if(c<Max){
			c++
			setTimeout(calc,1);
			return;
		}
		elements.btn2.setAttribute('disabled',true);
	};
	isContinue=true;
	calc();
};
//停止按钮点击事件
elements.btn2.onclick=()=>{
	elements.btn1.removeAttribute('disabled');
	elements.btn2.setAttribute('disabled',true);
	
	isContinue=false;
};

然后，就是找计算圆周率的公式了，将如下代码写到上面注释了省略代码以下

let n = c*2;
let a = (n+2)*(n+3)*(n+4);
if (c%2==0) p += 1/a;
else p -= 1/a;

let res = 3 + 4*p;

💡 小提示
计算圆周率的公式是：PI = 3 + 4 × ( 1÷(2×3×4) - 1÷(4×5×6) + 1÷(6×7×8) … )
从中找出规律，会发现，其中c是循环次数，p是括号内累计的数，res是计算结果

3. 测试

最后，用浏览器打开页面index.html看看，点击开始按钮，细品一杯茶，等待测试结果，计算完的话，至少要等到10分钟哦
在这里插入图片描述

💡 小提示
可以用不同电脑浏览器或者手机浏览器上测试，会发现测试结果中的相同时间内计算耗时不一样，肯定是完成相同的数量100000 内耗时越短的，就是计算最快的，也是计算性能最好的

💡要注意
此方法是测试评估浏览器的网页脚本处理速度的，就相当于电脑的计算速度吧，
计算精度位数是有限的，超过精度位数是没办法计算的，只有用笨方法，类似与小学数学里简单的除法，但是这样算得慢，因此，计算超过精度位数的数是很耗时间的，圆周率是无理数，可见计算圆周率是永远没有止境的吧。

TA远方

关注

2
点赞
踩
2

收藏

觉得还不错? 一键收藏
打赏
0
评论
[JavaScript] 用电脑计算圆周率评估计算性能

据说全球第一台计算机是在1946年面世的，那它的计算性能是怎样的，至今2022年，发展这么多年，现在的普通计算机性能又是怎样的呢，接下来做一个实验，评估计算性能。
复制链接

扫一扫

专栏目录