context to use call and apply in Javascript?

javascript

Solution

You use `call` or `apply` when you want to pass a different `this` value to the function. In essence, this means that you want to execute a function as if it were a method of a particular object. The only difference between the two is that `call` expects parameters separated by commas, while `apply` expects parameters in an array.

An example from Mozilla's `apply` page, where constructors are chained:

function Product(name, price) {
    this.name = name;
    this.price = price;

    if (price < 0)
        throw RangeError('Cannot create product "' + name + '" with a negative price');
    return this;
}

function Food(name, price) {
    Product.apply(this, arguments);
    this.category = 'food';
}
Food.prototype = new Product();

function Toy(name, price) {
    Product.apply(this, arguments);
    this.category = 'toy';
}
Toy.prototype = new Product();

var cheese = new Food('feta', 5);
var fun = new Toy('robot', 40);

What `Product.apply(this, arguments)` does is the following: The `Product` constructor is applied as a function within each of the `Food` and `Toy` constructors, and each of these object instances are being passed as `this`. Thus, each of `Food` and `Toy` now have `this.name` and `this.category` properties.

Problem

Guys can any one explain context to use `call` and `apply` methods in Javascript? Why to use `call` and `apply` instead of calling a function directly ?

Original source

Related problems