Introduction to JavaScript

Learn what JavaScript is, where it came from, and why it’s such an important part of building websites today.

Loading...
Introduction to JavaScript

In 1995, Netscape Corporation tasked Brendan Eich to build a scripting language for their browser. In just 10 days, he created what was then called Mocha, later renamed LiveScript, and finally JavaScript. A name chosen to ride the popularity of Java at the time. However, the two languages are quite different, Java and JavaScript are as related as car and carpet, similar names, very different things.

JavaScript is a high-level, interpreted programming language primarily used in web development. Unlike HTML and CSS, which focus on structure and style, JavaScript adds logic, interactivity, and behavior to web pages.

HTML CSS JS analogy

Image source

JavaScript runs in the browser and allows you to:

  • Handle user events (like clicks or form inputs)
  • Modify HTML and CSS on the fly
  • Send and receive data from servers (using APIs)
  • Build rich web applications like calculators, games, or dashboards

Today, JavaScript is not just a browser-based language. With environments like Node.js, it can also be used to write server-side applications, command-line tools, and more.

Read more about JavaScript on Wikipedia


Key Concepts of JavaScript

Understanding the following concepts will help you see how JavaScript works under the hood and why it's so flexible and powerful.

Interpreted Language

JavaScript is an interpreted language, which means:

  • The browser reads and runs your code line by line, directly.
  • You don’t need to compile your code before running it (unlike languages like C++ or Java).
  • This makes JavaScript ideal for web development, where you want to see quick results.

For example:

You can write JavaScript directly in your HTML file:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>JavaScript Introduction - Learnify</title>
  </head>
  <body>
    <script>
      alert("Welcome to Learnify!");
    </script>
  </body>
</html>

As soon as the browser reaches this <script> tag, it reads the code and shows the alert immediately.

This also means you can inspect, test, and debug JavaScript directly in the browser’s Developer Tools. That makes things easier, right?

Dynamically Typed

JavaScript is dynamically typed, which means:

  • You don’t have to tell JavaScript what type a variable is (like string, number, etc.).
  • It figures out the type automatically at runtime, based on the value you assign.

For example:

let name = "Learnify"; // string
let views = 1000; // number
let isPublished = true; // boolean

Later, you can even change the type by assigning a different value. For example:

views = "one thousand"; // now it's a string!

While this gives you flexibility, it can also lead to bugs if you’re not careful.

Object-Oriented & Functional

JavaScript supports both object-oriented programming (OOP) and functional programming (FP). This means you can choose the style that suits your project or even mix both.

Object-Oriented Programming (OOP)

  • In OOP, you use objects and classes to group data and actions together.
  • Good for managing large apps and reusable components.

For example:

class User {
  constructor(name) {
    this.name = name;
  }
 
  greet() {
    return `Hello, ${this.name}`;
  }
}
 
const user = new User("Shefali");
console.log(user.greet()); // Hello, Shefali

Functional Programming (FP)

  • In FP, you write pure functions that take input and return output without changing anything outside.
  • Great for short, reusable, and predictable code.

For example:

function add(a, b) {
  return a + b;
}
 
console.log(add(5, 10)); // 15

JavaScript doesn’t force you to pick one style. You can use classes and objects in one part, and pure functions in another, depending on what fits best to your needs.


JavaScript Versions

JavaScript has evolved through many versions over the years. Here’s a table showing the major versions and what each one introduced:

Version Year What It Added
ECMAScript 1 (ES1) 1997 First official JavaScript version
ES2 1998 Minor technical changes to match international standards.
ES3 1999 Added regular expressions, try...catch error handling, better string tools.
ES4 Planned big update but dropped due to disagreements.
ES5 2009 Brought strict mode, forEach, map, filter, and JSON support.
ES6 (ES2015) 2015 Added let, const, arrow functions, classes, modules, promises.
ES7 (ES2016) 2016 Added ** for exponentiation, await, async keywords for asynchronous programming, and the Array.prototype.includes function.
ES8 (ES2017) 2017 Object.values, Object.entries, and Object.getOwnPropertyDescriptors functions for easy manipulation of Objects.
ES9 (ES2018) 2018 Added spread operator, rest parameters (...) for object literals, asynchronous iteration, Promise.prototype.finally, and additions to RegExp.
ES10 (ES2019) 2019 Added flat(), flatMap(), Object.fromEntries().
ES11 (ES2020) 2020 Introduced ?., ??, Promise.allSettled(), BigInt.
ES12 (ES2021) 2021 Added String.replaceAll(), Promise.any(), logical assignment, numeric separators, WeakRefs, private class methods/fields.
ES13 (ES2022) 2022 Added top-level await, .at() for arrays/strings, private class fields, error cause support.
ES14 (ES2023) 2023 Introduced toSorted, toReversed, with, findLast, and findLastIndex methods on Array.prototype and TypedArray.prototype, as well as the toSpliced method on Array.prototype.
ES15 (ES2024)current 2024 Introduced the Object.groupBy and Map.groupBy static methods, Promise.withResolvers, various set operations on Set.prototype.
Living Standard Ongoing JavaScript now keeps getting updated regularly by modern browser teams (WHATWG).

Read more about JavaScript Versions on Wikipedia


Fun Fact

Even though JavaScript was made in a hurry, it's now the most popular programming language in the world!

Source: Stack Overflow Developer Survey


Support my work!