Javascript: how to detect array calls?

Question

I have question about native javascript calling.

i have a class:

x = function(arr) { this.arr = arr; return this; }
x.prototype.toArray = function() {
       return this.arr;
};
x.prototype.test = function() { alert('but i m object too!'); };

when i calling:

var test = new x(['a','b','c']);

alert(test[0]);

alert(test.test());

need to get result 'a' and 'but i m object too!' dialogs.

I want to use this feature as syntax sugar like uses jquery in core when returning DOM Elements after using selector as array. How to implement that?

UPDATE:

Thank for answer, but i need proofs in jquery code blob on github.

Do you want your object to be like an array or "inherit" all the methods that an array has? — Ja͢ck
– Ja͢ck, Commented Dec 11, 2013 at 2:58
@Jack My guess is like an array. Like how you can get the DOM element from a jQuery object using $('selector')[0] — Phil
– Phil, Commented Dec 11, 2013 at 3:00
Another way, i think.. i can extend Array object and write here my native methods from x.prototype... but it is "context dancing" :-) — xercool
– xercool, Commented Dec 11, 2013 at 3:14
"Thank for answer, but i need proofs in jquery code blob on github." No one is preventing you from looking at the source code: github.com/jquery/jquery/blob/master/src/core/init.js#L16. But if you want to do it exactly how jQuery does it, why did you asked the question in the first place? You could have just looked at the source code. — Felix Kling
– Felix Kling, Commented Dec 11, 2013 at 4:16

Felix Kling · Accepted Answer · 2013-12-11 02:50:26Z

3

An array is nothing else than an object which treats numeric properties in a special way. You would have to copy every element of the array to the instance, using the index of the element as property name. You should also set the length attribute, to make it a true "array-like" object.

var X = function(arr) {
    for (var i = 0, l = arr.length; i < l; i++) {
        this[i] = arr[i];
    }
    this.length = arr.length;
};

var x = new X(['a', 'b', 'c']);
alert(x[0]);

answered Dec 11, 2013 at 2:50

Felix Kling

820k181 gold badges1.1k silver badges1.2k bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

xercool Over a year ago

and jquery using that way?

Ja͢ck · Accepted Answer · 2013-12-11 03:48:19Z

1

Basically the jQuery prototype only has a length property and that makes it array-like; to "import" items into it, they must be copied one by one.

To perform this merge, they use the following function:

function merge(first, second) 
{
  var len = +second.length,
  j = 0,
  i = first.length;

  for ( ; j < len; j++ ) {
    first[ i++ ] = second[ j ];
  }

  first.length = i;

  return first;
}

Next, they define the constructor which can also be called as a function:

function x(arr)
{
    return new x.fn.init(arr);
}

The x.fn refers to a prototype from which the functions are inherited, as shown below:

x.fn = x.prototype = {
  constructor: x,
  test: function() {
    alert('yay');
  },
  init: function(arr) {
    return merge(this, arr);
  },
  length: 0
};

As you can see, your test() method is also there, together with an initialized length property. The only thing that remains is to bind the x.fn.init prototype to the above x.fn:

x.fn.init.prototype = x.fn;

With all that in place, the following code works as expected:

var y = x(['a', 'b', 'c']);

alert(y[0]); // shows 'a'
y.test(); // alerts 'yay'

answered Dec 11, 2013 at 3:48

Ja͢ck

174k39 gold badges269 silver badges316 bronze badges

1 Comment

xercool Over a year ago

Thanks for complete answer!

Ringo · Accepted Answer · 2013-12-11 03:27:33Z

0

Why didn't you call toArray() that you have created?

Try:

x = function(arr) { this.arr = arr; }
x.prototype.toArray = function() {
       return this.arr;
};

var test = new x(['a','b','c']);

alert(test.toArray()[0]);

OR

x = function(arr) { this.arr = arr; }
x.prototype.toArray = function() {
       return this.arr;
};

var test = new x(['a','b','c']).toArray();

alert(test[0]);

answered Dec 11, 2013 at 3:27

Ringo

3,9873 gold badges25 silver badges38 bronze badges

1 Comment

Felix Kling Over a year ago

This is still not what the OP wants.

Collectives™ on Stack Overflow

Javascript: how to detect array calls?

3 Answers 3

1 Comment

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related