Locked learning resources

Join us and get access to thousands of tutorials and a community of expert JavaScript developers.

Unlock This Lesson

Locked learning resources

This lesson is for members only. Join us and get access to thousands of tutorials and a community of expert JavaScript developers.

Unlock This Lesson

Pairing Up Arrays Without zip()

Pairing Up Arrays Without zip()

In this lesson, you paired the night-bus report’s timetable with the trip feed’s actual departure times, in JavaScript.

  • JavaScript has no zip(). To pair two arrays, count through the positions with a classic for loop, and read both arrays at each position with square brackets.
  • Python’s zip() stops at the end of the shorter list. A counting loop stops only where its condition says. Loop up to the longer array’s .length, and the last passes read positions that the shorter array doesn’t have.
  • Reading a position that an array doesn’t have gives undefined, JavaScript’s empty value, and no error. Python raises an IndexError there. Inside a template literal, undefined turns into the text undefined.
  • Python’s zip() stops silently, which can hide missing data in Python too. When the lists must be the same length, zip(..., strict=True) (Python 3.10 and later) raises a ValueError instead.
  • To stop where zip() stops, loop up to the smaller of the two lengths. Python’s min() is a built-in function. JavaScript has no global min(): it keeps min(), with its other math functions, on the built-in Math object, much like Python’s math module, which has no min() of its own. Writing the stop on its own line makes your choice visible to the next reader.
  • Math.min() takes the numbers as separate arguments. Hand it an array, and it doesn’t throw an error: it returns NaN, JavaScript’s “not a number” value.

The finished pairing loop:

Language: JavaScript
const scheduled = ["23:10", "23:30", "23:50"];
const actual = ["23:14", "23:30", "00:02", "00:10"];
const pairCount = Math.min(scheduled.length, actual.length);
for (let i = 0; i < pairCount; i++) {
  console.log(`${scheduled[i]} left at ${actual[i]}`);
}

Locked learning resources

Join us and get access to thousands of tutorials and a community of expert JavaScript developers.

Unlock This Lesson

Already a member? Sign-In

Locked learning resources

The full lesson is for members only. Join us and get access to thousands of tutorials and a community of expert JavaScript developers.

Unlock This Lesson

Already a member? Sign-In

00:01 In this lesson, you’ll pair up two arrays in JavaScript, which has no zip() function.

00:07 The report’s next section sets each N26 departure on the timetable next to the time the bus actually left. The Python script keeps the timetable’s last three departures before midnight in one list, and the trip feed’s departure times in another.

00:24 zip() pairs the lists, first with first and second with second. Run it, and Python prints three pairs.

00:34 In the JavaScript port, the two lists become arrays. With no zip(), you count through the positions yourself, with the classic for loop. At each position, square brackets read an item from both arrays, as in Python.

00:50 So you pick a length to count to. The two lists line up, so either should do: take the feed’s length, which every array carries with it. What does Node print?

01:01 Your turn: pause the video and predict.

01:09 Node prints four lines, and no error. The last one has no departure time from the timetable: it reads undefined left at 00:10.

01:21 The lists don’t line up at the end. The feed logs departures all night, and here it’s cut at the first bus after midnight, so its list is one longer. On the fourth pass, i is 3, but the timetable has only three departures, at positions 0 to 2.

01:39 In Python, reading a position a list doesn’t have raises an IndexError. In JavaScript, there’s no error. You get undefined, JavaScript’s empty value for “nothing here”, and the loop carries on.

01:54 The template literal turns it into text, and that’s the start of the last line.

02:00 So the loop ran four times because its condition said so, and nothing stopped it at the end of the timetable. Python’s zip() stops at the end of the shorter list for you, which is why its output had three pairs.

02:14 A counting loop stops only where its condition says.

02:19 This section of the report covers the timetable, so decide to stop where zip() stops, and write it down: loop up to the smaller of the two lengths.

02:29 In Python, min() is a built-in function. JavaScript has no standalone min() function. It keeps its math functions on a built-in object called Math, with a capital M, much like Python’s math module.

02:44 Its min() returns the smallest of the numbers you hand it. Here, the result is 3. The loop now counts up to that. Node prints the same three pairs as Python.

02:58 They give the report N26’s delays: 4, 0 and 12 minutes. The ten past midnight bus is left out, as in Python, but now it’s your choice, written on the line above the loop where the next reader can see it.

03:15 You’ve ported the report’s pairing loop. So here’s the rule: JavaScript has no zip() function, so you count through both arrays with a classic for loop.

03:25 Read past the end of an array, and you get nothing back but undefined, with no error. So choose where to stop: the smaller of the two lengths stops where zip() stops.

03:36 Write it on its own line, so the next reader sees the choice.

03:41 Next up is Looping Over Objects and Maps, a text lesson. There, you’ll port the report’s loops over Python dictionaries.

Become a Member to join the conversation.