Lesson Tuesday

So far, none of the JavaScript we've learned has let us do anything with a web page. Let's try something a little more interesting. Try running the following code either in the DevTools console or in JSFiddle:

> alert("Hello world!");

When we press enter, the page pops open a dialog box that says "Hello world!"

alert() is a function. A function is something that performs an action. Just like a method, a function can take an argument. The alert() function pops up a dialog box with the string that you pass in as an argument.

Here's another JavaScript function that takes a string as an argument:

> prompt("What is the air-speed velocity of an unladen swallow?");  // I'm going to type "African or European?"
"African or European?"

In JavaScript, everything after the // is a comment. When JavaScript interprets our code, it will ignore these comments. Comments are a convenient way to leave notes in your code for yourself or other programmers. Note, by the way, that the comment comes after the semicolon.

This dialog box lets you type in a response, and then that response is returned from the prompt() function. One cool thing we can do here is set a variable equal to the response, like this:

> const favoriteColor = prompt("What is your favorite color?"); // I'm going to type "green"
> favoriteColor;

Here we created a variable named favoriteColor and assigned it to hold the string inputted by the user.

Just like we could chain methods to each other, we can also chain methods to a function:

> prompt("Type something in lowercase:").toUpperCase(); // I'm going to type "cat"

Another built-in function that allows us to interact with the webpage user is the confirm() function. This too takes a string as an argument.

> confirm("Are you sure?"); // I'm going to press the OK button

Try it out for yourself in the JavaScript console. You should have seen that confirm() returns one of two values: true or false. Notice that there are no quotes around these values. That is because these are booleans, not strings. They simply represent being true or false. You saw them before when you worked with comparison operators.

And on that note, you might have noticed that alert() returned undefined, also without quotes. undefined simply represents that nothing has been returned from the function, or, as you saw earlier, that a variable hasn't been assigned a value.

It is good to be conscious of what arguments a function takes, and what data type it returns. Here is a table showing that information for the three built-in functions introduced in this lesson:

function arguments and return values table

The alert() function does not return anything useful, which is fine because we'd only use it to display some information to the user. It's a way to output information, not collect it. On the other hand, we'd want to collect the user's response to the prompt() or confirm() functions, likely by assigning the returned value to a variable as demonstrated above with const favoriteColor = prompt("What is your favorite color?");. That way we can do something with the inputted information rather than just ignoring it.


  • Function: A function is a block of code that performs an action and returns a result; optionally takes arguments

  • Comment: anything following // on a line in JavaScript is ignored by the computer. Comments are a convenient way to leave notes in your code for yourself or other programmers.


  • alert() opens a dialog box and returns undefined.

  • confirm() opens a dialog box and returns a boolean.

  • prompt() opens a dialog box and returns a string.

Return Values

function arguments and return values table

Lesson 25 of 65
Last updated May 23, 2022