JavaScript’te nesneler, verileri anahtar-de\u011fer \u00e7iftleri halinde d\u00fczenlemek i\u00e7in temel yap\u0131 ta\u015flar\u0131d\u0131r. Uygulamalar\u0131m\u0131zda s\u0131kl\u0131kla bu nesnelerin i\u00e7indeki verilere eri\u015fmemiz, onlar\u0131 i\u015flememiz veya ba\u015fka bir veri yap\u0131s\u0131na d\u00f6n\u00fc\u015ft\u00fcrmemiz gerekir. Geleneksel olarak, bu t\u00fcr i\u015flemler i\u00e7in Bu rehberde, G\u00f6rd\u00fc\u011f\u00fcn\u00fcz gibi, Bir nesnenin i\u00e7indeki say\u0131sal de\u011ferlerin toplam\u0131n\u0131 veya ortalamas\u0131n\u0131 almak istedi\u011finizde Bir nesnenin de\u011ferleri aras\u0131nda belirli bir \u00f6\u011fenin olup olmad\u0131\u011f\u0131n\u0131 kontrol etmek i\u00e7in Nesne de\u011ferlerini bir diziye d\u00f6n\u00fc\u015ft\u00fcrd\u00fckten sonra, Nesnenin her bir anahtar-de\u011fer \u00e7iftini ayr\u0131 ayr\u0131 ele alman\u0131z gerekti\u011finde Belirli ko\u015fullara uyan anahtar-de\u011fer \u00e7iftlerini se\u00e7erek yeni bir nesne olu\u015fturmak i\u00e7in JavaScript’in Her iki y\u00f6ntem de nesnelerle \u00e7al\u0131\u015fmak i\u00e7in harika olsa da, farkl\u0131 senaryolar i\u00e7in optimize edilmi\u015flerdir. Do\u011fru y\u00f6ntemi se\u00e7mek, kodunuzun daha okunabilir ve verimli olmas\u0131n\u0131 sa\u011flar.<\/p>\n Bu y\u00f6ntemler, Geleneksel Bu y\u00f6ntemler, ES2017 (ECMAScript 2017)<\/strong> ile tan\u0131t\u0131lm\u0131\u015ft\u0131r. Bu nedenle, eski taray\u0131c\u0131lar\u0131 veya Node.js versiyonlar\u0131n\u0131 hedefliyorsan\u0131z, uyumluluk i\u00e7in polyfill kullanman\u0131z gerekebilir.<\/p>\n Her iki y\u00f6ntem de sadece nesnenin kendi numaraland\u0131r\u0131labilir (enumerable) string anahtarl\u0131 \u00f6zelliklerini<\/strong> d\u00f6nd\u00fcr\u00fcr. Prototip zincirindeki \u00f6zellikleri veya numaraland\u0131r\u0131lamayan (non-enumerable) \u00f6zellikleri dikkate almazlar. Bu, Evet, ES2015’ten itibaren JavaScript spesifikasyonu, string anahtarl\u0131 \u00f6zelliklerin Hay\u0131r, \u00c7o\u011fu durumda, tipik boyutlardaki nesneler i\u00e7in performans fark\u0131 ihmal edilebilir d\u00fczeydedir ve kodun okunabilirli\u011fi ile g\u00fcvenli\u011fi daha \u00f6nceliklidir. \u00c7ok b\u00fcy\u00fck nesnelerle \u00e7al\u0131\u015f\u0131rken veya performans kritik senaryolarda k\u00fc\u00e7\u00fck farklar olabilir, ancak bu nadirdir ve genellikle mikro-optimizasyona girmeden \u00f6nce ba\u015fka darbo\u011fazlara bakmak daha mant\u0131kl\u0131d\u0131r.<\/p>\n <\/body><\/p>\n","protected":false},"excerpt":{"rendered":"JavaScript’te nesneler, verileri anahtar-de\u011fer \u00e7iftleri halinde d\u00fczenlemek i\u00e7in temel yap\u0131 ta\u015flar\u0131d\u0131r. Uygulamalar\u0131m\u0131zda s\u0131kl\u0131kla bu nes","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"csco_page_header_type":"","csco_page_load_nextpost":"","csco_page_subscribe_form":"","csco_page_contact_form":"","footnotes":""},"categories":[1],"tags":[],"class_list":{"0":"post-33528","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-genel","7":"cs-entry","8":"cs-video-wrap"},"yoast_head":"\nfor...in<\/code> d\u00f6ng\u00fcs\u00fc veya Object.keys()<\/code> gibi y\u00f6ntemler kullan\u0131l\u0131rd\u0131. Ancak ES2017 ile birlikte hayat\u0131m\u0131za giren Object.values()<\/code> ve Object.entries()<\/code> y\u00f6ntemleri, bu g\u00f6revleri \u00e7ok daha modern, okunabilir ve g\u00fcvenli bir \u015fekilde yapmam\u0131z\u0131 sa\u011flayan g\u00fc\u00e7l\u00fc ara\u00e7lar sunar.<\/p>\nObject.values()<\/code> ve Object.entries()<\/code> y\u00f6ntemlerinin ne i\u015fe yarad\u0131\u011f\u0131n\u0131, nas\u0131l kullan\u0131ld\u0131\u011f\u0131n\u0131, pratik \u00f6rneklerle senaryolar\u0131n\u0131 ve ne zaman hangisini tercih etmeniz gerekti\u011fini detayl\u0131 bir \u015fekilde inceleyece\u011fiz. Ayr\u0131ca, bu y\u00f6ntemlerin sa\u011flad\u0131\u011f\u0131 avantajlar\u0131 ve JavaScript geli\u015ftirme s\u00fcrecinizdeki yerini de ele alaca\u011f\u0131z.<\/p>\nObject.values(): Nesne De\u011ferlerine Eri\u015fmek<\/h2>\n
Object.values()<\/code> y\u00f6ntemi, bir nesnenin kendi numaraland\u0131r\u0131labilir (enumerable) string anahtarl\u0131 \u00f6zelliklerinin de\u011ferlerinden olu\u015fan bir dizi d\u00f6nd\u00fcr\u00fcr. Bu, bir nesnenin sadece de\u011ferlerine odaklanman\u0131z gerekti\u011finde olduk\u00e7a kullan\u0131\u015fl\u0131d\u0131r.<\/p>\nKullan\u0131m ve S\u00f6zdizimi<\/h3>\n
Object.values()<\/code> y\u00f6ntemi, arg\u00fcman olarak bir nesne al\u0131r ve bu nesnenin de\u011ferlerini i\u00e7eren yeni bir dizi d\u00f6nd\u00fcr\u00fcr. Orijinal nesne \u00fczerinde herhangi bir de\u011fi\u015fiklik yapmaz.<\/p>\n\nconst user = {\n name: \"Alice\",\n age: 30,\n city: \"New York\"\n};\n\nconst userValues = Object.values(user);\nconsole.log(userValues); \/\/ \u00c7\u0131kt\u0131: [\"Alice\", 30, \"New York\"]\n<\/code><\/pre>\nuser<\/code> nesnesinin anahtarlar\u0131 g\u00f6z ard\u0131 edilerek sadece de\u011ferleri bir dizi olarak elde edildi.<\/p>\nPratik Kullan\u0131m Senaryolar\u0131<\/h3>\n
Object.values()<\/code>, \u00f6zellikle a\u015fa\u011f\u0131daki gibi durumlarda olduk\u00e7a i\u015fe yarar:<\/p>\n1. Toplam De\u011fer Hesaplama<\/h4>\n
Object.values()<\/code> ve reduce()<\/code> y\u00f6ntemlerini birle\u015ftirebilirsiniz.<\/p>\n\nconst monthlySales = {\n january: 1200,\n february: 1500,\n march: 1000,\n april: 1800\n};\n\nconst totalSales = Object.values(monthlySales).reduce((acc, current) => acc + current, 0);\nconsole.log(Toplam Sat\u0131\u015f: ${totalSales} TL<\/code>); \/\/ \u00c7\u0131kt\u0131: Toplam Sat\u0131\u015f: 5500 TL\n<\/code><\/pre>\n2. Belirli Bir De\u011ferin Var Olup Olmad\u0131\u011f\u0131n\u0131 Kontrol Etme<\/h4>\n
Object.values()<\/code> ile birlikte includes()<\/code> veya some()<\/code> gibi dizi y\u00f6ntemlerini kullanabilirsiniz.<\/p>\n\nconst productDetails = {\n id: \"PROD123\",\n name: \"Ak\u0131ll\u0131 Telefon\",\n category: \"Elektronik\",\n inStock: true\n};\n\nconst hasElectronicsCategory = Object.values(productDetails).includes(\"Elektronik\");\nconsole.log(Elektronik kategorisi mevcut mu? ${hasElectronicsCategory}<\/code>); \/\/ \u00c7\u0131kt\u0131: Elektronik kategorisi mevcut mu? true\n\nconst hasFalseValue = Object.values(productDetails).some(value => value === false);\nconsole.log(Nesnede 'false' de\u011feri var m\u0131? ${hasFalseValue}<\/code>); \/\/ \u00c7\u0131kt\u0131: Nesnede 'false' de\u011feri var m\u0131? false\n<\/code><\/pre>\n3. De\u011ferleri D\u00f6n\u00fc\u015ft\u00fcrme veya Filtreleme<\/h4>\n
map()<\/code>, filter()<\/code> gibi g\u00fc\u00e7l\u00fc dizi y\u00f6ntemlerini kullanarak \u00fczerinde \u00e7e\u015fitli i\u015flemler yapabilirsiniz.<\/p>\n\nconst studentScores = {\n math: 85,\n science: 92,\n history: 78,\n art: 95\n};\n\n\/\/ Sadece 90 ve \u00fczeri puanlar\u0131 al\nconst highScores = Object.values(studentScores).filter(score => score >= 90);\nconsole.log(Y\u00fcksek Puanlar: ${highScores}<\/code>); \/\/ \u00c7\u0131kt\u0131: Y\u00fcksek Puanlar: 92,95\n\n\/\/ T\u00fcm puanlar\u0131 5 puan art\u0131r\nconst updatedScores = Object.values(studentScores).map(score => score + 5);\nconsole.log(G\u00fcncellenmi\u015f Puanlar: ${updatedScores}<\/code>); \/\/ \u00c7\u0131kt\u0131: G\u00fcncellenmi\u015f Puanlar: 90,97,83,100\n<\/code><\/pre>\nObject.entries(): Anahtar-De\u011fer \u00c7iftlerine Eri\u015fmek<\/h2>\n
Object.entries()<\/code> y\u00f6ntemi, bir nesnenin kendi numaraland\u0131r\u0131labilir string anahtarl\u0131 \u00f6zelliklerinin [anahtar, de\u011fer]<\/code> \u00e7iftlerinden olu\u015fan bir dizi d\u00f6nd\u00fcr\u00fcr. Bu y\u00f6ntem, hem anahtarlara hem de de\u011ferlere ayn\u0131 anda eri\u015fmeniz gerekti\u011finde vazge\u00e7ilmezdir.<\/p>\nKullan\u0131m ve S\u00f6zdizimi<\/h3>\n
Object.entries()<\/code> y\u00f6ntemi, arg\u00fcman olarak bir nesne al\u0131r ve her biri [anahtar, de\u011fer]<\/code> \u015feklinde iki elemanl\u0131 bir dizi olan dizilerden olu\u015fan yeni bir dizi d\u00f6nd\u00fcr\u00fcr.<\/p>\n\nconst car = {\n brand: \"Toyota\",\n model: \"Corolla\",\n year: 2020\n};\n\nconst carEntries = Object.entries(car);\nconsole.log(carEntries);\n\/* \u00c7\u0131kt\u0131:\n[\n [\"brand\", \"Toyota\"],\n [\"model\", \"Corolla\"],\n [\"year\", 2020]\n]\n*\/\n<\/code><\/pre>\nObject.entries()<\/code>‘nin d\u00f6nd\u00fcrd\u00fc\u011f\u00fc bu yap\u0131, for...of<\/code> d\u00f6ng\u00fcs\u00fc ile birlikte dizi destructuring (yap\u0131 bozma) kullanarak kolayca iterate edilebilir.<\/p>\nPratik Kullan\u0131m Senaryolar\u0131<\/h3>\n
Object.entries()<\/code>, nesne verileri \u00fczerinde daha karma\u015f\u0131k i\u015flemler yapmak i\u00e7in idealdir:<\/p>\n1. Anahtar ve De\u011ferleri Birlikte \u0130\u015fleme (for…of ile)<\/h4>\n
for...of<\/code> d\u00f6ng\u00fcs\u00fc ile destructuring en zarif \u00e7\u00f6z\u00fcm\u00fc sunar.<\/p>\n\nconst userInfo = {\n firstName: \"John\",\n lastName: \"Doe\",\n email: \"john.doe@example.com\"\n};\n\nfor (const [key, value] of Object.entries(userInfo)) {\n console.log(${key}: ${value}<\/code>);\n}\n\/* \u00c7\u0131kt\u0131:\nfirstName: John\nlastName: Doe\nemail: john.doe@example.com\n*\/\n<\/code><\/pre>\n2. Nesneyi Filtreleme veya Yeniden Olu\u015fturma<\/h4>\n
Object.entries()<\/code>, filter()<\/code> ve Object.fromEntries()<\/code> y\u00f6ntemlerini birle\u015ftirebilirsiniz.<\/p>\n\nconst productConfig = {\n name: \"Widget\",\n version: \"1.0.0\",\n isActive: true,\n _internalId: \"abc123xyz\" \/\/ Dahili bir \u00f6zellik\n};\n\n\/\/ Sadece g\u00f6r\u00fcnen (public) \u00f6zellikleri i\u00e7eren yeni bir nesne olu\u015ftur\nconst publicConfig = Object.fromEntries(\n Object.entries(productConfig).filter(([key, value]) => !key.startsWith('_'))\n);\nconsole.log(publicConfig); \/\/ \u00c7\u0131kt\u0131: { name: \"Widget\", version: \"1.0.0\", isActive: true }\n\n\/\/ Sadece string de\u011ferleri i\u00e7eren yeni bir nesne olu\u015ftur\nconst stringValuesOnly = Object.fromEntries(\n Object.entries(productConfig).filter(([key, value]) => typeof value === 'string')\n);\nconsole.log(stringValuesOnly); \/\/ \u00c7\u0131kt\u0131: { name: \"Widget\", version: \"1.0.0\", _internalId: \"abc123xyz\" }\n<\/code><\/pre>\nObject.fromEntries()<\/code>, Object.entries()<\/code>‘nin tersidir ve bir anahtar-de\u011fer \u00e7iftleri dizisinden yeni bir nesne olu\u015fturur. Bu ikili, nesne d\u00f6n\u00fc\u015f\u00fcmleri i\u00e7in \u00e7ok g\u00fc\u00e7l\u00fc bir kombinasyondur.<\/p>\n3. Nesneyi Map Yap\u0131s\u0131na D\u00f6n\u00fc\u015ft\u00fcrme<\/h4>\n
Map<\/code> veri yap\u0131s\u0131, anahtar-de\u011fer \u00e7iftlerini saklamak i\u00e7in tasarlanm\u0131\u015ft\u0131r ve nesnelerden farkl\u0131 olarak anahtarlar\u0131n s\u0131ras\u0131n\u0131 garanti eder ve herhangi bir veri t\u00fcr\u00fcn\u00fc anahtar olarak kullanabilir. Bir nesneyi kolayca Map<\/code>‘e d\u00f6n\u00fc\u015ft\u00fcrmek i\u00e7in Object.entries()<\/code>‘i kullanabilirsiniz.<\/p>\n\nconst settings = {\n theme: \"dark\",\n notifications: true,\n language: \"en\"\n};\n\nconst settingsMap = new Map(Object.entries(settings));\nconsole.log(settingsMap); \/\/ \u00c7\u0131kt\u0131: Map(3) { 'theme' => 'dark', 'notifications' => true, 'language' => 'en' }\nconsole.log(settingsMap.get('theme')); \/\/ \u00c7\u0131kt\u0131: dark\n<\/code><\/pre>\nObject.values() ve Object.entries() Kar\u015f\u0131la\u015ft\u0131rmas\u0131: Ne Zaman Hangisini Kullanmal\u0131?<\/h2>\n
Object.values()<\/code> ne zaman kullan\u0131l\u0131r?<\/strong><\/p>\n\n
Object.entries()<\/code> ne zaman kullan\u0131l\u0131r?<\/strong><\/p>\n\n
Object.fromEntries()<\/code> ile birlikte).<\/li>\nMap<\/code>) d\u00f6n\u00fc\u015ft\u00fcrmek istedi\u011finizde.<\/li>\ndata-*<\/code>) dinamik olarak i\u015flerken.<\/li>\n<\/ul>\nDi\u011fer Nesne \u0130terasyon Y\u00f6ntemleriyle \u0130li\u015fkisi<\/h3>\n
Object.keys()<\/code> ile benzer bir amaca hizmet eder ancak farkl\u0131 \u00e7\u0131kt\u0131lar sunar:<\/p>\n\n
Object.keys(obj)<\/code>: Nesnenin anahtarlar\u0131n\u0131 i\u00e7eren bir dizi d\u00f6nd\u00fcr\u00fcr.<\/li>\nObject.values(obj)<\/code>: Nesnenin de\u011ferlerini i\u00e7eren bir dizi d\u00f6nd\u00fcr\u00fcr.<\/li>\nObject.entries(obj)<\/code>: Nesnenin [anahtar, de\u011fer]<\/code> \u00e7iftlerini i\u00e7eren bir dizi d\u00f6nd\u00fcr\u00fcr.<\/li>\n<\/ul>\nfor...in<\/code> d\u00f6ng\u00fcs\u00fcne g\u00f6re bu modern y\u00f6ntemlerin avantajlar\u0131 \u015funlard\u0131r:<\/p>\n\n
for...in<\/code> kullan\u0131rken hasOwnProperty()<\/code> ile kontrol yapmak gerekebilir.<\/li>\nfor...in<\/code> d\u00f6ng\u00fcs\u00fcnde bu garanti daha zay\u0131ft\u0131r.<\/li>\nmap()<\/code>, filter()<\/code>, reduce()<\/code> gibi g\u00fc\u00e7l\u00fc dizi y\u00f6ntemleriyle zincirlenebilirler, bu da daha fonksiyonel ve okunabilir kod yazmay\u0131 sa\u011flar.<\/li>\n<\/ul>\nSonu\u00e7 ve S\u0131k\u00e7a Sorulan Sorular (SSS)<\/h2>\n
Object.values()<\/code> ve Object.entries()<\/code>, modern JavaScript geli\u015ftirmenin vazge\u00e7ilmez ara\u00e7lar\u0131d\u0131r. Nesnelerin i\u00e7eri\u011fini daha esnek, g\u00fcvenli ve okunabilir bir \u015fekilde manip\u00fcle etmemizi sa\u011flarlar. Hangi y\u00f6ntemi kullanaca\u011f\u0131n\u0131z, anahtarlara m\u0131, de\u011ferlere mi yoksa her ikisine birden mi ihtiyac\u0131n\u0131z oldu\u011funa ba\u011fl\u0131d\u0131r. Bu y\u00f6ntemleri etkin bir \u015fekilde kullanarak, JavaScript kodunuzu daha fonksiyonel ve s\u00fcrd\u00fcr\u00fclebilir hale getirebilirsiniz.<\/p>\nS\u0131k\u00e7a Sorulan Sorular (SSS)<\/h3>\n
H3 Object.values() ve Object.entries() hangi JavaScript versiyonunda tan\u0131t\u0131ld\u0131?<\/h3>\n
H3 Bu y\u00f6ntemler sadece nesnenin kendi \u00f6zelliklerini mi d\u00f6nd\u00fcr\u00fcr, yoksa prototip zincirindekileri de mi?<\/h3>\n
for...in<\/code> d\u00f6ng\u00fcs\u00fcne g\u00f6re \u00f6nemli bir g\u00fcvenlik ve \u00f6ng\u00f6r\u00fclebilirlik avantaj\u0131d\u0131r.<\/p>\nH3 D\u00f6nd\u00fcr\u00fclen dizideki \u00f6zelliklerin s\u0131ras\u0131 garanti mi?<\/h3>\n
Object.keys()<\/code>, Object.values()<\/code> ve Object.entries()<\/code> taraf\u0131ndan eklenme s\u0131ras\u0131na g\u00f6re d\u00f6nd\u00fcr\u00fclece\u011fini garanti eder. Say\u0131sal anahtarlar her zaman \u00f6nce, artan s\u0131rada gelir.<\/p>\nH3 Sembol anahtarlar\u0131n\u0131 da d\u00f6nd\u00fcr\u00fcrler mi?<\/h3>\n
Object.values()<\/code> ve Object.entries()<\/code> sadece string anahtarl\u0131<\/strong> \u00f6zellikleri d\u00f6nd\u00fcr\u00fcr. Sembol anahtarl\u0131 \u00f6zellikleri almak i\u00e7in Object.getOwnPropertySymbols()<\/code> y\u00f6ntemini kullanman\u0131z gerekir.<\/p>\nH3 Performans a\u00e7\u0131s\u0131ndan Object.values()\/entries() ile for…in aras\u0131nda b\u00fcy\u00fck bir fark var m\u0131?<\/h3>\n
H3 Neden for…in yerine Object.values() veya Object.entries() kullanmal\u0131y\u0131m?<\/h3>\n
Object.values()<\/code> ve Object.entries()<\/code>, for...in<\/code> d\u00f6ng\u00fcs\u00fcne g\u00f6re birka\u00e7 \u00f6nemli avantaj sunar:<\/p>\n\n
map()<\/code>, filter()<\/code>, reduce()<\/code> gibi dizi y\u00f6ntemlerini do\u011frudan kullanabilirsiniz.<\/li>\n