JS Basics - Class III

Lecture 40 :- JS Basics - Class III

In "JS Basics - Class III," we'll cover additional important topics in JavaScript to further enhance your understanding of the language. We'll explore functions, object-oriented programming, asynchronous programming using callbacks, and more. Let's dive into it:

Higher-Order Functions: Higher-order functions are functions that take other functions as arguments or return functions as their results.

javascriptCopy code

// Higher-order function that takes a callback function function doMathOperation(x, y, operation) {  return operation(x, y); } // Callback functions function add(a, b) {  return a + b; } function subtract(a, b) {  return a - b; } let result1 = doMathOperation(5, 3, add); // Output: 8 let result2 = doMathOperation(5, 3, subtract); // Output: 2

Object-Oriented Programming (OOP): JavaScript supports object-oriented programming. You can create objects using object literals or constructor functions.

javascriptCopy code

// Object literal let person = {  name: "Alice",  age: 25,  greet: function () {    console.log("Hello, I'm " + this.name);  }, }; person.greet(); // Output: "Hello, I'm Alice" // Constructor function function Person(name, age) {  this.name = name;  this.age = age;  this.greet = function () {    console.log("Hello, I'm " + this.name);  }; } let person1 = new Person("Alice", 25); let person2 = new Person("Bob", 30); person1.greet(); // Output: "Hello, I'm Alice" person2.greet(); // Output: "Hello, I'm Bob"

Prototypes and Classes: JavaScript uses prototypes for inheritance. ES6 introduced classes as a more convenient way to work with prototypes.

javascriptCopy code

// Using prototype function Animal(name) {  this.name = name; } Animal.prototype.speak = function () {  console.log("I'm an animal named " + this.name); }; let animal = new Animal("Lion"); animal.speak(); // Output: "I'm an animal named Lion" // Using class class Fruit {  constructor(name) {    this.name = name;  }  speak() {    console.log("I'm a fruit named " + this.name);  } } let fruit = new Fruit("Apple"); fruit.speak(); // Output: "I'm a fruit named Apple"

Asynchronous Programming with Callbacks: JavaScript uses callbacks for asynchronous operations.

javascriptCopy code

function fetchData(callback) {  setTimeout(() => {    const data = "This is some data";    callback(data);  }, 2000); } function processData(data) {  console.log("Processed data: " + data); } fetchData(processData); // Output after 2 seconds: "Processed data: This is some data"

Promises: Promises provide a more elegant way to handle asynchronous operations and avoid callback hell.

javascriptCopy code

function fetchData() {  return new Promise((resolve, reject) => {    setTimeout(() => {      const data = "This is some data";      resolve(data);    }, 2000);  }); } fetchData()  .then((data) => {    console.log("Processed data: " + data);  })  .catch((error) => {    console.error("Error fetching data: " + error);  });

Async/Await: Async/await is a syntactical improvement over promises for handling asynchronous code.

javascriptCopy code

async function getData() {  try {    const data = await fetchData();    console.log("Processed data: " + data);  } catch (error) {    console.error("Error fetching data: " + error);  } } getData();

These are some of the more advanced JavaScript concepts that will enhance your understanding of the language and its capabilities. As you continue learning and practicing, you'll be able to build more complex applications using JavaScript.

Feel free to experiment with these concepts and apply them to real-world scenarios. If you have any specific questions or need further clarification, don't hesitate to ask! Happy coding!