We Keep Coding

Advice on the best way to collect values in an array

I need to save all the color values ​​of the elements in the pages of my site and put them in a database. I thought I'd do it this way:
First thing I'm going to pick up the rgb values ​​of each element so
$("*").each(function(e){
createColorArray($(this).css('backgroundColor'));
});
then in the function createColorArray store into an array all the values ​​that are passed
function createColorArray(rgbColor)
{
//Create rgb array
}
and finally remove duplicate items from my array
function removeDoupe(ar) {
var temp = {};
for (var i = 0; i < ar.length; i++)
temp[ar[i]] = true;
var r = [];
for (var k in temp)
r.push(k);
return r;
}
now my question is,
how recommended to create the array? directly inside the $ ("*") or in a dedicated function as I'm thinking? also i need than once removed duplicates in the new array "clean" as well as the rgb value I would have also given the number of times that value was in the original.
Some example code?

As I mentioned in the comments, why not check for duplicates earlier? A simple example:
var colors = [];
$('*').each(function(i, el){
var $element = $(el),
color = $element.css('background-color');
if(!~$.inArray(color, colors))
colors.push(color);
});
console.log(colors);
http://jsfiddle.net/sL9oeywk/

The best way to do this is to do it all while you are working on it. Heres a way you could potentially do it:
var colors = new Array();
var tempColors = {};
$(".colors").each(function(){
var c = $(this).val();
// check if the color exists without looping
if(typeof tempColors[c] == "undefined"){
// if it doesn't, add it to both variables.
tempColors[c] = true;
colors.push(c);
}
});
This will result in two variables: one is an object that you don't have to loop through to find out if you defined it before, one is a colors array that you push to using standard javascript.
You shouldn't make it a dedicated function if you are not reusing it, but you could make it an object like this:
var colors = function(){
var self = this;
self.array = new Array();
// this is a dedicated check function so we don't need separate variables.
// returns true if the color exists, false otherwise
self.check = function(color){
for(var i =0; i < self.array.length; i++){
if(self.array[i] === color) return true;
}
return false;
}
self.add = function(color){
// use the check function, if it returns false, the color does not exist yet.
if(!self.check(color)){
self.array.push(c);
}
}
}
You can then instantiate a colorlist using var colorlist = new colors(); and add colors using colorlist.add("dd0300"). Accessing the array can be done by requesting colorlist.array.

Calling object as function

I have a class defined like:
function S(items) {
this.items = items;
this.item = function(pos) {
return this.items[pos];
}
}
To retrieve the items, I normally do,
var s = new S([10, 20, 30]);
console.log(s.item(0));
console.log(s.item(1));
I want to change the way I access the items to be like:
var s = new S([10, 20, 30]);
console.log(s(0));
console.log(s(1));

You can only call functions. The most close way to do what you are trying to accomplish is to make your function S return another function that receives the position as a parameter and returns the item in that position. And this way you'd need to stop using the new keyword.
function S(items) {
return function(pos) {
return items[pos]
}
}
var s = S([10, 20, 30])
console.log(s(0))
console.log(s(1))
Anyway, I can't see any good reason of why you would like to do that. If you are trying to freeze an array so it can't be modified, then I think using Object.freeze would be a better choice.
FIDDLE: http://jsfiddle.net/84wVU/

You can't.
But you can come close.
function S(items) {
var l = items.length, i;
for( i=0; i<l; i++) this[i] = items[i];
}
var s = new S([10,20,30]);
console.log(s[0]); // note square brackets
Only functions can be called with ().

Although you can indeed loop through the items and take each item in the array and attach it to the class as this[index] = items[index]. Another option is to extend the Array prototype to attach your current functions to it:
Array.prototype.item = function(pos){
return this[pos];
}
Now you can call the item function on arrays like so :
[1,2,3,4].item(1) // will return 2
[1,2,3,4].item(2) // will return 3
and so on..

Creating a new object from another and reading it from an array. (Javascript)

I have the following example constructor:
function Loot(type, sellValue) {
this.type = type;
this.sellValue = sellValue;
}
I am looking to inherit these values into other objects, which are then pushed into an array, such as:
var inventory = [];
var stone = new Loot("craft", 20);
inventory.push(stone);
var hat = new Loot("clothing", 80);
inventory.push(hat);
var coal = new Loot("ore", 5);
inventory.push(coal);
var diamond = new Loot("ore", 400);
inventory.push(diamond);
console.log(inventory);
However, when I do so, my inventory reads as (Loot, Loot, Loot, Loot) and not the names given to the items, (stone, hat, coal, diamond).
How can I get around this? I imagine it would require some form of inheritance?
Thanks!

The variable names like stone do not mean anything to the object. They are a reference to your object, but not the data of the object.
So stone is simply a variable name for the same new Loot that was created.
You have only one Loot object in your example.
Also, if you look in your array with a debugger i will show the type of object (Loot). You need to expand that to see the values inside the object.

However, when I do so, my inventory reads as (Loot, Loot, Loot, Loot) and not the names given to the items, (stone, hat, coal, diamond).
You would need to iterate your inventory array and log the .type properties of all items:
for (var i=0; i<inventory.length; i++)
console.log(inventory[i].type);
Or you'd build right another array from the item types, which could most easily be accomplished with the map method:
var types = inventory.map(function(item) { return item.type; });
console.log(types);

The array can not have string keys.
Apparently you need to use an object to store these objects.
function Loot(type, sellValue){
this.type = type;
this.sellValue = sellValue;
}
var inventory = {};
var inventory2 = {};
var stone = new Loot("craft", 20);
var stone1 = new Loot("craft1", 30);
var stone2 = new Loot("craft2", 40);
//or as follows:
inventory2['stone'] = stone;
inventory2['stone1'] = stone1;
inventory2['stone2'] = stone2;
console.log(inventory); // Object {craft: Loot, craft1: Loot, craft2: Loot}
console.log(inventory2); // Object {stone: Loot, stone1: Loot, stone2: Loot}
http://jsbin.com/aNiXolo/5/edit

Drawing images from an array

I'm currently working on drawing up a tilemap using a set of images loaded inn to an array.
I've defined a tile as an object like this:
function tile(gfx){
this.tile = gfx;
this.drawSelf = function(x,y)
this.tile.x = x;
this.tile.y = y;
}
Then I filled up an array with several tile objects which through the debugger displays correctly.
Now when I start drawing up the images using this code:
for (var x = 0; x < mapArray.length; x++){
xN = 183 + (50*x);
mapArray[x].drawSelf(xN, 134);
gameStage.addChild(mapArray[x].tile);
mapArray[x].tile.visible = true;
}
The problem is that all the "objects" in the array recive the same x and y coords. So what i suspect is that every single object in the array referes to each other.
What I'm trying to do is create a 20x10 map of tiles. And I need to be able to refer to each tile as a single object.
Shout out if I'm not making sense.

If you create all the tiles like this :
var gfx = new ...
for (...) {
mapArray[x].tile = new tile(gfx);
}
Then all of them share the same gfx object.
You should change your initialization like this :
for (...) {
var gfx = new ...
mapArray[x].tile = new tile(gfx);
}

javascript - get Object based on property's value

... if I have the following constructor and then create an instance of the class:
/* Gallery */
function Gallery( _horseName ){
this.horseName = _horseName
this.pixList = new Array();
}
var touchGallery = new Gallery( "touch" )
... how can I get the Gallery object based on the value of horseName?
Thought about implementing something like:
Gallery.prototype.getGalleryByHorseName = function( _horseName ){ /* to be implemented */}
... but got stuck on that. Is there a cleaner or canonical way to accomplish this? Eventually I'll have to access that Gallery object in jQuery as well.
Thanks in advance

Simplest solution is to keep your created objects in an object.
var myGalleries = {};
myGalleries['touchA'] = new Gallery( "touchA" );
myGalleries['touchB'] = new Gallery( "touchB" );
Then you can quickly access them by passing a key.
var galleryOfTouchB = myGalleries['touchB'];

You could do something like this. I think it's fairly clean and canonical:
var Galleries = (function() {
var all = [],
galleriesObj = {};
galleriesObj.create = function(horseName) {
var gallery = {
horseName: horseName,
pixList: []
};
all.push(gallery);
return gallery;
};
galleriesObj.find = function(horseName) {
var ii;
for (ii = 0; ii < all.length; ii += 1) {
if (all[ii].horseName === horseName) {
return all[ii];
}
}
return null;
};
return galleriesObj;
}());
var touchGallery = Galleries.create('touch');
var foundGallery = Galleries.find('touch');

You could do it in a nice oo way, by writing a class which holds a list to all Gallery instances and then write a function iterating over each Gallery object and returning the one with the matching name.
Supaweu shows a very nice and easy (non-oo) example

You're missing a step or two. You need an array of Gallery objects, and then iterate through the array while checking the _horseName property.

You could go at it by creating an object filled with horse name galleries that havve been created:
/* Gallery */
function Gallery( _horseName ){
this.horseName = _horseName
this.pixList = new Array();
Gallery.galleryList[_horseName] = this; // Add this gallery to the list
}
Gallery.galleryList = {};
var touchGallery = new Gallery( "touch" )
var galleryByName = Gallery.galleryList["touch"];