The JavaScript Dual Reference Array (DRA) or how to use an array like a object

Mind the following situation: it's 2013, You got to iterate through a array with objects, like a list of field validations:

var
fields = [ // Our array
{
id : 0,
fieldName : 'email', // A common property, unique values
label : 'Email',
data : { dummy : 'whoomy' }
},
{
id : 1,
fieldName : 'another', // Again
label : 'Another field'
}
]
;

The enlightenment

Then, at some point, You need to access the values of a field. The common approach is iterate all the array, find the fieldName, take the value and break, right?

Well, then I realized: why not access the fieldName directly? So, I made this little sweet thing:

var fieldsObj = { 'email' : fields[0] } // and iterate the rest

But wait! Why just don't use the same namespace, to offer the same information, in a direct way?

fields._email = fields [0];
Think about it: is the same namespace, accessing the same information, but directly and linking all the information! It's magic! In my little world of knowledge, it's a little (maybe useless) JavaScript pattern!

So, I've made a little function to iterate the array, take a common property (fieldName), uses it value like a name to identify it and voila! To me, sounds like magic:

var
fields = [ // Our array
{
id : 0,
fieldName : 'email', // It's a common property, with unique values
label : 'Email',
data : { dummy : 'whoomy' }
},
{
id : 1,
fieldName : 'another', // Again
label : 'Another field'
}
]
;

// At this time, I just can access the array, through the index
console.log ( fields[0] ); // Object {...}

// Now, the magic
fields = DRA ( fields , 'fieldName' );

// Then, the same array's value is available by it's common property unique name
console.log ( fields._email ); // Object {...}

// If some property is changed, the change is reflected in both ways
fields._email.label = 'Devs are disciples of Thomas the Apostle';
console.log ( fields._email.label , fields[0].label );
// 'Devs are disciples of Thomas the Apostle' , 'Devs are disciples of Thomas the Apostle'

// The versa is the same, the ARRAY's REFERENCE can be accessed in DUAL ways
fields[0].label = 'We need to see to believe, show me the code';
console.log ( fields._email.label , fields[0].label );
// 'We need to see to believe, show me the code' , 'We need to see to believe, show me the code'

// And the object comparison remains
fields[0] === fields._email // True

// BONUS: it keeps the array's length untouched
fields.length // 2

I've started to look around, search all places, ask many many many JS Masters, and nobody with a clue… That's what I really like about JavaScript, is always discovery something new!

Many names, one reason

Since the first time, that code was called by many names (mesmerize, tokenizer) but at the moment of that post (april/2016) I've just found the perfect name: the Dual Reference Array (DRA, D-array, got it?).

“There are only two hard problems in Computer Science: cache invalidation and naming things.” — Phil Karlton

If are curious about all that jazz, check my code at https://github.com/jspades/dra-dual-reference-array and give a look, play at console and ride the crazy train of JavaScript with me.

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.