Chaining Example in javascript

Chaining in JavaScript refers to the practice of calling multiple methods on an object in a single line of code, where the return value of each method call is used as the input to the next method call. This can help make your code more concise and readable.

jQuery Chaining:
jQuery is a popular JavaScript library that makes it easy to manipulate the DOM and handle events. One of the key features of jQuery is chaining, which allows you to perform multiple operations on the same set of elements in a single chain. Here's an example:

$("ul li")
  .addClass("highlight")
  .find("a")
  .attr("target", "_blank")
  .end()
  .eq(2)
  .addClass("active");

In this example, we use jQuery to select all the li elements within a ul element. We then chain several methods to perform different operations on these elements, including adding a CSS class, modifying a link attribute, and selecting a specific element by index.

D3.js Chaining:
D3.js is a popular JavaScript library for data visualization. It includes a number of powerful methods for manipulating SVG graphics, and these methods can be chained together to create complex visualizations. Here's an example:

javascript
Copy code
d3.select("svg")
  .append("circle")
  .attr("cx", 50)
  .attr("cy", 50)
  .attr("r", 30)
  .style("fill", "red")
  .transition()
  .duration(1000)
  .attr("cx", 150)
  .style("fill", "blue");

In this example, we use D3.js to select an SVG element, append a circle to it, set some attributes and styles for the circle, and then create a transition to animate the circle's position and color over time.

Axios Chaining:
Axios is a popular JavaScript library for making HTTP requests. It includes a number of powerful methods for configuring and sending requests, and these methods can be chained together to create complex request pipelines. Here's an example:

javascript
axios.get("/api/data")
  .then(response => response.data)
  .then(data => processData(data))
  .catch(error => console.log(error));

In this example, we use Axios to make a GET request to an API endpoint, and then chain some methods to handle the response data. We first extract the response data from the response object, and then pass it to a processData function. If there's an error during the request or processing, we catch it and log it to the console.

Here is Calculator example

class Calculator {
  constructor(initialValue) {
    this.value = initialValue;
  }

  add(num) {
    this.value += num;
    return this;
  }

  subtract(num) {
    this.value -= num;
    return this;
  }

  multiply(num) {
    this.value *= num;
    return this;
  }

  divide(num) {
    this.value /= num;
    return this;
  }
}

const result = new Calculator(10)
  .add(5)
  .subtract(3)
  .multiply(2)
  .divide(4)
  .value;

console.log(result); // Output: 6