Introduction to JavaScript Programming

Analogy categoryAnalogies

1. Introduction

JavaScript is a high-level, interpreted programming language that runs in web browsers and, since the creation of Node.js, on servers and other environments too. It was originally designed to make static HTML pages interactive by responding to user actions such as clicks, form submissions, and keystrokes.

🏏

Cricket analogy: JavaScript is like the twelfth man who wasn't part of cricket's original XI but earned a permanent spot — originally brought in just to make static HTML pages react to clicks and keystrokes, it's now a starting player across browsers and servers alike.

Today JavaScript is one of the three foundational technologies of the web, alongside HTML (structure) and CSS (presentation). It is also a general-purpose language used to build backend servers, mobile apps, desktop apps, and command-line tools, which makes it one of the most widely used programming languages in the world.

🏏

Cricket analogy: Just as a cricket match needs the pitch, its structure, the kit and jerseys, its presentation, and the players' skill, its behavior, the web needs HTML, CSS, and JavaScript — and JavaScript, like a genuinely versatile all-rounder, also plays in backend, mobile, and desktop formats beyond the browser.

2. Syntax

javascript

// A single-line comment
let name = "World"; // declare a variable
console.log("Hello, " + name + "!"); // print to the console

function greet(person) {
  return `Hi, ${person}!`; // template literal
}

console.log(greet("Ada"));

3. Explanation

JavaScript code is executed by a JavaScript engine (such as V8 in Chrome and Node.js, or SpiderMonkey in Firefox). Statements are usually separated by semicolons, variables are declared with let, const, or var, and functions are first-class values that can be stored, passed around, and returned like any other data.

🏏

Cricket analogy: A match is run by the umpiring team, the engine, like V8, with overs cleanly separated ball by ball, semicolons, players registered under contracts, let/const/var, and even bowling strategies can be traded between overs like first-class values, since JavaScript treats functions the same way.

JavaScript is dynamically typed, meaning you do not declare a variable's type up front; the type is determined at runtime based on the value assigned. It is also single-threaded with an event loop, which lets it handle asynchronous operations like network requests without blocking the rest of the program.

🏏

Cricket analogy: A batter doesn't declare in advance whether they'll play a defensive shot or a six — the shot's type is determined only at the moment the ball arrives, like JavaScript's dynamic typing; and a single umpire, single-threaded, still manages multiple ongoing DRS reviews without stopping play, like the event loop.

Despite the name, JavaScript has almost nothing to do with Java. The name was a marketing decision made in 1995 to ride the popularity of Java at the time; the two languages have unrelated syntax philosophies, type systems, and runtime models.

4. Example

javascript

function calculateArea(radius) {
  const pi = 3.14159;
  return pi * radius * radius;
}

const radius = 5;
const area = calculateArea(radius);

console.log(`Radius: ${radius}`);
console.log(`Area: ${area}`);

5. Output

text

Radius: 5
Area: 78.53975

6. Key Takeaways

JavaScript is a dynamically typed, interpreted language originally built to add interactivity to web pages.
It runs both in browsers (client-side) and on servers via Node.js (server-side).
Despite the similar name, JavaScript is unrelated to Java as a language.
JavaScript engines like V8 compile and execute JavaScript code at runtime.
Functions in JavaScript are first-class citizens that can be assigned, passed, and returned.
Console output via console.log() is the most common way to inspect values while learning.

Practice what you learned

1. What is the primary original purpose of JavaScript?

2. Which statement about JavaScript and Java is TRUE?

3. Where can JavaScript code execute today?

4. What does it mean that JavaScript is 'dynamically typed'?

5. Which tool actually executes JavaScript code?

6. console.log(`Hi, ${"Ada"}!`) uses which JavaScript feature?

Was this page helpful?

History and Evolution of JavaScript

Related Study Notes in Programming

Browse all study notes

Programming

Apache Spark Study Notes

Programming · 30 topics

Programming

Apache Flink Study Notes

Programming · 30 topics

Programming

Hadoop Study Notes

Programming · 30 topics

Programming

Snowflake Study Notes

Programming · 30 topics

Programming

Apache Airflow Study Notes

Programming · 30 topics

Programming

dbt (Data Build Tool) Study Notes

Programming · 30 topics

Topics covered

#JavaScript#JavaScriptProgrammingStudyNotes#Programming#IntroductionToJavaScriptProgramming#Syntax#Explanation#Example#Output#StudyNotes#SkillVeris

1. Introduction

2. Syntax

3. Explanation

4. Example

5. Output

6. Key Takeaways

Practice what you learned

You May Also Like

Related Reading

Related Study Notes in Programming

Topics covered