Where can I learn Javascript deeply

Structure of JavaScript commands

In the last chapter we got to know and used 2 JavaScript commands in their function. However, without a great explanation of how the structure is and what has to be considered - i.e. how best to avoid mistakes.

We used the following 2 commands:

  • alert ('Hello World');
  • document.write ('Hello World');

With the first command we get an output of the following content on the screen in a separate pop-up window and with the second output directly in the content area of ​​the browser window.

Order of processing our commands

We have the following JavaScript program

The program is processed from top to bottom. That's why we see “HalloWelt” as an output. If a program were to run from bottom to top, “WorldHello” would have to be output, which would not be particularly logical.

Although it is logical, it still has to be mentioned once.

What is fundamentally important - how is the structure of JavaScript commands?

The inconspicuous semicolon at the end of each command is extremely important. This separates the command from the following.

The fact that a separate line is now used for each JavaScript statement has more to do with clarity for the programmer than that it would somehow affect the execution.

Therefore we could write all commands on one line and we get the same result in the output.

But only if we don't accidentally forget the delimiting semicolon. In the following example we don't get any output and so we are surprised:

We do not receive an error message directly or any output. The error message "Uncaught Syntax Error: unexpected identifier" is hidden deep in the executing browser. How we get this hidden error message visible, comes in a following chapter.

Now let's move on to the basic structure.

ALWAYS include a semicolon at the end to avoid unpleasant surprises.

Structure of the JavaScript commands in front of the semicolon.

It is often clever to look at commands from right to left. In our example there is an output:

Next to our semicolon is the output text in round brackets and in quotation marks.

The quotation marks are important because this is text that we want to output. We don't yet know any variables - in the Variables chapter we see that otherwise the text would be understood as a variable.

The type of quotation marks

The type of quotation marks within the brackets is irrelevant for pure text output - the main thing is that there are quotation marks. So we can use double quotation marks (") as well as single quotation marks ('). It is only important that the same kind of quotation marks are always used. A combination of double and single quotation marks such as goes wrong!

As a result, it is very difficult to write JavaScript programs in Microsoft Word - Microsoft Word tends to use the correct quotation marks for typesetters and lower quotation marks (") and at the end the final upper quotation marks (").

So if something goes wrong here, look carefully whether and whether the correct quotation marks are used.

So far we have our text in front of the semicolon (which separates it from the following command) (enclosed in round brackets and quotation marks). Before that comes the JavaScript command, which now determines what should be done with our text.

In our examples an output should be made, regardless of whether it is above or above.

In the example we can see that there is no space between our JavaScript command and the bracket.

This is the common, space-saving variant that all programmers normally use.

If you want to confuse old hands among programmers, insert spaces.

Funnily enough, it works in the browser - but it's not really clear. So just stick to the conventions.

Missing space in the output

Anyone who has wondered why the space between our words "Hello" and "World" was missing in the output - here is the explanation:

The browser outputs exactly what we ask of it on the screen.

If we want a space between "Hello World", then we have to include this in our code: