JavaScript / jQuery'de bir nesnenin özellikleri nasıl alınır?

JavaScript / jQuery'de, alertbir nesne alırsam, ya [object]da [object Object]

Bilmenin bir yolu var mı:

1. bu iki nesne arasındaki fark nedir

2. bu ne tür bir nesne

3. Bu nesnenin içerdiği tüm özellikler ve her özelliğin değerleri

?

JavaScript'in yerel for indöngüsünü çağırarak bir nesnenin anahtarlarını ve değerlerini arayabilirsiniz :

var obj = {
    foo:    'bar',
    base:   'ball'
};

for(var key in obj) {
    alert('key: ' + key + '\n' + 'value: ' + obj[key]);
}

veya jQuery .each()yöntemini kullanarak :

$.each(obj, function(key, element) {
    alert('key: ' + key + '\n' + 'value: ' + element);
});

Altı ilkel tipleri dışında , her şey ECMA / JavaScript'inizin bir nesnedir. Diziler; fonksiyonlar; her şey bir nesnedir. Bu ilkellerin çoğu bile aslında sınırlı bir yöntem seçimi olan nesnelerdir. Gerektiğinde kaputun altındaki nesnelerin içine atılırlar. Temel sınıf adını bilmek için, Object.prototype.toStringyöntemi bir nesne üzerinde şu şekilde çağırabilirsiniz :

alert(Object.prototype.toString.call([]));

Yukarıdakiler çıkacaktır [object Array].

Diğer birkaç sınıf adları vardır gibi [object Object], [object Function], [object Date], [object String], [object Number], [object Array], ve [object Regex].

Nesne özelliklerinin / değerlerinin listesini almak için:

1. Firefox'ta - Firebug:

   console.dir(<object>);
   

2. Nesne anahtarlarını Slashnick'ten ödünç almak için standart JS :

      var fGetKeys = function(obj){
         var keys = [];
         for(var key in obj){
            keys.push(key);
         }
         return keys;
      }
   
   // Example to call it:
   
      var arrKeys = fGetKeys(document);
   
      for (var i=0, n=arrKeys.length; i<n; i++){
         console.log(i+1 + " - " + arrKeys[i] + document[arrKeys[i]] + "\n");
      }
   

Düzenlemeler:

1. <object> yukarıdaki kısım, nesneye olan değişken referans ile değiştirilecektir.
2. console.log() konsolda kullanılacaksa, bunun ne olduğundan emin değilseniz, bir alert()

i) bu iki nesne arasındaki fark nedir

Basit cevap, [object]dahili sınıfı olmayan bir ana bilgisayar nesnesini belirtmesidir. Bir ana bilgisayar nesnesi, üzerinde çalıştığınız ECMAScript uygulamasının parçası olmayan, ancak ana bilgisayar tarafından bir uzantı olarak sağlanan bir nesnedir. DOM, en yeni uygulamalarda DOM nesneleri yerel Nesneden miras almasına ve dahili sınıf adlarına ( HTMLElement , Window vb. IE'nin tescilli ActiveXObject'i, bir ana bilgisayar nesnesinin başka bir örneğidir.

[object] En çok Internet Explorer 7 ve daha düşük sürümlerde DOM nesneleri uyarılırken görülür, çünkü bunlar dahili sınıf adı olmayan ana nesnelerdir.

ii) bu ne tür bir Nesne

Kullanarak nesnenin "türünü" (dahili sınıf) alabilirsiniz Object.prototype.toString. Spesifikasyon, her zaman Object , Array , Date , RegExp gibi dahili sınıf adlarının [object [[Class]]]olduğu formatta bir dize döndürmesini gerektirir . Bu yöntemi herhangi bir nesneye (ana bilgisayar nesneleri dahil) uygulayabilirsiniz.[[Class]]

Object.prototype.toString.apply(obj);

Çoğu isArrayuygulama, bir nesnenin aslında bir dizi olup olmadığını keşfetmek için bu tekniği kullanır (ancak IE'de diğer tarayıcılarda olduğu kadar güçlü olmasa da ).

iii) bu nesnenin tüm özellikleri ve her bir özelliğin değerleri

ECMAScript 3'te, bir for...indöngü kullanarak numaralandırılabilir özellikleri yineleyebilirsiniz . Yerleşik özelliklerin çoğunun numaralandırılamayacağını unutmayın. Aynısı bazı ana bilgisayar nesneleri için de geçerlidir. ECMAScript 5'te, miras alınmayan tüm özelliklerin adlarını içeren bir dizi elde edebilirsiniz Object.getOwnPropertyNames(obj). Bu dizi, numaralandırılamayan ve numaralandırılabilir özellik adlarını içerecektir.

Umarım bu spam olarak sayılmaz. Sonsuz hata ayıklama oturumlarından sonra alçakgönüllü bir şekilde bir işlev yazdım: http://github.com/halilim/Javascript-Simple-Object-Inspect

function simpleObjInspect(oObj, key, tabLvl)
{
    key = key || "";
    tabLvl = tabLvl || 1;
    var tabs = "";
    for(var i = 1; i < tabLvl; i++){
        tabs += "\t";
    }
    var keyTypeStr = " (" + typeof key + ")";
    if (tabLvl == 1) {
        keyTypeStr = "(self)";
    }
    var s = tabs + key + keyTypeStr + " : ";
    if (typeof oObj == "object" && oObj !== null) {
        s += typeof oObj + "\n";
        for (var k in oObj) {
            if (oObj.hasOwnProperty(k)) {
                s += simpleObjInspect(oObj[k], k, tabLvl + 1);
            }
        }
    } else {
        s += "" + oObj + " (" + typeof oObj + ") \n";
    }
    return s;
}

Kullanım

alert(simpleObjInspect(anyObject));

veya

console.log(simpleObjInspect(anyObject));

Mozilla Firefox için FireBug edinin .

kullanım console.log(obj);

Spotlight.js , pencere nesnesi ve belirli şeyleri arayan diğer ana nesneler üzerinde yineleme yapmak için harika bir kitaplıktır.

// find all "length" properties
spotlight.byName('length');

// or find all "map" properties on jQuery
spotlight.byName('map', { 'object': jQuery, 'path': '$' });

// or all properties with `RegExp` values
spotlight.byKind('RegExp');

// or all properties containing "oo" in their name
spotlight.custom(function(value, key) { return key.indexOf('oo') > -1; });

Bunun için seveceksin.

Belirlenmiş bir propun ilk girişi için tarama nesnesi:

var obj = {a:'Saludos',
            b:{b_1:{b_1_1:'Como estas?',b_1_2:'Un gusto conocerte'}},
           d:'Hasta luego'
            }
function scan (element,list){
    var res;
    if (typeof(list) != 'undefined'){
        if (typeof(list) == 'object'){
            for(key in list){
               if (typeof(res) == 'undefined'){
                res = (key == element)?list[key]:scan(element,list[key]);
               }
            });
        }
    }
    return res;
}
console.log(scan('a',obj));