PDA

View Full Version : Adding and removing array elements


JPM
07-18-2004, 09:39 PM
Since the Array.splice() method isnt supported by IE5 here's a script with an add function and a remove function.

function remove(nr) {

var nb = parseInt(nr)

for(x=nb;x<myArray.length-1;x++) {
myArray[x] = myArray[x+1]
}
myArray.length += -1
}


function add(nr,value) {
for(x=myArray.length;x>nr;x--) {
myArray[x] = myArray[x-1]
}
myArray[nr] = value
}


You can test it out by including the following html, and an array in the script (here named 'myArray').

<body>

<form>
Nr to add/remove<input type="text" name="nr" /><br />
Value to insert <input type="text" name="val" />
<input type="button" value="remove" onclick="remove(this.form.nr.value)" />
<input type="button" value="add" onclick="add(this.form.nr.value,this.form.val.value)" />
<input type="button" value="View Array" onclick="aA()" />
</form>

</body>
</html>

And this small function

function aA() {
for(x=0;x<myArray.length;x++)
alert(myArray[x])
}

jamescover
07-19-2004, 06:39 PM
Hi JPM:

I have a couple of questions:

First, would it do any harm to dispense with nb, and just set the value of x to 0?

for(x=0;x<myArray.length-1;x++) {
}


vice:

var nb = parseInt(nr)

for(x=nb;x<myArray.length-1;x++) {
}


Second, if I start with 2 items in my array index, like:



myArray = new Array()
myArray[0] = "hello";
myArray[1] = "good-bye";

Then delete both items.

Next, add 3 items, like this:

Nr = 0
Val = zero

Nr = 1
Val = one

Nr = 3
Val = three

This will alert:

zero, one, undefined, three as expected (0-3, 4 total).

However, if I then add:

Nr = 2
Val = two

These alert:

zero, one, two, undefined, three (5 total)?

Can you explain this???


Thanks,


-james

dumpfi
07-19-2004, 08:57 PM
would it do any harm to dispense with nb, and just set the value of x to 0?yes, if you set x to 0 you would always remove the first element of the array.

btw, i prefer this script:
Array.prototype.splice = function(offset, limit) {
var replacement = (Array.prototype.splice.arguments.length == 3) ? Array.prototype.splice.arguments[2] : [];
var removed = [];
for(var i = offset; i < offset + limit; i++) {
removed.push(this[i]);
}
var store = [];
for(var i = offset + limit; i < this.length; i++) {
store.push(this[i]);
}
while(this.length > offset) {
this.pop();
}
for(var i = 0; i < replacement.length; i++) {
this.push(replacement[i]);
}
for(var i = 0; i < store.length; i++) {
this.push(store[i]);
}
return removed;
}dumpfi

JPM
07-19-2004, 10:02 PM
Looks sweet, but I dont think push() and pop() is anymore supported than the original splice method, so couldn't you just use that?

(oh and I dont think you would need to parse nb in the remove function)

Heres how the remove work (shows why you need to set x = nr)

ok; say you have the following array;

var myArray = new Array();
myArray[0] = 0
myArray[1] = 1
myArray[2] = 2
myArray[3] = 3
myArray[4] = 4

and you want to remove [2] ( each collum represents one time in the for loop)

[0] = [0] = [0]
[1] = [1] = [1]
[2] = [3] = [3]
[3] = [3] = [4]
[4] = [4] = [4]

So the first time you give the number you want to remove (nr) to value of array[nr+1] than you give array[nr+1] the value array[nr+2]. When you do it like this you will always end up with two of the last array element and the element (nr) deleted, so then you just remove the last one: array.length+=-1

dumpfi
07-19-2004, 10:24 PM
Without push() and pop() :
Array.prototype.splice = function(offset, limit) {
var replacement = (Array.prototype.splice.arguments.length == 3) ? Array.prototype.splice.arguments[2] : [];
var removed = [];
for(var i = offset; i < offset + limit; i++) {
removed[removed.length] = this[i];
}
var store = [];
for(var i = offset + limit; i < this.length; i++) {
store[store.length] = this[i];
}
while(this.length > offset) {
delete this[this.length - 1];
this.length--;
}
for(var i = 0; i < replacement.length; i++) {
this[this.length] = replacement[i];
}
for(var i = 0; i < store.length; i++) {
this[this.length] = store[i];
}
return removed;
}dumpfi

JPM
07-19-2004, 10:25 PM
nice!

JPM
07-19-2004, 10:49 PM
Regarding your second question

....
......
This will alert:
zero, one, undefined, three as expected (0-3, 4 total).

I tried deleting all of the array Items, then adding:

nr 0
val zero

nr 1
value one

nr 2
value two

And it alerted: zero one and two, just as it's supposed to.

I then added nr 1 - val one2

and it alerted zero one2 one two, just as it's supposed to.


I updated the script about an hour or so after I posted it, so you might want to try copy it again. If it still doesnt work then...?

jamescover
07-20-2004, 04:14 AM
JPM:

and it alerted zero one2 one two, just as it's supposed to

What browser & version are you testing in...I'm using IE 5.0 and NN4.06. It behaved exactly the same (as stated earlier) in both.


Heres how the remove work (shows why you need to set x = nr)

So you are saying set x to nr, but without parsing it???


Dumpfi:

I always code for js 1.3 compliant, so I stick with older browsers...it's always a challenge and a learning experience for me...I will trying your code as time allows--I just had to reformat my HD for the 5th or 6th time this week--I think my HD is failing after 4 years...anyway, thanks for your input.

glenngv
07-20-2004, 09:44 AM
liorean already posted implementations (here in the same forum) of some of the Array functionalities that are not supported by older browsers.

http://www.codingforums.com/showthread.php?t=19996

JPM
07-20-2004, 12:19 PM
I meant 'set x to nb', though Im not sure if it makes any difference(nb - nr).
I have tested the script in IE6 and NN 7.1, though I cant see anything that would make it not work in earlier browsers...?

Alex Vincent
07-22-2004, 04:50 AM
I could swear I wrote code somewhat like this for my book... :cool:

cagrET
07-22-2004, 10:13 PM
dumpfi: your both splice() functions don't work correctly as you can see here: http://gosu.pl/tmp/dumpfi.html

You may be interested to look at this:
http://gosu.pl/download/ie5.js - missing ie5 array functions (including bug free splice() function)
http://gosu.pl/download/ie5.html - unit tests for them (have to be tested on ie5.0 of course)
http://gosu.pl/download/Array.js - additional array funcs
http://gosu.pl/download/Array.html - also unit tests for them