Implementing a function on Array in JavaScript

Question

I'm getting a very strange response to a JS script I'm writing. I'm a bit new to JS, so I don't know much about altering existing classes (in this case, Arrays).

I hope I'm doing this properly, but here's a JSFiddles of the code I'm trying to run (abstracted significantly, but I believe I've included all the relevant parts)

http://jsfiddle.net/UMHn5/

I think the issue is that I don't know how to correctly alter the Array class, as, when I remove the "remove" alteration of Array.prototype, I get a different error (that Arrays don't have a remove function).

The Exception I'm getting is as follows:

`Uncaught TypeError: Object function (from, to) {
var rest = this.slice((to || from) + 1 || this.length);
 this.length = from < 0 ? this.length + from : from;
 return this.push.apply(this, rest);
} has no method 'shift'`

• katspaugh: You don't need to add remove to arrays. There is already splice. Anyway, you omitted the part where this method is called. Also, for (var key in object) is the wrong way to iterate over arrays. Use numerical for.
• Guffa: @bhb: sn is not a Stroke object.
• River Tam: @katspaugh: I prefer the "for...in" solution because it allows me to abstract away from using indices. Frankly, I'd be using a HashSet if I could. I tend to think of this as more expandable, as it would work for an unordered data structure as well.
• katspaugh: Then at least check if the iterated object hasOwnProperty of the key.

Answer 1

When you are looping through the members of strokes, you are getting the keys 0, 1 and "remove". When you use the third key you get strokes["remove"] (which is the same as strokes.remove), which will return the remove method that you added to the array prototype, and you get that error.

Loop through the indices of the array instead of the members of the array:

for (var i = 0; i < strokes.length; i++) {
 strokes[i].shift(.05);
}

Answer 2

in for (sn in strokes), you get error when sn assign to 'remove', the value of strokes[sn] is the function you add to Array instead of stroke instance.

Change to

for (var i = 0; i < strokes.length; i++) {
 strokes[i].shift(.05);
}

or test type first

if (typeof strokes[sn] != 'function') {
 ...
}

• River Tam: Thank you for your help, but neither of these solutions worked. The second shows plenty of promise, and, if your explanation is correct, I would believe it would work. However, because it does not work and the console disagrees with the idea that the function is an element of the array, I believe you are incorrect about the function being an element of the Array.
• River Tam: My apologies! The first solution does work. The error I'm now getting is very similar, but not identical, which is what confused me. Thank you for your help!

Answer 3

Try this:

for (var i = 0; i < strokes.length; i++) {
 strokes[i].shift(.05); //Where I'm getting the error
}

jsFiddle: http://jsfiddle.net/UMHn5/2/

You have not included prototype in fiddle.

• River Tam: When you say "You have not included prototype in fiddle", I'm not sure what you mean, and that might actually be the issue. The proposed solution also did not work, which further strengthens my idea that the prototype is the issue.
• River Tam: My apologies! The solution does work. The error I'm now getting is very similar, but not identical, which is what confused me. Thank you for your help!