Home » JavaScript » JavaScript tutorial

What is JavaScript - Complete Tutorial for beginners

What is JavaScript: JavaScript is a client-side scripting language, i.e., it executes on user's machine rather than the server hosting the website. It creates interactive webpages and adds dynamic effects to them.

JavaScript is an object-oriented language like C++ and Java. However, it is not related to the Java language in any way.

The biggest feature of JavaScript is its ability to react on user's action, like button click, scrolling and typing. It enabled designers to convert their ideas into practicality, which was not possible before.

A good designer needs to know the basics first, only then they can fully explore the capabilities of JavaScript. It is considered that JS is the most powerful language at present. So, in this tutorial, we will cover all the basics and some advanced topics.


Difference between JavaScript and Java

  • JavaScript was initially introduced as 'LiveScript' by Netscape in 1995. It was renamed as 'JavaScript' later.
  • In 1995, Netscape was competing with Microsoft. This is why, they approached Sun Microsystems, which was about to launch a new programming language JAVA. Java was a programming language that had all the features of Object-Oriented Programming.
  • Java was used for system programming and applet development. However, there was still a need for a scripting language for websites to enhance the user’s interactivity. Netscape, in collaboration with Sun Microsystems, developed LiveScript for its browser to compete with Internet Explorer of Microsoft.
  • Later on, LiveScript’s name has been changed to JavaScript because of Java’s popularity. The first browser which could support JavaScript was Netscape 2.0.

What is JavaScript engine?

JavaScript Engine is a software used to execute JavaScript. Earlier engines used to interpret the script but, the modern ones implement 'just-in-time' compilation. Following steps are performed by a JavaScript Engine:

  • It reads the script (Parsing).
  • Then, it converts or compiles the script to machine language.
  • Execution of the script by the machine.

Every browser has its engine like Chrome has V8, Firefox has SpiderMonkey, and Safari has JavaScriptCore. All engines do the same job.


Application of JavaScript

Here is a small list of some applications of JavaScript, which we have covered in this tutorial-

  • Client-side form validation.
  • Performing Event-based actions.
  • Dynamic drop-down menus.
  • Displaying date and time.
  • Displaying popup windows and dialog boxes (like an alert box, confirm box and prompt box).
  • Setting cookies in user's browser.
  • Adding, removing, or hiding elements from the webpage.

Features of JavaScript

Learning JavaScript is fun. It offers many features that a developer can use to make its website more appealing to the users. Some features are:

  • JS allows Dynamic Typing; i.e., a variable's type is not needed to be declared.
  • It is a case-sensitive language.
  • It is lightweight and platform-independent.
  • It has inbuilt functions to perform different operations.
  • It supports OOPs but does not uses class.

Limitations of JavaScript

  • In-browser JavaScript can not copy, execute, or read/write files on the hard disk. Any access to the Operating System function is also not allowed.
  • It does not support network applications, so it cannot be used with them.
  • It does not support multi-threading and does not have multiprocessor capabilities.

What JavaScript has no classes

We all know that JavaScript is an Object-Oriented Language. In OOP, objects encapsulate data and methods together, defined by a hierarchy of abstract classes. Classes are necessary for the Object Orientation Language. However, It does not have them even after being an OOP supporting language.

During development of JavaScript, Brendon Eich removed classes. He developed a new style of OOPs in which, Objects could be created and linked to other objects without having any need to define a class. Now, JavaScript has capabilities of OOP, but it is free from the complexity of classes.


Why learn JavaScript?

It is essential to learn JavaScript for aspiring designers and developers. It is the most powerful tool through which they can make very bold and attractive websites. We do not need to convince you to learn JavaScript as it is a necessity for Web Designers. We have listed some points to tell you its importance in today's world:

  • It is the most popular scripting language in the world. Almost all web programmers use it in their projects.
  • It helps in developing front-end and back-end software and applications with different frameworks like jQuery, AngularJs, ReactJs, NodeJs, and many more.
  • Its frameworks have tons of predefined libraries, which helps in the project's rapid development. It helps programmers quickly implement things, see the results, and launch the product.
  • The newer versions of JavaScript support mobile applications, game development, and desktop application development as well. As it has widens its capabilities, opportunities for developers in various fields has also been opened up.
  • The job market is filled with JavaScript related works. The demand for JavaScript Developers is high. As a result, the payouts are also good, according to someone's skills and experience. Search for it in any job portal, and you will understand the situation.
  • \

JavaScript Example - First JS program

After all this theoretical knowledge, let start this JavaScript tutorial and see the first Example. Yes, our favorite, The “Hello World” program.

Look at the <script> tag to define the type of scripting we are about to use within the document. We are using JavaScript, so the language type is also the same. The script contains only one line to print 'Hello World' on the screen.


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> JavaScript </title>
</head>
<body>
<h2>Welcome to JavaScript</h2>
<script> document.write("Hello JavaScript"); </script>
</body>
</html>

Output

JavaScript

Welcome to JavaScript


Explanation:

  • The <script> tag indicates the implementation of JavaScript code within the Webpage.
  • The text/javascript is the content type. It provides information to the browser that the script being used is 'JavaScript'.
  • The document.write() function is used to display dynamic content through JavaScript. We will learn more about the document object model later.
Tip : The type attribute for <script> tag (i.e.<script type="text/javascript">is no longer required in HTML5. JavaScript is the default scripting language for HTML5.

We hope that this introduction to JavaScript was good enough for you to continue this the tutorial. Click on next to start learning the basic concepts.