The Blog / Development / Arrays and Objects in Javascript

Arrays and Objects in Javascript

18 Jan 2010

When working with Arrays there are normally a few tasks that you tend to repeat and the functions are not that evident from the names alone. I created a helper object which allows you to convert a JSON string to objects and store them into a array.

To keep things simple I decided to name the object arrayHelper, the methods that this object would have are init, add, update, replace. move and remove. These are the day to day functions you would use on a array.


var arrayHelper = {
	myArray: [],
	init: function(initString) {
		
	},
	// Add items to the array
	add: function(item) {
		
	},
	
	// Update a single item in array Object
	update: function(index, property, value) {
		
	},
	// Replace items to the array
	replace: function(index, item) {
		
	},
	// Move item around in array
	move: function(indexFrom, indexTo) {
		
	},
	// Remove items from the array
	remove: function(index) {
		
	}
}

So this is what our initial helper object should look like, we pass properties to the each method within the arrayHelper (object), we have a property created called myArray with its value being a array, we will use this to store all our array information and it will be accessible by all methods.

In the first method we pass a param initString which would hold the JSON string information that should be loaded into the array, lets write some more code for this method


init: function(initString) {
	this.myArray = eval('(' + initString + ')');
}

Here we are using the eval function to convert the JSON string into objects which then gets loaded into the array property (myArray). New we want to write the code for the add method


add: function(item) {
	return this.myArray.unshift(eval('('+item+')'));
},

I decided to use the unshift array function since I wanted all new objects added to be at the beginning of the array, but you can use the push function if you would like it to be removed from the end or you could write a if else logic statement to add to beginning/end, inside of this we add the eval function to convert JSON string to object.

The rest of the object is self explanatory except for the move method which uses the splice array function, the splice array function allows you to remove and replace nodes in the array.

Here is the completed code:


var arrayHelper = {
	myArray: [],

	init: function(initString) {
		this.myArray = eval('(' + initString + ')');
	},

	// Add items to the array
	add: function(item) {
		return this.myArray.unshift(item);
	},
	
	// Update a single item in array Object
	update: function(index, property, value) {
		return this.myArray[index][property] = value;
	},

	// Replace items to the array
	replace: function(index, item) {
		return this.myArray.splice(index, 1, item);
	},

	// Move item around in array
	move: function(indexFrom, indexTo) {
		var tmp = this.myArray.splice(indexFrom, 1);
		return this.myArray.splice(indexTo, 0, tmp[0]);
	},

	// Remove items from the array
	remove: function(index) {
		return this.myArray.splice(index, 1);
	}
}

You can use this and extend it to include other functions if you wish to add them in, it is also easy to convert this back to JSON by using the stringify function in the JSON javascript library.

 

Tweeties

  1. 5 days ago - I have to say #django is for geeks, regex all over the place. Better to go learn #ruby. #php still great anyway, not leaving anytime soon.
  2. 3 weeks ago - After spending long hours learning #django, I finally realized it has 1 flaw, mapping url views with regex so i guess it has 2 flaws.
  3. 4 weeks ago - I have added a new piece of work to my portfolio from the Frijj Swamp Soccer Soccerettes campaign, check it out http://bit.ly/a0rMQ5
 

Social Media

Linkedin Twitter
Palace Guard Outings 046 Train Power Plug
 

Network

Billing Cart