如何在 JavaScript / jQuery 中获取对象的属性？

Question

如何在 JavaScript / jQuery 中获取对象的属性？

javascriptjquery

104

在JavaScript / jQuery中，如果我对某个对象进行alert，那么我会得到[object]或[object Object]。

有没有办法知道：

这两个对象之间有什么区别
这是什么类型的对象
这个对象包含哪些属性和每个属性的值

？

- Saiful

如何打印JavaScript对象！https://dev59.com/mXNA5IYBdhLWcg3wcddk - zod

我也找到了一份有用的文档 http://docs.jquery.com/Types - Saiful

7个回答

13

获取对象属性/值的列表：

在Firefox浏览器的Firebug中：
```
console.dir(<object>);
```
从 Slashnick 借鉴了用于获取对象键的标准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");
   }

编辑:

将上述代码中的<object>替换为对象变量的引用。
在控制台中使用console.log()，如果您不确定它是什么，可以将其替换为alert()。

- vol7ron

7

i) 这两个对象有什么区别？

简单来说，[object] 表示一个没有内部类的宿主对象。宿主对象是指不属于你正在使用的 ECMAScript 实现的对象，而是由宿主作为扩展提供的。DOM 是宿主对象的常见例子，尽管在大多数更新的实现中，DOM 对象从本地 Object 继承并具有内部类名（例如 HTMLElement、Window 等）。IE 的专有 ActiveXObject 就是宿主对象的另一个例子。

在 Internet Explorer 7 及更低版本中，当警告 DOM 对象时，最常见的情况就是看到 [object]，因为它们是没有内部类名的宿主对象。

ii) 这是什么类型的对象？

您可以使用 Object.prototype.toString 来获取对象的 "type" (内部类)。规范要求它始终返回一个字符串，格式为 [object [[Class]]]，其中 [[Class]] 是内部类名称，例如 Object、Array、Date、RegExp 等。您可以将此方法应用于任何对象（包括宿主对象），使用方法如下：

Object.prototype.toString.apply(obj);

许多isArray的实现使用这种技术来发现一个对象是否真正是一个数组（尽管它在IE中不像在其他浏览器中那么健壮）。
在ECMAScript 3中，您可以使用for...in循环迭代可枚举属性。请注意，大多数内置属性都是不可枚举的。某些宿主对象也是如此。在ECMAScript 5中，您可以使用Object.getOwnPropertyNames(obj)获取一个包含所有非继承属性名称的数组。该数组将包含不可枚举和可枚举的属性名称。iii)此对象包含哪些属性及每个属性的值是什么？

- Andy E

4

希望这不算是垃圾邮件。在无尽的调试会话后，我谦卑地编写了一个函数：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));

- Halil Özgür

2

下载 FireBug 适用于 Mozilla Firefox。

使用 console.log(obj);

- Z. Zlatev

1

我看不出你的firebug和我的有什么不同，但我会使用dir而不是log来列出对象。 - vol7ron

"console.log"非常有效，您可以在日志中单击对象以获取“dir”... - gnarf

1

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

你会因为这个而喜欢它。

- Paul Irish

0

扫描对象以找到确定属性的第一个实例：

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

- J Jesus Loera V

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- jAndy · Accepted Answer

您可以通过调用JavaScript的本机for in循环来查找对象的键和值：

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

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

或使用jQuery的.each()方法：

$.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]。