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

Turning def Into function

Turning def Into function

In this lesson, you ported the crew’s describe_dock() function to JavaScript, then added the free slots to it and saw what happens to a call that wasn’t updated.

  • Where Python writes def, JavaScript writes a function declaration, one way to write a named function: the keyword function, the name in camelCase, and the parameters in parentheses, as in Python.
  • Braces mark the body, because JavaScript doesn’t read indentation, as with if and loops.
  • return hands the value back, as in Python.
  • JavaScript doesn’t require a call to pass every argument. A parameter with no argument starts out as undefined, and a template literal turns it into the text undefined. Where Python stops with a TypeError when it reaches the call, JavaScript runs and prints a wrong line.
  • A function that ends without a return gives back undefined, where Python gives None.
  • JavaScript doesn’t stop at the call the way Python does, so when you change a function’s parameters, update every call, then run the file and read the output. An undefined in a line means a value that was never passed, or a return that’s missing.
  • Python lets you give a parameter a default, and JavaScript can too. Defaults and keyword arguments come later.

Here’s the port with the free slots added, where the Elm Street call wasn’t updated:

Language: JavaScript
function describeDock(name, bikes, slots) {
  return `${name}: ${bikes} bikes, ${slots} free`;
}

console.log(describeDock("Elm Street", 0));
console.log(describeDock("Harbor Square", 14, 1));
console.log(describeDock("Station Road", 6, 8));
console.log(describeDock("Market Hall", 0, 10));
console.log(describeDock("Riverside Park", 11, 2));

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:02 Every line in the crew’s dock report is built the same way, from a dock’s name and its bikes. Work like that belongs in one function. The crew’s Python script has one, describe_dock(), and calls it for each dock.

00:18 In this lesson, you’ll write it in JavaScript, then change it the way the crew needs.

00:24 In JavaScript, def becomes the keyword function, and the name switches to camel case. Like snake case in Python, that’s a convention, not a rule: JavaScript would run a snake case name just as well.

00:37 The parameters sit in parentheses, as in Python. JavaScript doesn’t read indentation, so braces mark the body, as they do for an if or a loop.

00:49 Inside, return hands the value back, as in Python. The calls port with console.log() for print(). Run the file, and it prints the same five lines.

01:02 This is a function declaration: one way to write a named function in JavaScript.

01:10 Now the crew lead wants each dock’s free slots in its line. In both files, you add a slots parameter, put it in the line, and give the calls their free slots.

01:21 Run the Python script first. It stops with a TypeError: a call is missing slots.

01:29 The traceback points at the Elm Street call, which still passes two arguments. Python stops when it reaches that call, so nothing prints, and you know which call to fix.

01:41 Your port has the same call. Python stopped with a TypeError. What will JavaScript do when you run the port? Your turn: pause the video and predict.

01:57 It runs, with no error at all. Elm Street’s line says zero bikes, undefined free. The other four lines are right, so the wrong one sits among them, and nothing told you.

02:14 JavaScript doesn’t require a call to pass every argument. A parameter with no argument starts out as undefined, JavaScript’s value for something that’s missing.

02:25 So in the Elm Street call, slots is undefined, and the template literal turns it into the text undefined. One aside: run a function like this one, with its return line missing, and it gives back undefined, where Python’s gives None.

02:44 The fix is the call Python’s error pointed you to: give Elm Street its twelve free slots. Run both scripts again, and both print the same five lines. JavaScript doesn’t stop at a call the way Python does.

02:58 So when you change a function’s parameters, update every call, then run the file and read the output. An undefined in a line means a value that was never passed, or a return that’s missing.

03:12 Python lets you give slots a default instead, and JavaScript can too: defaults and keyword arguments come later.

03:21 So here’s the rule. Where Python writes def, JavaScript writes function, with the body in braces, and return works as in Python.

03:32 JavaScript doesn’t require every argument: a missing one is undefined, so update every call yourself.

03:40 Next up is the text lesson Writing Small Functions as Arrows. You’ll write small functions as arrows, such as the fill rate’s, with no lambda keyword, and see when to choose a declaration and when an arrow.

Become a Member to join the conversation.