1. 程式人生 > >JS獲取物件鍵值對中key值的方法

JS獲取物件鍵值對中key值的方法

使用Object.keys


Object.keys( ) 會返回一個數組,陣列中是這個物件的key值列表

所以只要Object.keys(a)[0], 就可以得只包含一個鍵值對的key值

下面是MDN中對Object.keys的描述

Object.keys()方法會返回一個由一個給定物件的自身可列舉屬性組成的陣列,陣列中屬性名的排列順序和使用for...in 迴圈遍歷該物件時返回的順序一致 (兩者的主要區別是 一個 for-in 迴圈還會列舉其原型鏈上的屬性)

語法

Object.keys(obj)

引數

obj
要返回其列舉自身屬性的物件。

返回值

一個表示給定物件的所有可列舉屬性的字串陣列。

描述

Object.keys

 返回一個所有元素為字串的陣列,其元素來自於從給定的object上面可直接列舉的屬性。這些屬性的順序與手動遍歷該物件屬性時的一致。

例子

// simple array
var arr = ['a', 'b', 'c'];
console.log(Object.keys(arr)); // console: ['0', '1', '2']

// array like object
var obj = { 0: 'a', 1: 'b', 2: 'c' };
console.log(Object.keys(obj)); // console: ['0', '1', '2']

// array like object with random key ordering
var anObj = { 100: 'a', 2: 'b', 7: 'c' }; console.log(Object.keys(anObj)); // console: ['2', '7', '100'] // getFoo is a property which isn't enumerable var myObj = Object.create({}, { getFoo: { value: function () { return this.foo; } } }); myObj.foo = 1; console.log(Object.keys(myObj)); // console: ['foo']

注意

在ES5裡,如果此方法的引數不是物件(而是一個原始值),那麼它會丟擲 TypeError。在ES2015中,非物件的引數將被強制轉換為一個物件。

Object.keys("foo");
// TypeError: "foo" is not an object (ES5 code)

Object.keys("foo");
// ["0", "1", "2"]                   (ES2015 code)

Polyfill

要在原生不支援的舊環境中新增相容的Object.keys,請複製以下程式碼段:

if (!Object.keys) {
  Object.keys = (function () {
    var hasOwnProperty = Object.prototype.hasOwnProperty,
        hasDontEnumBug = !({toString: null}).propertyIsEnumerable('toString'),
        dontEnums = [
          'toString',
          'toLocaleString',
          'valueOf',
          'hasOwnProperty',
          'isPrototypeOf',
          'propertyIsEnumerable',
          'constructor'
        ],
        dontEnumsLength = dontEnums.length;

    return function (obj) {
      if (typeof obj !== 'object' && typeof obj !== 'function' || obj === null) throw new TypeError('Object.keys called on non-object');

      var result = [];

      for (var prop in obj) {
        if (hasOwnProperty.call(obj, prop)) result.push(prop);
      }

      if (hasDontEnumBug) {
        for (var i=0; i < dontEnumsLength; i++) {
          if (hasOwnProperty.call(obj, dontEnums[i])) result.push(dontEnums[i]);
        }
      }
      return result;
    }
  })()
};

上面的程式碼在IE7(也許IE8也是)下有個問題,就是如果傳入一個來自其他 window 物件下的物件時,不可列舉的屬性也會獲取到。