javascriptjquery-plugins

jQuery Plugin Architecture Syntax - What does this line mean?


I was reading the jQuery documentation for plugin development and I ran across a line of code I cannot wrap my head around.

$.fn.tooltip = function( method ) {

if ( methods[method] ) {
  return methods[method].apply( this, Array.prototype.slice.call( arguments, 1 ));
} else if ( typeof method === 'object' || ! method ) {
  return methods.init.apply( this, arguments );
} else {
  $.error( 'Method ' +  method + ' does not exist on jQuery.tooltip' );
}    

The line in question:

return methods[method].apply(this, Array.prototype.slice.call(arguments,1));

I understand that all javascript objects inherit call() and apply() and I understand the differance between these two functions. What I don't understand is the prototype on the Array. Array objects already have a slice() so why is the prototype needed here? Since call() takes two arguments which are a 'this' (context) and a list of arguments I don't understand how the above call invocation works. Can someone help me understand this line?

Thanks


Solution

  • The arguments object inherits from Object.prototype. It may look like an array, but it isn't. To perform array operations on it, the following line is necessary:

    Array.prototype.slice.call(arguments,1)
    

    The previous line copies the arguments "array", and uses the slice(1) method on it.

    Array.prototype.slice(arguments, 1) is equivalent to:

    (Note that the arguments object is not modified during this process)

    Pseudo-code:

    var arguments = {1: "arg1", 2: "arg2", 3: "arg3", length: 3};
    var copy = convert_object_to_array(arguments); //This function does not exists
    // copy looks like: ["arg1", "arg2", "arg3"]
    copy.slice(1); //Returns ["arg2", "arg3"]