This is part 2 of the tutorial series Learn JavaScript in Construct. This picks up from where part 1 left off. So in case you missed it, see Learn JavaScript in Construct, part 1: getting started.
We'll keep using the same project from the previous part. You can edit the code block in the On start of layout event by double-clicking it, changing the code, and then clicking outside or pressing Ctrl + Enter to finish editing. Then you can preview the project and open the browser console in developer tools to see the results. It's worth getting familiar with this process, as we'll be relying on it a fair bit. Try out the following code snippets this way to see how they work.
Sometimes the code snippets will tell you to try them out in the browser console. In this case don't enter them to your code block in Construct - preview the project, open the browser console, and try typing each line of the code snippet in there instead.
Statements
JavaScript code consists of a series of statements, separated by semicolons ;. For example this code logs two console messages, and each line is a statement:
console.log("First message!");
console.log("Second message!");
You can put two statements on the same line, as it's the semicolon that really separates statements. However conventionally there is a single statement per line.
Comments
In programming, a comment is simply something you can write in your code that the computer will ignore. In other words it's a note for the people reading the code, rather than an instruction for the computer to carry out. This is a similar idea to comments in event sheets, which are also just notes. There are two kinds of comments in JavaScript.
Single-line comments
Anywhere two forward slash characters // appear indicates a single-line comment. Everything from the forward slash characters up to the end of the line is a comment. The comment can occupy its own line or come after some code.
// This is a single-line comment!
console.log("Hello world!"); // And this!
This tutorial guide will often use these kinds of comments to annotate code, indicating what it does or what result some code will produce.
Multi-line comments
Single-line comments naturally end at the end of the line, so if you want a long comment, you need to comment every line:
// First line of comment
// Second line of comment
// Third line of comment
Multi-line comments can be an easier way to write this. Multi-line comments start with a forwards slash and asterisk /* and end with an asterisk and forward slash */.
/* First line of comment
Second line of comment
Third line of comment */
Despite the name, you can also write this kind of comment on a single line. This can be useful as you can still write code after the end of the comment.
/* comment before code */ console.log("Hello world!");
console.log(/* comment inside code */ "Hello world!");
In general, you can put comments anywhere you like and it won't affect the code. As you may have found with event sheets too, adding comments is often a good idea to help yourself or other people understand the code. Professionally written code is often heavily commented to help anyone reading it understand how it works. The best code is clear and easy to understand, not obscure and complicated.