December 30th, 2019 | 4 mins read
- It's quite easy to learn
- It applies functionalities to web pages.
- It can be used to validate data sent to server thereby reducing server validation.
- It is versatile.
- It is easy to debug (correct erros) and test. Most of the time, it provides succint error messages so you know which area to correct.
- It can be used on every browser that supports it. This creates room for same functionalities applied to various webpages in different websites.
- and so much more.
There are three methods;
- Inline method
- Internal Script
- External Script
Examing the following HTML document
event attributes like
onclick as seen above. More on event attributes in future articles but the event used above is triggered when the button is clicked.
You may have also noticed that the script tags are placed below the button in the body. This isn't compulsory but it's good practice. This ensures that the HTML contents has loaded completely before the script codes are interpreted. In most script codes, you may want to manipulate the contents in one way or the other, so you'd have to ensure that everything has loaded.
As for the script in the head tag, it is best practice to only use that method for scripts which do not have a business with the contents. This way, even if the script is loaded before the contents, everything will be interpreted successfully.
// single-line comments /* multi-line comments */
Variables are like containers used for saving values. With variables, you wouldn't have to repeat a value for several cases where you need them. To declare a variable, the
var keyword is used like so;
var ourNumber = 8
Wherever you need 8, you can use
ourNumber. Also, whenever you need to change the 8 to another number, instead of going through all the places where 8 has been used, you simply change the values of the variable.
There are other keywords which can be used as containers -
let is similar to var while
const is used for declaring variables that won't change. For example;
var name = "web" name = "website" const age = 17 age = 19
The re-assignment of another value to 'name' would not produce any eror but assigning 19 to age, will.
The major difference between
const is how they handle scoping. We'll look at that in a future article
Expressions and Statements
Think of statement as trying to do something while expressions to be you expressing yourself.
"I want to go the market" - expression
(Buying things in the market) - statement
The last line refers to an assignment expression. If you've surprised there is no
var declaration at the beginning, don't worry. We'll look at it in the next section.
This refers to an instruction which performs actions. e.g declaring variables,
The first line is a statement which declares a variable. It also uses the assignment expression to do that. It is referred to as Expression Statements
The second line is an
if statement which executes some codes when a condition is met.
Note that: the whitespaces are ignored. semi-colons (;) represent the end of a statement or expression. The whitespaces are only used for readability purposes.