JavaScript does not have any issues if you don’t use them.
// Still perfectly valid!let a = 1000a = b + cconst time = Date.
now()There are however, some situations where they are mandatory.
For example, if you declared multiple variables on one line such as: let a = 1; b = 2; c = 3;, then the ;'s are mandatory.
Semicolons are also mandatory in a for loop, like so:for (i = 0; i < .
length; i++) { // code to execute}When using a block statement however, semicolons are not to be included after the curly braces, for example:if (name == "Samantha") { // code} // <- no ';'//or,function people(name) { // code} // <- no ';'If we’re using an object however, such as:const person = { firstName: "Samantha", lastName: "Doe", age: 30, eyeColor: "blue"}; // the ';' is mandatoryThen our ;’s are required!Over time you’ll start to memorize where semicolons can and can’t be used.
Until then it’s wise to use them at the end of all statements (with the exception of block statements!)Plus it really is a common convention is to use them regardless, it’s considered good practice as its reduces the probability of errors.
Note: Once you really get going with JavaScript, start using a linter such as ESLint.
It’ll automatically find syntax errors in your code and make life much easier!IndentationIn theory we could write an entire JavaScript program on one line.
However this would be just about impossible to read and maintain.
Which is why we use lines and indentation.
Lets use a conditional statement as an example:if (loginSuccessful === 1) { // code to run if true} else { // code to run if false}Here we can see that any code inside a block is indented.
In this case its our comment code // code to run if true and then // code to run if false.
You can choose to indent your lines with either a few spaces (2 or 4 are common) or a tab.
It’s entirely your choice, the main thing is to be consistent!If we are nesting our code, we’d indent further like so:if (loginAttempts < 5){ if (loginAttempts < 3){ alert("< 3"); } else { alert("between 3 and 5"); }} else { if (loginAttempts > 10){ alert("> 10"); } else { alert("between 5 and 10"); }}By applying indentation you’ll have much cleaner, more maintainable and easier to read code!White SpaceJavaScript only requires one space between keywords, names and identifiers, otherwise any white space is completely ignored.
This means that as far as the language is concerned, there is no difference between the following statements:const visitedCities="Melbourne, "+"Montreal, "+"Marrakech";const visitedCities = "Melbourne, " + "Montreal, " + "Marrakech";I’m sure you’ll find the second line much more readable.
And another example:let x=1*y; let x = 1 * y; Again, the second line is much easier to read and debug! So feel free to space out your code in a way that makes sense! For that reason, this is also an acceptable use of white space:const cityName = "Melbourne";const cityPopulation = 5000001;const cityAirport = "MEL";CommentingA comment is un-executable code.
They’re useful for providing an explanation of some code within a program.
And also to ‘comment out’ a section of code to prevent execution — often used when testing an alternative piece of code.
There are two types of comments in JavaScript:// Comment goes here/* Comment goes here */The first syntax is a single line comment.
The comment goes to the right of the //The second a multi-line comment.
The comment goes in between the asterisks /* here */A longer multi-line comment:/* This is a comment spanningmultiple lines */IdentifiersIn JavaScript, the name of a variable, function, or property is known as an identifier.
Identifiers may consist of letters, numbers, $ and _.
No other symbols are permitted, and they cannot begin with a number.
// Valid :)NamenameNAME_nameName1$name// Invalid :(1namen@mename!Case SensitivityJavaScript is case sensitive!.An identifier named test is different from Test.
The following will throw an error:function test() { alert("This is a test!");}function show_alert() { Test(); // error!.test(); is correct}In order to ensure that our code is readable, it’s best to try to vary our names, so no identifiers are found looking too similar.
Reserved WordsThere are a number of words within JavaScript that may not be used as identifiers.
Those words are reserved by the language, as they have built-in functionality.
Such as:break, do, instanceof, typeof, case, else, new, var, catch, finally, return, void, continue, for, switch, while, debugger, function, this, with, default, if, throw, delete, in, try, class, enum, extends, super, const, export, import.
See the full list of reserved keywords.
You certainly don’t need to commit these words to memory!.If you get any strange syntax errors pointing to a variable, you can check the list and change the name.
JavaScript OperatorsArithmetical operators + – * and / are primarily used when performing calculations within JavaScript, such as:(2 + 2) * 100The assignment operator = is used to assign values to our variables:let a, b, c;a = 1;b = 2;c = 3;JavaScript ExpressionsAn expression is when we combine values, variables and operators to compute a new value (known as a evaluation).
Such as:10 * 10 // Evaluates to 100let x = 5x * 10 // Evaluates to 50const firstName = Samanthaconst lastName = RileyfirstName + " " + lastName // Evaluates to: Samantha RileyConclusionAnd there we go!.This article aimed to provide a general overview of the basic syntax and structure of JavaScript.
We’ve looked at many of the common conventions, however, remember you can be somewhat flexible — especially when working in collaborative environments with their own particular standards.
Syntax and structuring both have an important role the play for both the functionality of our programs as well as for code readability and maintainability.
I hope you found this article useful!.You can follow me on Medium.
I’m also on Twitter.
Feel free to leave any questions in the comments below.
I’ll be glad to help out!.. More details