Master JavaScript

What JavaScript is, and how to run it

2 / 266
Contents

Contents

Master JavaScript

0 of 266 complete

8 min read

Running a line, and seeing a value

A REPL, a file and the box on this page, plus the one function you will use to look inside everything.

Nothing in this course has to be taken on trust. Every claim made from here on is one you can put in a box, run, and check against what you were told. That only works if seeing a value is completely routine, so this lesson makes it routine.

Start with the smallest possible program.

Try CodeJavaScript

Change the words between the quotation marks and run it again.

Three new words for what you have written. console.log is a function: a named piece of code you set going by writing its name, then round brackets. The values you put inside those brackets are its arguments. Writing the name followed by brackets is a call.

console.log takes whatever you hand it and writes it out where you can see it. This course uses it constantly, which is worth saying plainly given the last lesson: it is a host loan, not part of the language, and every host you will meet provides one.

Computing something is not the same as showing it

Try CodeJavaScript

Delete the second line and run it again. The first line still works out 5, and you never find out.

One line of output, from two lines that both worked out five. The first threw the answer away. This catches almost everybody once: a program that appears to do nothing is usually a program that did everything and told you none of it.

The second way: a REPL

A REPL is a prompt that reads one line, evaluates it, prints the result, and loops. The letters stand for read, evaluate, print, loop. The next lesson puts Node.js on your own machine; once it is there, typing node on its own and pressing return gives you a REPL.

$ node
Welcome to Node.js v24.17.0.
> 2 + 3
5
> const price = 20
undefined
> price * 2
40
> .exit
$
A short REPL session. The > is the prompt; you type what follows it.

The REPL prints the value of whatever you typed, so 2 + 3 shows 5 without any console.log. That is a convenience of the prompt, not of the language, and it goes away the moment you put the same lines in a file.

The undefined printed immediately after const price = 20 surprises people. It is not an error. Declaring const price = 20 is an instruction rather than a value, so there is no result to show, and undefined is what JavaScript uses for a value that was never supplied. The line after it, where price * 2 gives 40, proves the declaration worked.

The third way: a file

Put the lines in a file whose name ends in .js and hand the file to Node.js. Nothing is echoed here, so only what you print appears.

$ cat hello.js
const price = 20;
console.log(price * 2);

$ node hello.js
40
Two commands in a terminal, and the output of the second.

A file is how real programs are written, and it is the behaviour the boxes on this page copy: they run the whole snippet from top to bottom and show you what it printed. If you have Node.js on your machine, every snippet in this course can be pasted into a file and run there instead.

Printing more than one thing

Try CodeJavaScript

Add a fourth argument after true, separated by a comma, and count the spaces in the output.

console.log accepts any number of arguments and puts exactly one space between them. That makes labelling free, and labelling is worth doing: console.log("count", count) is far easier to read in a long output than a bare number.

Values that do not print themselves nicely

Some values are shown differently by different hosts, and a few produce nothing visible at all. Run this one and count the lines of output before reading on.

Try CodeJavaScript

Change undefined to the text "undefined", in quotation marks, and run it again. Now there are three lines you can read.

Look at the middle line. If it came out blank, the box ran your snippet inside your browser, where its console.log hands anything that is not already text to JSON.stringify first, and JSON.stringify(undefined) produces no text at all. If it printed the word undefined, the box handed your snippet to Node.js instead, whose console.log describes the value in words.

Three lines of code, two hosts, two different answers, and neither of them is broken. This is the first lesson's point arriving in the place you will meet it most often: console.log is a host loan, every host writes its own, and none of them is bound by the specification to print anything in particular.

The fix is to hand console.log text in the first place, and there are two tools for that. Both are part of the language, so both behave identically everywhere.

Try CodeJavaScript

Change [1, 2, 3] to [1, [2, 3]] and look at the brackets in the answer.

String(value) turns any single value into a piece of text, including the awkward ones, and it is what this course uses whenever the value being shown is one of those. JSON.stringify(value) turns something with parts, a list or a bundle of named values, into text that shows its shape.

Use String for a single value and JSON.stringify for a value with parts. Reach for the other one and you will meet its limits, which are worth reading once now rather than discovering later.

Why does typing let total = 5 into a REPL print undefined?

Because the REPL prints the value of what you typed, and a declaration does not produce a value. It creates the name and assigns 5 to it, and hands back nothing, which JavaScript represents as undefined. Type total on the next line and you get 5.

All lessons in Master JavaScript