Parsing a multidimensional JavaScript object using the .filter () method
For my CS class, I have to make a "shopping cart" site for buying airline tickets. On this website, you can choose your starting location and ending location and add the ticket to your shopping cart. Currently my available flights are determined by a multidimensional entity:
<script language="JavaScript">
var flights = [
{from: "Toronto, ON", to: "Detroit, MI", price: "250"},
{from: "Toronto, ON", to: "Los Angeles, CA", price: "300"},
{from: "Detroit, MI", to: "Toronto, ON", price: "250"},
{from: "Detroit, MI", to: "Austin, TX", price: "350"},
{from: "Detroit, MI", to: "Los Angeles, CA", price: "400"},
{from: "Austin, TX", to: "Los Angeles, CA", price: "275"},
{from: "Austin, TX", to: "Detroit, MI", price: "350"},
{from: "Los Angeles, CA", to: "Austin, TX", price: "275"},
{from: "Los Angeles, CA", to: "Detroit, MI", price: "400"},
{from: "Los Angeles, CA", to: "Toronto, ON", price: "300"},
{from: "Los Angeles, CA", to: "Sydney, AU", price: "1000"},
{from: "Sydney, AU", to: "Los Angeles, CA", price: "1000"}
];
function findFlights() {
var total = 0;
var toString = document.getElementById("to");
var fromString = document.getElementById("from");
var to = toString.value;
var from = fromString.value;
flights.filter(function (flights) {
if (flights.from === from && flights.to === to) {
var current = parseInt(flights.price);
total = total + current;
console.log(total);
console.log("From " + from);
console.log("To " + to);
document.getElementById("hi").innerHTML = "blep";
return flights;
}
// else if (flights.from === from && flights.to != to) {
// var to = to;
// var newFrom = flights.to;
// console.log(findOne(newFrom, to));
// if(flights.from === newFrom && flights.to === to) {
// console.log(from);
// console.log(newFrom);
// console.log(to);
// console.log(flights);
// }
// }
});
}
function findOne(from, to) {
var toString = to;
var fromString = from;
var to = toString.value;
var from = fromString.value;
flights.filter(function (flights) {
if (flights.from === from && flights.to === to) {
var current = parseInt(flights.price);
total = total + current;
console.log(total);
console.log("From " + from);
console.log("To " + to);
return flights;
}
});
}
</script>
Right now, a flight search for two places connected by the same thing (IE: Detroit and Toronto) works great. However, we need to be able to collect connecting flights (IE: Detroit to Sydney) and I am having trouble manipulating the data to do this because it is not an array. Any help would be appreciated, thanks!
Also, here is a copy of the relevant HTML:
<div id="contact-form">
<div>
<h1>Welcome to the Flight Reservation System!</h1>
<h4>Please fill out the form in order to reserve your flight</h4>
</div>
<p id="failure">Nope</p>
<p id="success">Your message was sent successfully. Thank you!</p>
<form action="">
<div>
<label for="dateDept">
<span class="required">Departure Date</span>
<input id="dateDept" name="dateDept" type="date" required="required" tabindex="1"
autofocus="autofocus"/>
</label>
</div>
<div>
<label for="dateArr">
<span class="required">Arrival Date</span>
<input id="dateArr" name="dateDept" type="date" required="required" tabindex="1" autofocus="autofocus"/>
</label>
</div>
<div>
<label for="from">
<span>Subject: </span>
<select id="from" name="from" tabindex="4">
<option value="Toronto, ON">Toronto</option>
<option value="Detroit, MI">Detroit</option>
<option value="Austin, TX">Austin</option>
<option value="Los Angeles, CA">LA</option>
<option value="Sydney, AU">Sydney</option>
</select>
</label>
</div>
<div>
<label for="to">
<span>Subject: </span>
<select id="to" name="to" tabindex="4">
<option value="Toronto, ON">Toronto</option>
<option value="Detroit, MI">Detroit</option>
<option value="Austin, TX">Austin</option>
<option value="Los Angeles, CA">LA</option>
<option value="Sydney, AU">Sydney</option>
</select>
</label>
</div>
<div>
<button type="submit" name="Add Flight" onClick="findFlights()">Purchase Flight</button>
<input type="button" name="Add Flight" onClick="findFlights()"></input>
</div>
</form>
</div>
EDIT Please note: my problem is not like a traveling salesman because I am not using google maps or complex algorithms: I am just using a pre-made Javascript object.
+3
source to share
1 answer
I put together an example. At the moment it will only operate with a maximum of two connecting flights. https://jsbin.com/pefoxujonu/edit?js,console
// Available flights
var flights = [
{from: "Toronto, ON", to: "Detroit, MI", price: 250},
{from: "Toronto, ON", to: "Los Angeles, CA", price: 300},
{from: "Detroit, MI", to: "Toronto, ON", price: 250},
{from: "Detroit, MI", to: "Austin, TX", price: 350},
{from: "Detroit, MI", to: "Los Angeles, CA", price: 400},
{from: "Austin, TX", to: "Los Angeles, CA", price: 275},
{from: "Austin, TX", to: "Detroit, MI", price: 350},
{from: "Los Angeles, CA", to: "Austin, TX", price: 275},
{from: "Los Angeles, CA", to: "Detroit, MI", price: 400},
{from: "Los Angeles, CA", to: "Toronto, ON", price: 300},
{from: "Los Angeles, CA", to: "Sydney, AU", price: 1000},
{from: "Sydney, AU", to: "Los Angeles, CA", price: 1000}
];
// Set origin and destination
var from = 'Austin, TX';
var to = 'Sydney, AU';
// Determine route and price
var route = findRoute(from, to);
var price = priceRoute(route);
console.log(route, price);
function findRoute(from, to, direct) {
// Prepare journey and connections
var journey = [];
var connections = [];
// Iterate through flights
flights.forEach(function (flight) {
// Check if this is a direct flight
if (flight.from === from && flight.to === to) {
journey.push(flight);
}
// Otherwise check if this is a possible connecting flight
else if (flight.from === from) {
connections.push(flight);
}
});
// Check if direct flight found
if (journey.length || direct) return journey;
// Iterate through possible connections to find connecting flight to destination
connections.forEach(function (flight) {
// Find route from connection destination to original destination
var connection = findRoute(flight.to, to, true);
// Check if connection found
if (connection.length) journey = [].concat(flight, connection);
});
return journey;
}
function priceRoute(route) {
return route.reduce(function (price, flight) {
return price + flight.price;
}, 0);
}
0
source to share