JavaScript is a client side scripting language, when we linked JavaScript with HTML then it makes our web pages interactive. It’s called client side scripting language because it’s run at the client side in a browser.
We cannot create dynamic web pages without JavaScript. It adds behavior to the web pages. Most of the validations are done with the help of it. JavaScript code is written within the <script></script> tags. <Script> tag will tell the browser to interpret text written between these tags as a script.
Syntax for linking JavaScript is as follows:
<script>
JavaScript code
</script>
JavaScript is case sensitive
It means keywords, variables, function names, and any other identifiers must always be typed with a consistent capitalization of letters or as per the naming rules.
Example:-
var myvar = 2; alert(myVar);
If a variable is declared as myvar then myVar should not be used in the script as these would be two different variables and script will not run and will throw an error.
All statements in it should end with a semi colon ( ; ).
Variables in JavaScript
Variables are containers which are used to store some values in it.
Variable Declaration
Variables are processed before the code is executed. It is very important that the variable is declared in a right manner otherwise it will throw an unexpected error. Variable are declared with the var keyword as written below:
var x;
Variable Initialization
We can assign some value to the variable and it is known as variable initialization.
x = ‘Mary’;
The above written variable declaration can also be written in single line which is a more simplified way of the above example.
var x = ‘Mary’;
Declaration of Multiple Variables
We can also declare multiple variables by using var keyword only once.
Example:
var a = 30, b = 40; or var a = 30, b = 40;
Both ways are right. Always remember multiple variable declarations should be separated by commas ( , ) as written above.
Change Variable Value
After assigning a value to the variable, it can be changed as mentioned in the below example.
Example:
var a = 40; a = 50;
Rules for naming JavaScript Variables
Following are the rules which should be followed strictly while naming a variable:
- A variable name should always start with a letter.
- A variable name should not start with a number.
Example: 3mary, 123, 23admec.
- Numbers can be used within or at the end in a variable name.
Example: admecmultimedia94, ready2win.
- Variable name cannot be a combination of numbers only.
Example: 234, 100
- No logical operator should be used.
Example: 2*admec, admec+multimedia
- It should not contain any blank spaces.
Example: admec multimedia, 1 23.
- Only _ and $ can be used. They can be used at the starting, middle or at the end of the variable name. All other special characters are not allowed.
Examples: abc_xyz, abc_ , $abc
- It can have names in upper case but keep in mind that JavaScript is case sensitive.
Example: ADMEC
- It supports camel case variable names. Camel case would be a combination of two or more words. In this the first letter of first word will be lower case and for rest of the words, first letter will be in upper case.
Examples: myArr, admecMultimedia, myPriceVal
Comments in JavaScript:
If we are writing the JavaScript code in a separate file(i.e. external JavaScript ), then comments can be written as follows:-
The pattern is same as we write in CSS.
/*
Text will come here
*/
If we are writing the JavaScript code inside the html file (i.e. embedded JavaScript), then comments can be written as follows:-
// Text will come here
JavaScript Display Options
Data can be displayed in different ways in JavaScript.
1. window.alert()
This command is used to display data or any message in an alert box. It will have only one OK button. After clicking on it, it will come out from the alert box.
<!DOCTYPE html> <html> <body> <script> window.alert(“My first Program”); </script> </body> </html>
After executing the above script, following screen will appear.
document.write()
It is used to display data in a browser.
Example:
<!DOCTYPE html> <html> <body> <script> document.write(“My first Program”); </script> </body> </html>
After executing the above script, following screen will appear.
2. console.log()
It is used to test the script in the console and also it will display the error if there will be any. In the browser, press F12. Console log window will be opened. It is used for debugging.
Example:
<!DOCTYPE html> <html> <body> <script> console.log (“My first Program”); </script> </body> </html>
After executing the above script, following screen will appear.
If we write the following code and check it in console.
<!DOCTYPE html> <html> <body> <script> console.log(“My first Program”nnnnnnn); </script> </body> </html>
After executing the above script, following screen will appear in the console.
Because nnnnnn is out of the quotes “” that is why it gave an error. String always needs to be declared within quotes. Correct syntax is very important.
Write “My first Program nnnnnn” and execute it once again. Following screen will appear without any errors.
Here’s a video of Basics of JavaScript
Summary
This blog will be helpful for each and every individual who wish to learn JavaScript. Be it at beginner’s level or advance level. Base needs to be strong, be it in any course. Sometimes we might forget the basics while moving forward towards the advance level.
All the topics covered in this blog are very important from the interview point of view as well. Every interviewer starts from the basics only and if these concepts are not strong, then in spite of knowing the advance level of JavaScript will be of no use.
Practicing is the key to success. Start practicing today even it has to be from the scratch!!
