Why Array.length does not work with key string

Question

I've been reading and doing some testing and found that the command. "Length" of the Array () javascript does not work when the array's keys are string. I found that to run this command, I use whole keys.

However, I wonder if any of you can tell me why this rule? Limitation of language, or specification of logic? Or, my mistake ...?

Thanks

Obs.: The key to my array is a string (name of component) but the values and the array of objects.

Declarating:

objElementos = new Array();

Object:

objElemento = function(Id){
this.Id        = $('#' + Id).attr('id');
this.Name      = $('#' + Id).attr('name');
this.CssLeft   = $('#' + Id).css('left');
this.CssBottom = $('#' + Id).css('bottom');
this.Parent    = $('#' + Id).parent().get(0);
this.Childs    = new Array();

this.addChild = function(IdObjChild) {
    try {
        if ($('#' + IdObjChild).attr('id') != '')
            this.Childs[$('#' + IdObjChild).attr('id')] = new objElemento(IdObjChild);
    } catch(err){ $('#divErrors').prepend('<p>' + err + '</p>'); }
}

this.getChildCount = function(){
    try {
        $('#divErrors').prepend('<p>' + this.Childs.length + '</p>');
        return this.Childs.length;
    } catch(err){ $('#divErrors').prepend('<p>' + err + '</p>'); }
}

this.updateCssLeft = function(CssPosition){
    try {
        $('#divErrors').prepend('<p>updateCssLeft:' + this.Id + ' / ' + this.CssLeft + '</p>');

        $('#' + this.Id).css('left',CssPosition);
        this.CssLeft = $('#' + this.Id).css('left');

        $('#divErrors').prepend('<p>updateCssLeft:' + this.Id + ' / ' + this.CssLeft + '</p>');         
    } catch(err){ $('#divErrors').prepend('<p>' + err + '</p>'); }
}

this.updateCssBottom = function(CssPosition){
    try {
        $('#divErrors').prepend('<p>updateCssBottom:' + this.Id + ' / ' + this.CssBottom + '</p>');

        $('#' + this.Id).css('bottom',CssPosition);
        this.CssBottom = $('#' + this.Id).css('bottom');

        $('#divErrors').prepend('<p>updateCssBottom:' + this.Id + ' / ' + this.CssBottom + '</p>');
    } catch(err){ $('#divErrors').prepend('<p>' + err + '</p>'); }
}
  }

Use:

objElementos['snaptarget'] = new objElemento('snaptarget');

Answer 1

When using string "indexers" on an array, you are effectively treating it as an object and not an array, and tacking extra fields onto that object. If you are not using integer indexes, then there's not really much point in using the Array type and it makes more sense to use the Object type instead. You could count the fields as follows:

var c=0;
for(var fieldName in obj)
{
    c++;
}

Answer 2

Since arrays with key strings are objects, you can use:

Object.keys(objElementos).length

Answer 3

The reason is because when you are using strings as your keys, you're really declaring an object, rather than an array. As such, there is no length attribute for objects.