JavaScript Cubes with 'History'

JavaScript test with cubes

June 6th, 2016 / placed in Study. / Tags: , , .

A little test with JavaScript. At school I was shown an little test. In this test were 3 cubes shown, once a cube is clicked it moves to the right. So basically you can click the cubes in a random sequence and the cubes move to the right as you click. But there is also a “one step back” button that removes your last click and so the cube u clicked last should move back to the left. Now I would have to figure out how this was done and try to achieve this myself.

The idea of my solution

So, with the description above I evaluated step by step what should be done and what should happen.

– First, simply creating the cubes of course and then my “one step back” button.
– Second, I would want to store my click event from every cube inside a array.
– Count up my clicks with an increment number on each click.
– Store each individual click inside the correct array from the clicked cube.
– Let the back button find out what the last click has been with a Math through the array’s of the cubes.
– Determine in which array/cube that last click has been and move that cube back.

You can view and try my working solution here, and my script here.

Update

After my post about using Object-Oriented Programming I realized that I should’ve applied it to this project. So I’m planning on re-writing this piece of code soon to reflect on the efficiency of using OOP in JavaScript. Although this isn’t some big application it’s still good practice, right? To be continued!

Terug