ECMA6 OOP With Classes, Extend a New Feature
by sphere360 in Circuits > Software
481 Views, 1 Favorites, 0 Comments
ECMA6 OOP With Classes, Extend a New Feature
![benchm.png](/proxy/?url=https://content.instructables.com/F5R/3QWN/IWQV6F79/F5R3QWNIWQV6F79.png&filename=benchm.png)
The next instructable is building on the last 2 and it's still the same app for which we add a new feature.
We will measure the time in H:M:S:MS, how long it takes till the calculation is finished.
![diaedit.png](/proxy/?url=https://content.instructables.com/FG6/W6SL/IWQV6F7K/FG6W6SLIWQV6F7K.png&filename=diaedit.png)
Here is the edited diagram with the new module "MeasureTime".
So the huge benefit of OOP is you can extend easily the desired feature.
New Directory, File
![dirs.png](/proxy/?url=https://content.instructables.com/F2N/QYK6/IWQV6EOI/F2NQYK6IWQV6EOI.png&filename=dirs.png)
We create a new directory and file (bench/measuretime.js) in the projectfolder.
Content of the MeasureTime.js
![timer.png](/proxy/?url=https://content.instructables.com/F3Q/S6HP/IWQV6DN0/F3QS6HPIWQV6DN0.png&filename=timer.png)
The measureTime.js is a minimalistic stopwatch that counts from 0 milliseconds, when it's started. It's synchronized with new Date().getTime() (Systemtime), so that the accuracy is by 1/1000sec.
Then it gets converted (modulo - remainder) returned as H,M,S,MS, when the watch is stopped.
ImportScripts
![bench.png](/proxy/?url=https://content.instructables.com/FL0/JHTM/IWQV6E5Q/FL0JHTMIWQV6E5Q.png&filename=bench.png)
The odd thing is, the worker has its own module loader (importScripts) and for the generic JS there is still no native module loader support. (using require.js)
postMessage has now 2 parameters summarized in an array.
By importing you can use the stoptimer with startBench and stopBench like showed in the pic.
Controller File
![cont.png](/proxy/?url=https://content.instructables.com/FD3/TJB7/IWQV6XP7/FD3TJB7IWQV6XP7.png&filename=cont.png)
We assign to the elapsed.innerHTML the returned time from the worker.
Testing
![test.png](/proxy/?url=https://content.instructables.com/F0D/MD1W/IWQV6YBM/F0DMD1WIWQV6YBM.png&filename=test.png)
When we test the app, the elapsed time should appear.
The updated app is as zip available, happy coding/testing.