JavaScript is a language that is case-sensitive

Javascript syntax errors: semicolons, apostrophes, camel case

The fact that Javascript is forgiving of many small errors is not exactly helpful. It is better to adjust to strict, strict Javascript from the start.

If a script does not work as intended, the first look at the console of the browser applies.

Today every browser offers a console with access to the DOM. It is called up differently in each browser and the error messages can be different in the various browsers. Syntax errors can be quickly tracked down in the console, but the console is also the most helpful tool when analyzing logic errors.

Large and lower case

Javascript forgives a lot of errors and is not particularly strict, but when it comes to upper and lower case, Javascript knows no mercy.

Javascript is a case-sensitive language - i.e. uppercase and lowercase letters make a difference. let val; is a different variable than let Val;.

Such errors are quickly overlooked: IF in capital letters is not recognized by the Javascript interpreter:

IF (a == b) {...}

leads to an error in the program - it should read

if (a == b) {...}

Javascript is case sensitive. Javascript is case sensitive. Javascript is case sensitive.

You can't repeat that often enough: Javascript is petty when it comes to upper and lower case.

Parentheses and single quotes

Javascript does not forgive the lack of an opening or closing bracket, nor is it the absence of an opening or closing quotation mark.

A program editor with syntax highlighting, which recognizes the key words of the programming language and highlights them in color, helps against this source of error.

Opinions are divided when it comes to the curly brackets for instruction blocks: opening bracket right or left?

block block {{……}} Will work flawlessly in many programming languages ​​in javascript

Opening curly braces always left works without any problems in many programming languages ​​and is often recommended as the standard notation.

In Javascript, a left curly bracket can lead to silent errors.

return return {{ok: true ok: false}; } // silent bug // no problem

Javascript automatically sets semicolons - and from time to time in the wrong place. And here the automatically set semicolon leads to an error.

return; {ok: false; };

The result is an empty return. The automatically set semicolon after the closing curly bracket, on the other hand, is harmless: it creates an empty statement.

Camel Case: Dashes are minus signs

The names of Javascript variables must not contain a hyphen, otherwise there will be a syntax error, because the hyphen is used in Javascript as minus interpreted. The programming conventions for Javascript therefore state: Composite variable names are saved as Camel case written.

With the Camel Case, the hyphen is omitted and the word after the hyphen begins with a capital letter: camelCase instead of camel case, headerTitle instead of header-title.

Spaces and line breaks

Javascript is pretty insensitive to empty characters and line breaks. So the code can be nicely arranged so that it is easy to read.

So this Javascript statement here is correct syntax

alert ('This is a two-line statement');

But the line break within the string creates a syntax error:

alert ('this is a two-line statement');

As a rule, a Javascript statement should be on one line, but a line break makes long statements more readable.

Always remember that Javascript uses the semicolon itself at the end of a line:

return a + b

returns undefined because the parser turns it into

return; a + b;

The semicolon

Javascript statements are ended with a semicolon. If there is a line break at the end of a statement, Javascript tries to insert the semicolon itself if the programmer has not set one.

Javascript does not need a semicolon at the end of a curly bracket.

if (a == b) {...};

A semicolon at the end of a curly bracket creates an additional empty statement. This is nothing bad in and of itself and does not result in an error message, but does use a full cycle to do nothing.

Even if the semicolon at the end of regular instructions in Javascript can be omitted: It is better to always use a semicolon.

Javascript comments

Comments in Javascript look like comments in C or C ++, Java or PHP. A single-line comment is indicated by a double slash at the beginning of the line.

// I'm a one-line comment

A comment over several lines begins with / * and ends with * /.

/ * I am a comment over several lines * /

Literals

A literal is a data value that is used literally in the program, for example the string "Hello World" or the number 42. String literals must be enclosed in single quotes and the same type of single quotation must appear at the beginning of the character string as at the end the string. Single quotation marks below and above (smart quotes), as used by text editors for German quotation marks, are not permitted.

Keyword literals like zero or true are not put in single quotes.

The character set

Few people know that Javascript programs can be written in the 16-bit Unicode character set. This is seldom an issue for the English-speaking world, but for everyone else it means that "palü" is a valid name for a variable.

Basically, that's not even that earth-shattering ... it is interesting that Javascript does not have to encode umlauts and special characters in order to put them in an HTML document.

The only requirement is that the HTML document is also written in the UTF character set. All you need to do is specify the character set per meta tag.

(HTML5)

in the HEAD element of the document and a text editor that allows an element to be saved in the UTF character set. And the cumbersome coding of umlauts and special characters can be omitted.

"use strict";

The strict mode for Javascript came with ECMAScript 5. With "use strict"; (in double quotes!) at the beginning of a script or in a function, Javascript becomes stricter and throws more exceptions. For example, Javascript requires the declaration of variables with var, let or const.

Anyone who checks their scripts with JSLint has to "use strict"; always go ahead. ... And the regular syntax check with JSLint is worthwhile. It gradually leads to automatically better Javascript. JSLint complains if the usual indentation in functions is neglected or if functions are called before they are defined: There is nothing like nicer code. Of course you don't have to follow JSLint down to the last detail!

External sources