it-swarm-id.com

Bagaimana cara menghitung properti dari objek JavaScript?

Bagaimana cara menghitung properti dari objek JavaScript?

Saya sebenarnya ingin membuat daftar semua variabel yang ditentukan dan nilai-nilainya, tetapi saya telah belajar bahwa mendefinisikan variabel sebenarnya membuat properti objek window.

630
davenpcj

Cukup sederhana:

for(var propertyName in myObject) {
   // propertyName is what you want
   // you can get the value like this: myObject[propertyName]
}

Sekarang, Anda tidak akan mendapatkan variabel pribadi dengan cara ini karena mereka tidak tersedia.


EDIT: @ bitwiseplatypus benar bahwa kecuali Anda menggunakan metode hasOwnProperty(), Anda akan mendapatkan properti yang diwarisi - namun, saya tidak tahu mengapa orang yang akrab dengan pemrograman berorientasi objek akan mengharapkan sesuatu yang kurang! Biasanya, seseorang yang mengemukakan hal ini telah mendapat peringatan Douglas Crockford tentang hal ini, yang masih sedikit membingungkan saya. Sekali lagi, pewarisan adalah bagian normal dari OO bahasa dan karenanya merupakan bagian dari JavaScript, meskipun itu bersifat prototipe.

Sekarang, yang mengatakan, hasOwnProperty() berguna untuk memfilter, tetapi kita tidak perlu membunyikan peringatan seolah-olah ada sesuatu yang berbahaya dalam mendapatkan properti yang diwarisi.

EDIT 2: @ bitwiseplatypus memunculkan situasi yang akan terjadi jika seseorang menambahkan properti/metode ke objek Anda pada suatu saat nanti daripada ketika Anda awalnya menulis objek Anda (melalui prototipe) - ketika sedang benar bahwa ini dapat menyebabkan perilaku yang tidak terduga, saya pribadi tidak melihat itu sebagai masalah saya sepenuhnya. Hanya masalah pendapat saja. Selain itu, bagaimana jika saya mendesain sesuatu sedemikian rupa sehingga saya menggunakan prototipe selama konstruksi objek saya dan belum memiliki kode yang beralih ke properti objek dan saya ingin semua properti yang diwarisi? Saya tidak akan menggunakan hasOwnProperty(). Lalu, katakanlah, seseorang menambahkan properti baru nanti. Apakah itu salah saya jika semuanya berperilaku buruk pada saat itu? Saya kira tidak. Saya pikir inilah sebabnya jQuery, sebagai contoh, telah menetapkan cara untuk memperluas cara kerjanya (via jQuery.extend dan jQuery.fn.extend).

790
Jason Bunting

Gunakan loop for..in untuk menyebutkan properti objek, tetapi hati-hati. Enumerasi akan mengembalikan properti tidak hanya dari objek yang disebutkan, tetapi juga dari prototipe objek induk apa pun.

var myObject = {foo: 'bar'};

for (var name in myObject) {
  alert(name);
}

// results in a single alert of 'foo'

Object.prototype.baz = 'quux';

for (var name in myObject) {
  alert(name);
}

// results in two alerts, one for 'foo' and one for 'baz'

Untuk menghindari menyertakan properti yang diwarisi dalam enumerasi Anda, periksa hasOwnProperty():

for (var name in myObject) {
  if (myObject.hasOwnProperty(name)) {
    alert(name);
  }
}

Edit: Saya tidak setuju dengan pernyataan JasonBunting bahwa kita tidak perlu khawatir tentang penghitungan properti yang diwarisi. There adalah bahaya dalam penghitungan atas properti yang diwarisi yang tidak Anda harapkan, karena itu dapat mengubah perilaku kode Anda.

Tidak masalah apakah masalah ini ada dalam bahasa lain; faktanya ada, dan JavaScript sangat rentan karena modifikasi pada prototipe objek memengaruhi objek anak, bahkan jika modifikasi terjadi setelah instantiasi.

Inilah sebabnya mengapa JavaScript menyediakan hasOwnProperty(), dan inilah mengapa Anda harus menggunakannya untuk memastikan bahwa kode pihak ketiga (atau kode lain yang mungkin memodifikasi prototipe) tidak merusak kode Anda. Selain menambahkan beberapa byte kode tambahan, tidak ada kerugian menggunakan hasOwnProperty().

215
Ryan Grove

Cara standar, yang telah diusulkan beberapa kali adalah:

for (var name in myObject) {
  alert(name);
}

Namun Internet Explorer 6, 7 dan 8 memiliki bug dalam penerjemah JavaScript, yang memiliki efek bahwa beberapa kunci tidak disebutkan. Jika Anda menjalankan kode ini:

var obj = { toString: 12};
for (var name in obj) {
  alert(name);
}

Jika akan mengingatkan "12" di semua browser kecuali IE. IE hanya akan mengabaikan kunci ini. Nilai kunci yang terpengaruh adalah:

  • isPrototypeOf
  • hasOwnProperty
  • toLocaleString
  • toString
  • valueOf

Agar benar-benar aman dalam IE Anda harus menggunakan sesuatu seperti:

for (var key in myObject) {
  alert(key);
}

var shadowedKeys = [
  "isPrototypeOf",
  "hasOwnProperty",
  "toLocaleString",
  "toString",
  "valueOf"
];
for (var i=0, a=shadowedKeys, l=a.length; i<l; i++) {
  if map.hasOwnProperty(a[i])) {
    alert(a[i]);
  }
}

Berita baiknya adalah EcmaScript 5 mendefinisikan fungsi Object.keys(myObject), yang mengembalikan kunci-kunci objek sebagai array dan beberapa browser (mis. Safari 4) sudah mengimplementasikannya.

50
Fabian Jakobs

Di browser modern (ECMAScript 5) untuk mendapatkan semua properti enumerable yang dapat Anda lakukan:

Object.keys (obj) (Periksa tautan untuk mendapatkan cuplikan untuk kompatibilitas mundur pada browser lama)

Atau untuk mendapatkan juga properti yang tidak dapat dihitung:

Object.getOwnPropertyNames (obj)

Lihat tabel kompatibilitas ECMAScript 5

Info tambahan: Apa itu atribut enumerable?

44
Carlos Ruana

Saya pikir contoh kasus yang mengejutkan saya relevan:

var myObject = { name: "Cody", status: "Surprised" };
for (var propertyName in myObject) {
  document.writeln( propertyName + " : " + myObject[propertyName] );
}

Tetapi yang mengejutkan saya, hasilnya adalah

name : Cody
status : Surprised
forEach : function (obj, callback) {
    for (prop in obj) {
        if (obj.hasOwnProperty(prop) && typeof obj[prop] !== "function") {
            callback(prop);
        }
    }
}

Mengapa? Skrip lain pada halaman tersebut telah memperpanjang prototipe Obyek:

Object.prototype.forEach = function (obj, callback) {
  for ( prop in obj ) {
    if ( obj.hasOwnProperty( prop ) && typeof obj[prop] !== "function" ) {
      callback( prop );
    }
  }
};
24
cyberhobo
for (prop in obj) {
    alert(prop + ' = ' + obj[prop]);
}
16
Andrew Hedges

Kode JavaScript sederhana:

for(var propertyName in myObject) {
   // propertyName is what you want.
   // You can get the value like this: myObject[propertyName]
}

jQuery:

jQuery.each(obj, function(key, value) {
   // key is what you want.
   // The value is in: value
});
10
EmRa228

Saya menemukannya ... for (property in object) { // do stuff } akan mencantumkan semua properti, dan oleh karena itu semua variabel yang dideklarasikan secara global pada objek jendela ..

9
davenpcj

Berikut cara menghitung properti objek:

var params = { name: 'myname', age: 'myage' }

for (var key in params) {
  alert(key + "=" + params[key]);
}
8
Chtiwi Malek

Jika Anda menggunakan pustaka nderscore.js , Anda dapat menggunakan fungsi kunci :

_.keys({one : 1, two : 2, three : 3});
=> ["one", "two", "three"]
7
dkl

Dict Python memiliki metode 'kunci', dan itu sangat berguna. Saya pikir dalam JavaScript kita dapat memiliki sesuatu ini:

function keys(){
    var k = [];
    for(var p in this) {
        if(this.hasOwnProperty(p))
            k.Push(p);
    }
    return k;
}
Object.defineProperty(Object.prototype, "keys", { value : keys, enumerable:false });

EDIT: Tapi jawaban @ carlos-ruana bekerja dengan sangat baik. Saya menguji Object.keys (window), dan hasilnya adalah apa yang saya harapkan.

Sunting setelah 5 tahun: bukan ide yang baik untuk memperpanjang Object, karena dapat bertentangan dengan perpustakaan lain yang mungkin ingin menggunakan keys pada objek mereka dan itu akan menyebabkan perilaku yang tidak terduga pada proyek Anda. @ carlos-ruana jawab adalah cara yang benar untuk mendapatkan kunci dari suatu objek.

5

Anda dapat menggunakan for dari loop.

Jika Anda ingin menggunakan array:

Object.keys(object1)

Ref. Object.keys ()

4
Walle Cyril

Jika Anda mencoba untuk menghitung properti untuk menulis kode baru terhadap objek, saya akan merekomendasikan menggunakan debugger seperti Firebug untuk melihatnya secara visual.

Teknik praktis lain adalah dengan menggunakan Object.toJSON () Prototipe untuk membuat cerita bersambung objek ke JSON, yang akan menunjukkan nama dan nilai properti.

var data = {name: 'Violet', occupation: 'character', age: 25, pets: ['frog', 'rabbit']};
Object.toJSON(data);
//-> '{"name": "Violet", "occupation": "character", "age": 25, "pets": ["frog","rabbit"]}'

http://www.prototypejs.org/api/object/tojson

2
Chase Seibert

Saya masih pemula dalam JavaScript, tetapi saya menulis fungsi kecil untuk mencetak semua properti dari suatu objek dan anak-anaknya secara rekursif:

getDescription(object, tabs) {
  var str = "{\n";
  for (var x in object) {
      str += Array(tabs + 2).join("\t") + x + ": ";
      if (typeof object[x] === 'object' && object[x]) {
        str += this.getDescription(object[x], tabs + 1);
      } else {
        str += object[x];
      }
      str += "\n";
  }
  str += Array(tabs + 1).join("\t") + "}";
  return str;
}
0
Felix Lapalme