【Clock】2021-r126版three.js中Clock类的源码学习

【Clock】2021-r126版three.js中Clock类的源码学习

1、构造函数

看下构造器源码：

function Clock(autoStart) {
			this.autoStart = autoStart !== undefined ? autoStart : true;
			this.startTime = 0;
			this.oldTime = 0;
			this.elapsedTime = 0;
			this.running = false;
		}

有一个可选的传入值，与5个属性，看下属性列表:

属性	含义
.autoStart : Boolean	如果设置为 true，则在第一次 update 时开启时钟。默认值是 true。
.startTime : Float	存储时钟最后一次调用 start 方法的时间。
.oldTime : Float	存储时钟最后一次调用 start, getElapsedTime 或 getDelta 方法的时间。
.elapsedTime : Float	保存时钟运行的总时长。
.running : Boolean	判断时钟是否在运行。

这个储存时间的意思是储存性能指标下的now值，也就是代码从开始运行到现在的时长。

startTime 是整个时钟开始的时间，oldTime 是每调用一次“获取时长”的方法就会重置一次的，因此oldTime 储存的是上一次调用“获取时长”类方法的时间。其他的属性不多赘述。

2、方法

名称	用途
.start () : null	启动时钟。同时将 startTime 和 oldTime 设置为当前时间。 设置 elapsedTime 为 0，并且设置 running 为 true.
.stop () : null	停止时钟。同时将 oldTime 设置为当前时间。
.getElapsedTime () : Float	获取自时钟启动后的秒数，同时将 oldTime 设置为当前时间。如果 autoStart 设置为 true 且时钟并未运行，则该方法同时启动时钟。
.getDelta () : Float	获取自 oldTime 设置后到当前的秒数。 同时将 oldTime 设置为当前时间。如果 autoStart 设置为 true 且时钟并未运行，则该方法同时启动时钟。

先看下start 源码，其中now获取代码从运行开始到当前的毫秒数，performance是W3C性能小组引入的新的API，目前IE9以上的浏览器都支持，这里也加入了兼容性判断，会在不支持performance时使用Date，但performance性能更好些。

start函数会把startTime和oldTime 设置为调用该函数时代码运行到的毫秒数，也可以理解为开始的时间。elapsedTime（时钟运行的时长）重置为0，以及running（时钟是否开启）设置为true。

_proto.start = function start() {
			this.startTime = now();
			this.oldTime = this.startTime;
			this.elapsedTime = 0;
			this.running = true;
		};
function now() {
		return (typeof performance === 'undefined' ? Date : performance).now(); // see #10732
	}

接下来看下getDelta 源码，在时钟已经开始运行时（running为true，即start过了），调用getDelta会返回oldTime与当前的时间之差，单位是秒，也就是上一次调用“判断或计算时间”类方法后，到现在的时长，主要用于判断性能的，也就是上一次调用方法到这次调用中间的时间差，可用于判断一小段代码的运行时长。

此外，当时钟还没有开启时，若autoStart为true，则调用该函数与调用start无疑。以及，该函数会同步更新oldTime 与elapsedTime 。

_proto.getDelta = function getDelta() {
	var diff = 0;
	if (this.autoStart && !this.running) {
		this.start();
		return 0;
	}
	if (this.running) {
		var newTime = now();
		diff = (newTime - this.oldTime) / 1000;
		this.oldTime = newTime;
		this.elapsedTime += diff;
	}
	return diff;
};

接下来看下getElapsedTime 源码：

就是调用一下getDelta来更新下总时长，然后返回记录总时长的属性值，至于为什么要调用getDelta而不是从now开始计算，可能是为了省点代码吧。

_proto.getElapsedTime = function getElapsedTime() {
			this.getDelta();
			return this.elapsedTime;
		};

接下来看下stop的源码:

调用一下getElapsedTime更新下总时长，然后将运行状态和自动开启状态设置为true，但是并不返回任何数值，只是停下了时钟并更新了属性。

_proto.stop = function stop() {
			this.getElapsedTime();
			this.running = false;
			this.autoStart = false;
		};

3、应用

目前只发现在第一人称控制器里有用到，等写完控制器再来这里写下时钟在里面的具体用处。