Leaflet to calculate the distance between 3 points - Search in javascript array object

Question

I want to subtract the distance to the Leaflette waypoint from the total distance. How can I do that?

routes: Array(1)
0:
coordinates: (379) [D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, D, …]
inputWaypoints: (3) [i, i, i]
instructions: Array(25)
0: {type: "Head", distance: 32.9, time: 6.4, road: "85200. Sokak", direction: "NE", …}
1: {type: "Right", distance: 88.2, time: 14.8, road: "85211. Sokak", direction: "SE", …}
2: {type: "Right", distance: 1045.9, time: 154.7, road: "", direction: "SW", …}
3: {type: "EndOfRoad", distance: 300.3, time: 27, road: "", direction: "W", …}
4: {type: "SlightLeft", distance: 314.5, time: 22, road: "", direction: "NW", …}
5: {type: "Right", distance: 31.8, time: 11.1, road: "", direction: "N", …}
6: {type: "Left", distance: 158.1, time: 14.3, road: "", direction: "W", …}
7: {type: "WaypointReached", distance: 0, time: 0, road: "", direction: "N", …}
8: {type: "Head", distance: 793.8, time: 77.7, road: "", direction: "W", …}
9: {type: "EndOfRoad", distance: 91.2, time: 11.5, road: "", direction: "N", …}
10: {type: "Right", distance: 840.6, time: 77.2, road: "", direction: "E", …}
11: {type: "Right", distance: 150.9, time: 13.5, road: "", direction: "E", …}
12: {type: "Right", distance: 206.1, time: 18.4, road: "", direction: "S", …}
13: {type: "Straight", distance: 1022.5, time: 67, road: "", direction: "SW", …}
14: {type: "Continue", distance: 1320.5, time: 91.8, road: "", direction: "S", …}
15: {type: "Left", distance: 201.4, time: 16, road: "", direction: "E", …}
16: {type: "Fork", distance: 577, time: 46, road: "", direction: "NE", …}
17: {type: "Merge", distance: 10006.4, time: 400.4, road: "", direction: "E", …}
18: {type: "OffRamp", distance: 765, time: 61.2, road: "", direction: "E", …}
19: {type: "Left", distance: 1106.4, time: 51.4, road: "", direction: "W", …}
20: {type: "SlightLeft", distance: 7236.4, time: 308.6, road: "", direction: "SE", …}
21: {type: "OffRamp", distance: 105.9, time: 9.5, road: "", direction: "S", …}
22: {type: "Continue", distance: 737.9, time: 48.3, road: "", direction: "SE", …}
23: {type: "SlightLeft", distance: 1397.8, time: 125.9, road: "", direction: "SE", …}
24: {type: "DestinationReached", distance: 0, time: 0, road: "", direction: "N", …}
length: 25
__proto__: Array(0)

I can find the 7th index. "Waypoint reached"

var test = e.routes[0].instructions.filter(o => {return o.type === 'WaypointReached'});

But what I need is the sum of the distances of the indices 0,1,2,3,4,5,6.

For example:

0=> distance: 32.9
1=> distance: 88.2
2=> distance: 1045.9
3=> distance: 300.3
. . .
6=> distance: 158.1

Totaldistance= 1971,7

How can I do that? Is there an easier way?

Answer 1

The js break keyword instructs a loop to stop execution. It is useful in cases where you only want to process a set of data where a condition is met.

let distanceSum = 0;

for(let i = 0; i < e.routes[0].instructions.length; i++) {
  // Stop running the loop when the type is WaypointReached.
  if (e.routes[0].instructions[i].type === "WaypointReached") {
    break;
  }
  distanceSum += e.routes[0].instructions[i].distance;
}

console.log(distanceSum);

The above code is logically similar to the following, but is more transparent.

let distanceSum = 0;
let i = 0;
while(i < e.routes[0].instructions.length && e.routes[0].instructions[i].type !== "WaypointReached") {
  distanceSum += e.routes[0].instructions[i].distance;
  i++;
}

The break keyword is only valid inside actual loops, switches, and labels. That is, it does not have any effect inside array iteration methods such as Array.prototype.reduce.