JavaScript Course Notes With Examples
JavaScript Course Notes With Examples
Introduction of JavaScript
- Description: JavaScript is a high-level, dynamic, untyped, and interpreted
programming language. It is widely used in web development to add interactivity,
control multimedia, animate images, and much more.
- Examples:
1. Displaying an alert box: alert('Hello, World!');
2. Writing to HTML document: document.write('Hello, World!');
3. Changing HTML content: document.getElementById('demo').innerHTML = 'Welcome
to JavaScript!';
- Challenges:
1. Create a simple HTML page and use JavaScript to display your name on it.
2. Use JavaScript to calculate and display the result of 7 + 3 on a web page.
2. History of JavaScript
- Description: JavaScript was created by Brendan Eich in 1995 and initially
named 'Mocha', then 'LiveScript', and finally 'JavaScript'. It has evolved
significantly over the years, becoming the standard scripting language for the Web.
- Key Events:
1. 1995: JavaScript was developed in just 10 days by Brendan Eich at Netscape.
2. 1997: JavaScript was taken to ECMA International for standardization.
3. 2009: The introduction of Node.js marked a significant milestone in
JavaScript's history.
- Challenges:
1. Research and summarize how JavaScript has changed since its inception.
2. Find an old JavaScript feature that is no longer commonly used and explain
why it was replaced or deprecated.
3. Data Types
- Description: In JavaScript, data types are the classifications of data items.
It has two types of data types: Primitive (Number, String, Boolean, Undefined,
Null, Symbol) and Reference (Objects, Arrays, Functions).
- Examples:
1. Number: let age = 30;
2. String: let name = 'John';
3. Boolean: let isAdult = true;
- Challenges:
1. Create variables for each primitive data type and display them in the
console.
2. Write a function that identifies the data type of a given variable.
6. Basic Operators
- Description: Operators are symbols that tell the JavaScript engine to perform
some sort of action. For example, arithmetic operators perform arithmetic on
numbers, and logical operators perform logical operations.
- Examples:
1. Arithmetic: let sum = 10 + 5;
2. Comparison: let isGreater = 10 > 5;
3. Logical: let result = (5 > 3) && (10 < 15);
- Challenges:
1. Use arithmetic operators to calculate the area of a rectangle.
2. Write a JavaScript expression using logical operators that checks if a
number is between 10 and 20.
7. Operator Precedence
- Description: Operator precedence determines the order in which operators are
evaluated in expressions. For example, multiplication has a higher precedence than
addition.
- Examples:
1. let result = 3 + 4 * 5; // Equals 23, not 35
2. let average = (90 + 95 + 85) / 3; // Parentheses change the order of
evaluation
- Challenges:
1. Write an expression with multiple operators and predict the outcome before
running it.
2. Experiment with parentheses to change the order of operations in a complex
expression.
9. String Methods
- Description: JavaScript provides many methods for string manipulation, such as
`length`, `toUpperCase()`, `toLowerCase()`, `indexOf()`, and `substring()`.
- Examples:
1. let text = 'Hello World'; let length = text.length; // Gets the length of
the string
2. let upperText = text.toUpperCase(); // Converts text to uppercase
3. let subText = text.substring(0, 5); // Extracts a part of the string
- Challenges:
1. Write a script to find the index of the first occurrence of a letter in a
string.
2. Create a function that takes a string and returns it with the first letter
of each word capitalized.
26. Arrays
- Description: Arrays in JavaScript are used to store multiple values in a
single variable. They are objects that represent a list of items.
- Examples:
1. let fruits = ['Apple', 'Banana', 'Cherry'];
2. console.log(fruits.length); // Outputs the number of items in the array
- Challenges:
1. Create an array and add a new item to the end of the array using an array
method.
2. Write a function that takes an array as an argument and returns the last
element.
28. Objects
- Description: Objects in JavaScript are collections of properties. Properties
are a key-value pair where the key is a string and the value can be any type.
- Examples:
1. let person = { name: 'John', age: 30, isEmployed: true };
2. console.log(person.name); // Accesses the name property
- Challenges:
1. Create an object representing a car with properties like brand, model, and
year.
2. Write a function that takes an object as an argument and prints all its
properties and values.