Bu materyal This madde henüz sadece: English, 日本語, 한국어, Русский, 简体中文 dillerinde mevcuttur. Lütfen bize bu bölümün çevirisini Türkçe çevirmek için yardım ediniz.

Object.keys, values, entries

Veri yapılarından biraz uzaklaşıp bunların döngülerinden bahsedecek olursak;

Bir önceki bölümde map.keys(), map.values(), map.entries() gibi metodlar vardı.

Bu metodlar generic metorlardır. Bunların veri yapılarında kullanılması çoğu dilde ortaktır. Eğer yenei bir veri yapısı yapmak istiyorsanız siz de bunların uygulamasını yapmalısınız.

Bunlar:

  • Map
  • Set
  • Array ( arr.values() hariç)

… için desteklenir.

Basit objeler de aynı metodları destekler aslında, fakat yazımları biraz daha fazladır.

Object.keys, values, entries

Basit objeler için aşağıdaki metodlar kullanılabilir.

… Farklılıklarına dikkat edin. ( aşağıda map örneği gösterilmiştir):

Map Object
Çağırma map.keys() Object.keys(obj), fakat obj.keys() değil
Döner sıralı döngü objesi “gerçek” dizi

İlk farklılık obj.keys() değil de Object.keys(obj) dönmeniz gerekmektedir.

Peki neden? Ana neden esnekliktir. Hatırlarsanız, objeler tüm karmaşık yapıların temelidir. Bundan dolayı kendimize ait order gibi bir objeniz ve bunun kendine ait bir order.values() metodu olabilir. Yine de bunun üzerinde Object.values(order)'ı çağırabilmeniz gerekir.

Diğer bir farklılık ise Object.* metodları “gerçek” dizi döner. Sadece sıralı döngü objesi değil. Bu da tarihsel nedenlerden dolayıdır aslında.

Örneğin:

let kullanici = {
  adi: "Ahmet",
  yasi: 30
};
  • Object.keys(kullanici) = [adi, yasi]
  • Object.values(kullanici) = ["Ahmet", 30]
  • Object.entries(kullanici) = [ ["adi","Ahmet"], ["yasi",30] ]

Burada ise Object.values'un özelliklerinin döngüde kullanımı gösterilmektedir:

let kullanici = {
  adi: "Ahmet",
  yasi: 30
};

//  değerler üzerinden döngü
for(let deger of Object.values(kullanici)) {
  alert(deger); // Ahmet,sonrasında 30
}
Object.keys/values/entries symbol özelliklerini görmezden gelir

for..in döngüsünde olduğu gibi, bu metodlar Symbol(...)'ü anahtar olarak kullanan özellikleri pas geçerler.

Bu baya işe yarar bir özelliktir. Fakat symbol özelliklerini almak istiyorsanız Object.getOwnPropertySymbols metodunu kullanabilirsiniz. Ayrıca Reflect.ownKeys(obj) tüm anahtarları döner.

Object.fromEntries to transform objects

Sometimes we need to perform a transformation of an object to Map and back.

We already have new Map(Object.entries(obj)) to make a Map from obj.

The syntax of Object.fromEntries does the reverse. Given an array of [key, value] pairs, it creates an object:

let prices = Object.fromEntries([
  ['banana', 1],
  ['orange', 2],
  ['meat', 4]
]);

// now prices = { banana: 1, orange: 2, meat: 4 }

alert(prices.orange); // 2

Let’s see practical applications.

For example, we’d like to create a new object with double prices from the existing one.

For arrays, we have .map method that allows to transform an array, but nothing like that for objects.

So we can use a loop:

let prices = {
  banana: 1,
  orange: 2,
  meat: 4,
};

let doublePrices = {};
for(let [product, price] of Object.entries(prices)) {
  doublePrices[product] = price * 2;
}

alert(doublePrices.meat); // 8

…Or we can represent the object as an Array using Object.entries, then perform the operations with map (and potentially other array methods), and then go back using Object.fromEntries.

Let’s do it for our object:

let prices = {
  banana: 1,
  orange: 2,
  meat: 4,
};

let doublePrices = Object.fromEntries(
  // convert to array, map, and then fromEntries gives back the object
  Object.entries(prices).map(([key, value]) => [key, value * 2])
);

alert(doublePrices.meat); // 8

It may look difficult from the first sight, but becomes easy to understand after you use it once or twice.

We also can use fromEntries to get an object from Map.

E.g. we have a Map of prices, but we need to pass it to a 3rd-party code that expects an object.

Here we go:

let map = new Map();
map.set('banana', 1);
map.set('orange', 2);
map.set('meat', 4);

let obj = Object.fromEntries(map);

// now obj = { banana: 1, orange: 2, meat: 4 }

alert(obj.orange); // 2

Görevler

önem: 5

maaslar objesindeki maaşları toplayınız.

toplamMaas(maaslar) aında bir fonksiyon yazınız ve bu Object.values ve for..of döngüsü kullanarak tüm maaşların toplamını dönsün.

Eğer maaslar boş ise sonuç 0 olmalıdır.

Örneğin:

let maaslar = {
  "Ahmet": 100,
  "Mehmet": 300,
  "Muzaffer": 700
};

alert( toplamMaas(maaslar) ); // 1100

Testler ile korunaklı olan aç.

function sumSalaries(salaries) {

  let sum = 0;
  for (let salary of Object.values(salaries)) {
    sum += salary;
  }

  return sum; // 650
}

let salaries = {
  "John": 100,
  "Pete": 300,
  "Mary": 250
};

alert( sumSalaries(salaries) ); // 650

Or, optionally, we could also get the sum using Object.values and reduce:

// reduce loops over array of salaries,
// adding them up
// and returns the result
function sumSalaries(salaries) {
  return Object.values(salaries).reduce((a, b) => a + b, 0) // 650
}

Çözümü testler korunaklı alanda olacak şekilde aç.

önem: 5

ozellikSayisi(obj) adında bir fonksiyon yazın ve bu fonksiyon objede bulunan özelliklerin sayısını dönsün.

let kullanici = {
  adi: 'Ahmet',
  yasi: 30
};

alert( ozellikSayisi(kullanici) ); // 2

Kodu olabildiğince kısa yazınız.

Not: Sembolik özellikleri pas geçin, sadece “gerçek” olanları hesaba katın.

Testler ile korunaklı olan aç.

Eğitim haritası

Yorumlar

yorum yapmadan önce lütfen okuyun...
  • Eğer geliştirme ile alakalı bir öneriniz var ise yorum yerine github konusu gönderiniz.
  • Eğer makalede bir yeri anlamadıysanız lütfen belirtiniz.
  • Koda birkaç satır eklemek için <code> kullanınız, birkaç satır eklemek için ise <pre> kullanın. Eğer 10 satırdan fazla kod ekleyecekseniz plnkr kullanabilirsiniz)