Scribd
Upload
2 views

Module 3_JS_part1

JavaScript is a high-level programming language essential for interactive web development, enabling dynamic content and event-driven programming. It has evolved since its creation in 1995, with significant updates like ECMAScript 6 introducing modern syntax and features. JavaScript operates within web browsers for DOM manipulation, supports various programming styles, and includes features such as variables, data types, functions, and control structures.

Uploaded by

23cs3068
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
2 views

Module 3_JS_part1

JavaScript is a high-level programming language essential for interactive web development, enabling dynamic content and event-driven programming. It has evolved since its creation in 1995, with significant updates like ECMAScript 6 introducing modern syntax and features. JavaScript operates within web browsers for DOM manipulation, supports various programming styles, and includes features such as variables, data types, functions, and control structures.

Uploaded by

23cs3068
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 8

Introduction to JavaScript

1. Overview of JavaScript
JavaScript (JS) is a high-level, interpreted programming language that enables interactive web pages. It
is one of the core technologies of the World Wide Web, along with HTML and CSS. JavaScript is used for
client-side scripting, allowing dynamic content updates, form validations, and event-driven
programming.

Key Features of JavaScript

●​ Lightweight and fast execution


●​ Interpreted and does not require compilation
●​ Supports object-oriented, imperative, and functional programming styles
●​ Can be executed in any web browser without additional plugins
●​ Provides event-driven functionality (handling user interactions)

2. History and Evolution of JavaScript


●​ 1995: Brendan Eich developed JavaScript while working at Netscape.
●​ 1996: JavaScript was standardized as ECMAScript (ES1).
●​ 2009: ECMAScript 5 (ES5) introduced stricter syntax and additional methods.
●​ 2015: ECMAScript 6 (ES6) introduced modern syntax like let, const, arrow functions,
template literals, and promises.
●​ Present: Ongoing updates introduce features such as async/await, optional chaining, and
improved modules.

3. JavaScript in the Browser


JavaScript runs inside the browser as part of the Document Object Model (DOM) manipulation. Web
developers use JS to:

●​ Change HTML content dynamically


●​ Modify CSS properties
●​ Handle user events (click, hover, etc.)

Page 1
●​ Communicate with servers using AJAX and Fetch API

4. JavaScript Syntax and Structure


JavaScript code is written within <script> tags in an HTML file or in an external .js file.

Example of JavaScript in an HTML file:


<!DOCTYPE html>
<html lang="en">
<head>
<title>JavaScript Example</title>
<script>
alert("Hello, JavaScript!");
</script>
</head>
<body>
<h1>Welcome to JavaScript</h1>
</body>
</html>

Page 2
5. Variables and Data Types

Declaring Variables

Variables in JavaScript can be declared using var, let, and const.

var name = "John"; // Function-scoped


let age = 25; // Block-scoped
const pi = 3.14; // Constant value

Data Types in JavaScript

1.​ Primitive Data Types


○​ String: "Hello"
○​ Number: 100, 3.14
○​ Boolean: true, false
○​ Undefined: A declared variable without a value
○​ Null: An intentional absence of value
○​ Symbol: Unique identifier (ES6)
2.​ Reference Data Types
○​ Arrays

Page 3
○​ Objects
○​ Functions

6. Operators in JavaScript

Arithmetic Operators:
let a = 10;
let b = 5;
console.log(a + b); // Addition: 15
console.log(a - b); // Subtraction: 5
console.log(a * b); // Multiplication: 50
console.log(a / b); // Division: 2

Comparison Operators:
console.log(10 == "10"); // true (type conversion)
console.log(10 === "10"); // false (strict comparison)
console.log(10 > 5); // true

Page 4
7. Functions in JavaScript
JavaScript functions allow code reuse and modularity.

Function Declaration:
function greet(name) {
return "Hello, " + name;
}
console.log(greet("Alice"));

Page 5
Arrow Function (ES6):
const add = (x, y) => x + y;
console.log(add(4, 5));

8. Control Structures

Conditional Statements:
let num = 10;
if (num > 0) {
console.log("Positive number");
} else {
console.log("Negative number");
}

Page 6
Loops:
for (let i = 1; i <= 5; i++) {
console.log("Iteration: " + i);
}

Page 7
9. DOM Manipulation
JavaScript interacts with HTML and CSS via the Document Object Model (DOM).

document.getElementById("demo").innerHTML = "Changed Text";

Page 8

You might also like