What is JavaScript? Introduction to JavaScript

JavaScript is a programming language that is used for web development. In the Stackoverflow Developer Survey 2023, JavaScript was voted as the most used programming language by developers around the world. 65.82% of professional developers around the world use JavaScript at work.

If you want to become a web developer, then you must learn JavaScript.

JavaScript is popularly known as JS. So if mention JS anywhere, please note that we would be referring to JavaScript.

To learn JavaScript interactively, by solving simple coding exercises, you can try our JavaScript interactive course - JavaScript course for beginners.

Why do we need JavaScript?

You can do both Frontend development and Backend development using JavaScript.

Frontend: JavaScript is used for making the user interface of a webpage dynamic making it responsive to events like the movement of the mouse, mouse click on a certain HTML element, a button click, etc, using which we can improve the user experience.
Backend (or server-side app): On the backend, you can use JavaScript to write REST APIs, backend code for interacting with databases, etc. On the backend, we need NodeJS for running the JavaScript code.
Mobile application: JS frameworks like React Native, Ionic, etc. can be used for Mobile application development.
Desktop application: Again, there are some JS frameworks that enable us to create desktop applications using JavaScript code. One such JS framework is Electron.
You can learn Data structures using JavaScript and can also practice algorithms using JavaScript.
You can do Game development using JavaScript and can create browser games easily. JS frameworks like Phaser and Three.js can be used for game development.

Writing JavaScript code

There are multiple ways to write and run JavaScript code.

1. JS with HTML

You can write JavaScript code within your HTML file. You can create an HTML file with an extension .html and inside it, you can use the <script> tag to write JavaScript code.

Let's see a basic example,

<!DOCTYPE html>
<html lang="en">
<head>
    <title>My HTML Webpage</title>
    <script>
        // JavaScript code
        alert("Hello World!");
    </script>
</head>
<body>
    <!-- HTML code for webpage -->
</body>
</html>

To run the above code you can save the above code in an HTML file, let's say mywebpage.html, and then open it in any browser, you will see an alert box, created by the JavaScript code.

2. In .js File

You can also create a file with the extension .js to write JavaScript code. In a JavaScript file, you can directly write the JavaScript code, for example,

console.log("Hello World");

You can either include your JavaScript code file in your HTML code or directly run it if you have NodeJS installed.

3. Online JavaScript Compiler

You can also use our online JavaScript compiler to write JavaScript code directly in your browser.

If you want to learn JavaScript for web development, then you can use our online Web compiler for practicing HTML, CSS, and JavaScript.

JavaScript Environment setup

In order to start learning JavaScript, you will have to install a few things on your computer/laptop.

You should install VS Code editor so that you can start writing JavaScript code.
In VS code you can install the Live Server extension to run the JavaScript code easily.
You can also execute the JavaScript code within your browser's console too.
To write backend code in JavaScript you will have to install NodeJS environment. Or you can use our online NodeJS compiler to run your JavaScript code.

All browsers have a JavaScript runtime engine in them that is used to execute the JavaScript code for any webpage.

Here is how you can access the Console in Chrome's developer's tool:

Open a new tab, and enter about:blank in the URL to open a blank tab.
The right-click anywhere and select Inspect option.
You will see the Developer's tool. In the developer's tool, click on the Console tab and start writing the JS code.

JavaScript Features

Following are some of the most useful features of JavaScript:

Light Weight
Dynamically Typed
Object-Based
Functional
Platform Independent
Prototype-based
Interpreted
Asynchronous

Let's see what all these features mean:

Light Weight: JavaScript is a lightweight scripting language because it is made for data handling at the browser level only.

Dynamic Typed: JavaScript supports dynamic typing which means types of the variable are defined based on the stored value.

Object-Based Language: JavaScipt is an object-based scripting language that provides built-in objects like String, Math, Date, etc.

Functional Style: This implies that JavaScript uses a functional approach, even objects are created from the constructor functions and each constructor function represents a unique object-type.

Platform Independent: This implies that JavaScript is platform-independent or we can say it is portable; which simply means that you can simply write the script once and run it anywhere and anytime.

Prototype-based: JavaScript is a prototype-based scripting Language. This means javascript uses prototypes instead of classes. In JavaScript, each constructor function is associated with a prototype object.

Interpreted: JavaScript is an interpreted language which means the script written inside javascript is processed line by line.

Asynchronous: JavaScript performs complex processing asynchronously which means that the if some operation is taking time, JavaScript doesn't wait for it. JavaScript will let it execute and move on to other code statements to execute them.

You can check all the JS features on our detailed JavaScript features page.

JavaScript and ECMAScript

JavaScript is based on ECMAScript standards.

JavaScript, formerly known as LiveScript, was developed by Netscape and Sun Microsystems.

It is also known as ECMAScript as it was standardized by European Computer Manufacturer's Association(ECMA).

The most recent upgrades were the ECMAScript6, ES7, ES8, ES9, ES10, etc., and the most recent ECMAScript2023 which came at the beginning of this year.

You should learn about the new features added in JavaScript.

Web Development Roadmap:

If you are a beginner, we advise you to learn HTML and learn CSS first and then it will be easier for you to understand JavaScript.
In web development, HTML is the basic building block that can be used to develop basic web pages, which can have hyperlinks, images, forms, etc.
Then comes CSS which is used for styling the various HTML elements to make them look good.
CSS is a standard for providing styling to your HTML elements and these days no website is created without it.
Learn SASS/SCSS which is a new language that enables us to write dynamic styling rules just like any other programming language which can be converted to CSS code and can then be used in an HTML page.
Then comes JavaScript, which as we mentioned is a scripting language used for handling and validating client-side data, making webpages dynamic based on events, enabling features like cookies, local storage, etc, and a lot more.

To learn JavaScript interactively, by solving simple coding exercises, you can try our JavaScript interactive course - JavaScript course for beginners.

Basic JavaScript code examples

Let's some very simple code examples in JavaScript that you can immediately start running.

You can run the code examples below on our online JavaScript compiler.

1. Hello World in JavaScript

There are two ways to write a simple Hello World in JavaScript, one is on the webpage and another one is one console, let's see both of them.

The code below will show an alert box in the browser with the Hello World message.

alert("Hello World");

And if you want to print the message on the console.

console.log("Hello World");

The output for both the code will be Hello World.

2. Creating Variable in JavaScript

You can create a variable in JavaScript like this, and assign it a value.

let str = "Studytonight";
console.log(str);

Studytonight

You can also perform some mathematical operation,

let num1 = 42;
let num2 = 20;

console.log(num1 + num2);

3. If-else condition in JavaScript

You can write conditional code in JavaScript.

let num1 = 10;

if(num1 > 0) {
    console.log("It's a +ve number");
}
else {
    console.log("It's a -ve number");
}

It's a +ve number

Similarly there are many other features in JavaScript. Explore more tutorials in this tutorial series and learn more about JavaScript.

Advantages of JavaScript

JavaScript has various advantages that make it very useful as a general-purpose programming language, some are listed below:

JavaScript makes the webpage more interactive and dynamic.
By using JavaScript you can make your webpage to give immediate feedback to the user so that they would not have to reload the page.
You can use JavaScript to perform actions based on how the user interacts with your webpage using the events generated like a mouse click, form submit, button click, and a lot more.
JavaScript can save server traffic by validating the user inputs before even sending data to the server.
JavaScript can be used to store client-side cookies to store data on the client-side and then read or delete it later.
JavaScript can be used to make async HTTP calls to load data from the server.
You can use JavaScript to learn DSA.
You can also use JavaScript to code server-side applications.
JavaScript has many libraries and frameworks, using which you can easily implement many cool features without writing extra code.

Limitations of JavaScript

JavaScript has some limitations too which are listed below:

Like Java and other general-purpose programming languages, JavaScript is not capable to write multi-threading or multiprocessor code.
Core JavaScript can't be used for developing networking applications, although there are some frameworks available like NodeJS which can be used for this.
Core JavaScript or Vanilla JS has limited features, and Web developers have to depend on 3rd party libraries for many features.
JavaScript is processed in the browser, and if someone disables JavaScript in their browser, no JavaScript code will be processed. So if you are validating form values using JavaScript and if any user of your website switches JavaScript off in his/her browser, then your form validation will stop working.
JavaScript opens up a lot of doors and windows for security researchers and hackers to play around with a webpage.

Uses of JavaScript

Now we all know that JavaScript can be used for Web development, but what particular in web development, or what specifically you can create using JavaScript? Well, let's explore some use cases of JavaScript and see.

DOM Manipulation: To work with HTML elements and manage them using JS.
Form validation: You can validate form inputs using JS code.
Event Handling: User events like mouse hover, button click, form submission, etc. can be captured in JS and we can do whatever we want when such events are triggered.
Data Storage: There are cookies and Local storage to save data in the user's browser. You can use it for user tracking, analysis, etc.
API integration: You can communicate with external APIs using JS.
Real-time Updates: You can implement Web sockets, make chat systems, notification systems, etc.
Data Structures and Algorithms

Popular JavaScript libraries

There are hundreds of JavaScript libraries out there. There are so many libraries in JavaScript that developers use them very frequently for different use cases even if the same feature is available in core JavaScript too.

Core JavaScript is also called Vanilla JS. We have a video on our Youtube channel to explain what is Vanilla JS, do check it out.

ReactJS
AngularJS
NextJS
ExpressJS
jQuery
Lodash
Axios
D3.js

Now these are just a few of them, there are literally thousands of JS libraries out there.

FAQs

Here are some frequently asked questions related to JavaScript.

Q. Why is JavaScript used?

If you create a webpage using HTML and CSS, the webpage will be mostly static. Using JavaScript you can make your webpage dynamic and functional. You can communicate with external APIs to get data and show it on your homepage. You can create forms to take user input and save the data into the database. You can even play around with HTML elements like changing the background color, size, or anything else, at runtime.

Q. How to write JavaScript code?

You can write JavaScript code in your HTML file using the <script> tag like this,

<html lang="en">
<head>
    <script>
        // JavaScript code
        alert("Hello World!");
    </script>
</head>
<body>
    <!-- HTML code for webpage -->
</body>
</html>

Or you can create a separate file with extension .js and include that file in the HTML code like this,

<html lang="en">
<head>
    <script src="myJSFile.js"></script>
</head>
<body>
    <!-- HTML code for webpage -->
</body>
</html>

Q. What is JS?

JS is the short form for JavaScript. JavaScript or JS is a general-purpose programming language that can be used for web development and server-side development. Popularly JavaScript is referred to as JS.

C TUTORIAL

C PROGRAMS

INTERVIEW TESTS

EXECUTE CODE

C++ TUTORIAL

C++ PROGRAMS

INTERVIEW TESTS

EXECUTE CODE

PYTHON TUTORIAL

PYTHON HOW TOS

INTERVIEW TESTS

EXECUTE CODE

JAVA TUTORIAL

JAVA CODE EXAMPLES

SPRING TUTORIAL

MORE IN JAVA

COMPUTER ARCHITECTURE

COMPUTER NETWORK

OPERATING SYSTEM

DBMS & SQL

PL/SQL

MongoDB

EXECUTE SQL

ANDROID DEVELOPMENT

GO LANGUAGE

LINUX

DOCKER

HTML TAGS (A to Z)

CSS REFERENCES

SASS/SCSS

KOTLIN

GAME DEVELOPMENT

PHP

GIT GUIDE

JAVASCRIPT

ADVANCED DSA

What is JavaScript? Introduction to JavaScript

Why do we need JavaScript?

Writing JavaScript code

1. JS with HTML

2. In .js File

3. Online JavaScript Compiler

JavaScript Environment setup

JavaScript Features

JavaScript and ECMAScript

Web Development Roadmap:

Basic JavaScript code examples

1. Hello World in JavaScript

2. Creating Variable in JavaScript

3. If-else condition in JavaScript

Advantages of JavaScript

Limitations of JavaScript

Uses of JavaScript

Popular JavaScript libraries

FAQs