在JavaScrip的对象中如何获取第一个属性值?
by 毛三胖 on 2018年02月11日
阅:567赞:9

问题

在JavaScript中,在不知道对象属性名称的前提下,有没有一种优雅的方式来访问对象的第一个属性呢?

var keys = Object.keys(books);
console.log(books[keys[0]]);

利用该方法,可以很优雅获取对象的第一个属性值,也可以获取任意位置的属性值,但却需要构建一个包括所有键值的数组,这是额外的开销。

演示

问题

在JavaScript中,在不知道对象属性名称的前提下,有没有一种优雅的方式来访问对象的第一个属性呢?

例如,有如下数据对象books:

var books = {"html":"HTML5权威指南","css":"CSS揭秘","java":"Java编程思想"};

books的值可能是由jsonp载入或从数据库中得到,因此其第一个属性可能是html,也可能是java等值。因此无法使用books.html来获取第一个属性值。

方法1

通过for...in循环遍历对象的方法,从而返回第一个属性值。

function first(obj) {
    for(var item in obj) {
        return obj[item]
    }
 }
console.log(first(books));

方法2

利用Object.keys(obj)方法,Object.keys 返回一个所有元素为字符串的数组,其元素来自于从给定的对象上面可直接枚举的属性。这些属性的顺序与手动遍历该对象属性时的一致。

var keys = Object.keys(books);
console.log(books[keys[0]]);

利用该方法,可以很优雅获取对象的第一个属性值,也可以获取任意位置的属性值,但却需要构建一个包括所有键值的数组,这是额外的开销。

Object.keys(obj)方法是在ECMAScript 5.1 (ECMA-262)中定义,并在 JavaScript 1.8.5中得以实现。如果要在较老的环境下使用该方法。需要增加兼容性方法:

if (!Object.keys) Object.keys = function(o) {
  if (o !== Object(o))
    throw new TypeError('Object.keys called on a non-object');
  var k=[],p;
  for (p in o) if (Object.prototype.hasOwnProperty.call(o,p)) k.push(p);
  return k;
}

也可以通过Object.values(obj)方法直接获取对象属性值数组,一般来说构建键值的数组效率更好。

参考

MDN / Object.keys

How to access the first property of an object in Javascript?

ECMAScript 5.1 (ECMA-262)

$ 热门标签
$ 贴士
简单是稳定的前提。 -Edsger Dijkstra
$ 声明
本站所有代码及文字都是作者精心汇编整理而成,转载代码及文字请明确注明出处和作者名称。