Hi, I am Rakhi a student of Web Master 12 months course in ADMEC Multimedia Institute, in Delhi. I am learning JavaScript these days and I was given a project to write an article whatever I gained in my first class by Ravi Sir. So, I decided to write about JavaScript basics today. I hope my efforts will help you in learning the basics of it and you will like also.
Here I am going to Discuss Below Mention Topics:
- What is JavaScript?
- Uses of JavaScript?
- How to use JavaScript in your HTML page?
- Features of JavaScript
- Summary
What is JavaScript?
Interactive web pages or web applications are impossible withough theuse of JavaScript. It is the most popular client side programming language in the world. JavaScript was invented by Brendan Eich in 1995, and became an ECMA standard in 1997. ECMA-262 is the official name. ECMAScript 6 (released in June 2015) is the latest official version of JavaScript.
Java Script is an objective oriented programming (OOP), case sensitive, dynamic type language to be used in HTML projects. It’s file extension is “ .js ”. JavaScript is to be used in HTML specially so that we can make web pages interactive and dynamic. I was taught that JavaScript and Java are completely different languages, both in concept and design.
JavaScript can be divided in two parts for better study
- Core JavaScript – core means basics of JavaScript. Here you learn building blocks of this programming languages such as variables, functions, conditionals, loops, operators, expressions, various statements, datatypes, basic dom implementations and events etc.
- Advance JavaScript – it comes after the core so it is advanced JavaScript. It covers various top level objects, dom manipulation, events, cookies, object oriented JavaScript, projects and tests etc.
How to use JavaScript in your HTML page?
JavaScript can be attatched to your HTML page in 3 ways akin CSS:
- Inline
- Embedded
- External (always a best way)
Create a JavaScript page and save with extension .js eg myscript.js and write this line before closing the body tag.
<body> <!-- here add your html --> <script type=”text/javascript” src=”myscript.js” /> </body>
Note: Do not write embedded or inline JavaScript. Always link your external written JavaScript file like I explained above.
Use of JavaScript
JavaScript is very useful, by JavaScript we can improve our html webpages and also use of JavaScript make our websites very attractive and dynamic in nature. So, JavaScript is very important for us. In todays e-commerce world a highly interactive user interface or UI is a great demand. Consumers want everything on the screen without any delay so JavaScript is only a language which can help in acheiving this. In many websites and applications use of JavaScript can be seen easily eg. Facebook, Twitter, Google, Gmail, Flipkart, Snapdeal, Amazon etc.
Topics of JavaScript
- Popups
- alert popup
- prompt popup
- confirm popup
- Comments
- Variable
- Scopes
- local scope
- Global scope
- Function
Popups
It is additional display box / window surprisigly comes over web browser with information and notice.
There are three types of Popups :-
- alert: An alert() box be used for give a massage to user. It has provided only single botton (OK).
Example: <script type="text/javascript"> alert(“My First JS Class”); </script>
- prompt: It helps in taking the input from the user. This box has shown two buttons on display OK and CANCEL. If the user clicks the OK button, the window method prompt() will return the entered value from the text box. If the user clicks the Cancel button, the window method prompt() returns null.
Example:
<script type="text/javascript"> prompt(“Please Enter Your Name”); </script>
- confirm: It has shown a box on the display. It is a box we use to take information from the visitors’ decisions and this box has two buttons OK and CANCEL. It is helpful in making various decisions on the basis of given information.
Example:
<script type="text/javascript"> confirm(“Are You Sure?”); </script>
Comments in JavaScript
There are 2 types of comments in JavaScript useful to exclude the code from execution when program runs its course. See the following given examples.
Examples:
1. Single line comment
//alert('I m commented');When you will publish your html page then you will not get this alert as it is commented.
2. Multiline comment
/*
alert('I m commented');
alert('I am also commented');
*/It is good for multiple lines. When you will publish your html page then you will not get these alerts as they are commented.
So, use comments as much as you can instead of deleting the code which may be needful in future.
Variable
Variable is a container where we can store a value.
Syntax:
var nameOfTheVariable = value;
Naming Rules for Variables
Naming rules for variables are very important and we can use only underscore(_), dollar($), and alpha numeric characters in the name of variables and we cannot repeat reserve keywords (var, alert) in variable. Var is necessary to declare the new value. Variable should be identify with unique name.
Example :
//declaring function //
function additionFunc()
{
//local variables //
var num1 = 12;
var num2 = 15;
}Use of local scope:
Local scope is good to manage the code. Everything is not possible to put in global scope as everything starts cluttering up. Local scope is also good for better understanding along with good accessibility.
- Global Scope – Use of Global scope variable declared outside the Function. If you assign a value to a variable that has not been declared, it will automatically become a GLOBAL variable.
Example :
//global variables //
var num1 = 10;
var num2 = 15;
Use of global scope:
Global scope is good to create reusable code which offers accessibility of any variable or function everywhere inside the page. Use wisely this scope as variables and functions in this scope can be changed and manipulated from any location in the program.
Function
A function is the block of code. Function is a group of reusable code which can be used in its scope various times. It helps in also execution (code control) and better organization of the program.
The simple method to describe a function of JavaScript by using the keyword “function”. The parentheses may include parameter names separated by commas.
Syntax:
function functionName()//header of function
{
// body of the function
}Example:
<body>
<button onclick="additionFunc()">Click Me</button>
<script type="text/javascript">
//declaring function//
function additionFunc()//header
{
var num1 = 10;
var num2 = 15;
alert(num1+num2*5/2);
}
//calling function//
additionFunc();
</script>
</body>Summary
Above all topics which I told you all are only basics which I learnt today which includes in my topics’ list above such as – pop ups, variable, comments, embedding JavaScript, scopes and functions etc.
Popups are just the methods useful to display, receive, and taking decisions from the users while variables are containers helpful in storing values to be used later in your application.
Variable is a container in which you can store a value. In the name of variables you can not use spaces, number only, and various special characters except underscore (_) and dollar sign ($).
Functions are the most important unit of JavaScript which handles execution of the code and useful in making a well organized code structure. These are also helpful to create reusable code for better performance.
Functions deal with scope too so when we declare a variable or function inside a function which is local and variables and functions outside a function called global.
