Как получить свойства объекта в JavaScript / jQuery?

В JavaScript / jQuery, если я alert какой - то объект, я получаю либо [object]или [object Object]

Есть ли способ узнать:

1. в чем разница между этими двумя объектами

2. какой тип объекта это

3. какие свойства содержит этот объект, и значения каждого свойства

?

Вы можете найти ключи и значения объекта, вызвав собственный for inцикл JavaScript :

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

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

или используя .each()метод jQuery :

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

За исключением шести примитивных типов , все в ECMA- / JavaScript является объектом. Массивы; функции; все есть объект. Даже большинство этих примитивов на самом деле также являются объектами с ограниченным набором методов. При необходимости они вставляются в предметы под капотом. Чтобы узнать имя базового класса, вы можете вызвать Object.prototype.toStringметод объекта, например:

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

Вышеуказанное будет выводиться [object Array].

Есть несколько других имен классов, как [object Object], [object Function], [object Date], [object String], [object Number], [object Array], и [object Regex].

Чтобы получить список свойств / значений объекта:

1. В Firefox - Firebug:

   console.dir(<object>);

2. Стандартный 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");
      }

Редактирует:

1. <object> в приведенном выше примере следует заменить ссылкой на переменную объекта.
2. console.log() должен использоваться в консоли, если вы не знаете, что это такое, вы можете заменить его на alert()

i) в чем разница между этими двумя объектами

Простой ответ заключается в том, что это [object]указывает на объект-хост, у которого нет внутреннего класса. Объект хоста - это объект, который не является частью реализации ECMAScript, с которой вы работаете, но предоставляется хостом в качестве расширения. Модель DOM является распространенным примером объектов хоста, хотя в большинстве новых реализаций объекты DOM наследуются от собственного объекта и имеют имена внутренних классов (например, HTMLElement , Window и т. Д.). Запатентованный IE ActiveXObject - еще один пример хост-объекта.

[object] чаще всего встречается при предупреждении объектов DOM в Internet Explorer 7 и ниже, поскольку они являются объектами хоста, не имеющими внутреннего имени класса.

ii) какой тип объекта это

Получить «тип» (внутренний класс) объекта можно с помощью Object.prototype.toString. Спецификация требует, чтобы он всегда возвращал строку в формате [object [[Class]]], где [[Class]]- внутреннее имя класса, такое как Object , Array , Date , RegExp и т. Д. Вы можете применить этот метод к любому объекту (включая объекты хоста), используя

Object.prototype.toString.apply(obj);

Многие isArrayреализации используют этот метод, чтобы определить, действительно ли объект является массивом (хотя в IE он не такой надежный, как в других браузерах ).

iii) какие свойства содержит этот объект, и значения каждого свойства

В ECMAScript 3 вы можете перебирать перечислимые свойства с помощью for...inцикла. Обратите внимание, что большинство встроенных свойств не перечислить. То же самое и с некоторыми хост-объектами. В ECMAScript 5 вы можете получить массив, содержащий имена всех ненаследуемых свойств, используя Object.getOwnPropertyNames(obj). Этот массив будет содержать неперечислимые и перечислимые имена свойств.

Надеюсь, это не считается спамом. После бесконечных сеансов отладки я скромно написал функцию: 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;
}

использование

alert(simpleObjInspect(anyObject));

или

console.log(simpleObjInspect(anyObject));

Загрузите FireBug для Mozilla Firefox.

использовать console.log(obj);

Spotlight.js - отличная библиотека для итерации по объекту окна и другим объектам хоста в поисках определенных вещей.

// 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; });

Вам это понравится.

Сканируемый объект для первого ввода определенной опоры:

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));