Exercise: Euclidean Distance

Inside the directory you created for this course on JavaScript, create a new folder called Exercise-32-Euclidean-Distance and put the .html solution files for this exercise within it.

The exercise is pretty much clear on what it requires on our side. Let's see whether you could figure it out.

We have to create a function getDistanceCalculator() that returns back another function which could then be used to calculate the distance between two given points A and B.

The point A is remembered by this inner function from its enclosing environment, and not provided to it as an argument.

This simply means that A is provided as an argument at the time of invoking getDistanceCalculator(). Let's call this parameter a.

Uptil this point, the getDistanceCalculator() function looks as follows:

function getDistanceCalculator(a) {
   return function() {
      // distance gets calculated here
   }
}

The inner function has a accessible from its enclosing environment while the point ::\text{B}:: is provided to it as an argument. Let's call this parameter b.

The distance calculating expression goes inside this inner function and is returned from it.

Simple!

Altogether we get the following code:

function getDistanceCalculator(a) {
   return function(b) {
      return (((b[0] - a[0]) ** 2 + (b[1] - a[1]) ** 2) ** 0.5).toFixed(1);
   }
}

Let's now use this getDistanceCalculator() function to create two distance calculating functions — one that has ::\text{A}:: configured to the origin i.e. ::(0, 0)::, and one that has ::\text{A}:: configured to the point ::(5, 5):: — and then use these to calculate the desired distances as mentioned in the description section above.

function getDistanceCalculator(a) {
   return function(b) {
      return (((b[0] - a[0]) ** 2 + (b[1] - a[1]) ** 2) ** 0.5).toFixed(1);
   }
}

var distanceFromOrigin = getDistanceCalculator([0, 0]);

console.log(distanceFromOrigin([30, 5]));
console.log(distanceFromOrigin([8, 8]));
console.log(distanceFromOrigin([-5, -10]));


var distanceFrom5_5 = getDistanceCalculator([5, 5]);

console.log(distanceFrom5_5([10, 2]));
console.log(distanceFrom5_5([0, 1]));
console.log(distanceFrom5_5([-90, -1]));

In the whole discussion above, notice the naming that we've used for each function. In a real-world program real-world program, our aim should always be to come up with extremely meaningful names for functions (and even for variables) that could clearly and quickly speak about their purpose.

distFromOrigin() quickly tells us that it is meant to return the distance of a given point from the origin. distanceFrom5_5() on the otherhand hints us that we get back the distance of a given point from the point ::(5, 5)::.

Note that in this case, it was easy for us to name this function. In some cases, it might not be possible to name the function in this way. For instance, if the point is ::(1.5, -5):: we could go like distanceFrom1.5_-5() — this is completely invalid!