There's a tradition in programming that goes back to the 1970s. When you learn a new language, the very first program you write displays the message "Hello, world!" It's like a rite of passage. Every programmer you've ever heard of has done it.
Now it's your turn. Type this into the console and press Enter:
console.log("Hello, world!");It prints
Hello, world!
🎉 Congratulations! You're a programmer! 🎉
We're not even joking. You wrote an instruction, the computer understood it, and it did what you asked. That's programming. Everything from here on is just learning more instructions and combining them in clever ways.
What did we just write?
Let's break that line down piece by piece, because you're going to see it a lot:
console.log("Hello, world!");consoleis the console itself, the thing we want to talk to..(the dot) means "the thing on the right belongs to the thing on the left." Soconsole.logmeans "thelogability that belongs to theconsole."logis the action: write something down in the console. Like writing in a logbook.( )the parentheses hold whatever we want to give tolog. Think of them as the hands we use to pass something over."Hello, world!"is the message, wrapped in quotes so JavaScript knows it's text.;the semicolon marks the end of the instruction, like a full stop at the end of a sentence.
Put it all together and it reads: "Hey console, log this message: Hello, world!"
You'll use console.log constantly. It's how you make your program show you what's going on inside it. Professional developers with twenty years of experience still use console.log every single day.
Use console.log to print your own name. Then print your favorite food. Then print a number, like 42, without quotes around it. Then try console.log(5 + 3) and console.log("5 + 3"). What's the difference?
Did you try that last one? Here's what happens:
console.log(5 + 3);
console.log("5 + 3");It prints
8 5 + 3
Without quotes, JavaScript sees 5 + 3 as math and works it out. With quotes, it's just text, so it gets printed exactly as written. Quotes mean "don't think about this, just print it."
When things go wrong
Let's make a mistake on purpose. (Buggsy will be thrilled.) Try forgetting the quotes around your text:
console.log(Hello);It stops with an error
Uncaught ReferenceError: Hello is not defined
Red text! Scary! But actually... it's not scary at all. It's the computer being helpful. It's telling you exactly what went wrong: it saw the word Hello without quotes, assumed it was the name of something, looked for it, and couldn't find anything called Hello. So it says "Hello is not defined."
Error messages are your friends. They're like a GPS saying "recalculating." Annoying for a second, then helpful. We'll spend a whole summer learning to read them (that's Summer School).
console.log works. Console.log doesn't. Neither does console.Log or CONSOLE.LOG. To JavaScript, uppercase and lowercase letters are completely different. If you type Console.log("Hi"), you'll get ReferenceError: Console is not defined. Check your capitals!