{"id":37685,"date":"2026-01-12T13:31:10","date_gmt":"2026-01-12T10:31:10","guid":{"rendered":"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/"},"modified":"2026-01-12T13:31:10","modified_gmt":"2026-01-12T10:31:10","slug":"javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak","status":"publish","type":"post","link":"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/","title":{"rendered":"JavaScript Kapan\u0131\u015flar\u0131 ile Durumlu Fonksiyonlar\u0131 Anlamak"},"content":{"rendered":"<h2>JavaScript Kapan\u0131\u015flar\u0131 ile Durumlu Fonksiyonlar\u0131 Anlamak<\/h2>\n<p>Modern web uygulamalar\u0131 geli\u015ftirirken, veriyi y\u00f6netmek ve uygulaman\u0131n farkl\u0131 b\u00f6l\u00fcmleri aras\u0131nda tutarl\u0131l\u0131\u011f\u0131 sa\u011flamak kritik bir \u00f6neme sahiptir. Bu ba\u011flamda &#8220;durum&#8221; kavram\u0131, bir uygulaman\u0131n veya fonksiyonun belirli bir andaki verilerini ifade eder. JavaScript&#8217;te, fonksiyonlar\u0131n kendi i\u00e7lerinde bir durumu saklamas\u0131n\u0131 sa\u011flayan g\u00fc\u00e7l\u00fc bir mekanizma olan &#8220;kapan\u0131\u015flar&#8221; (closures) sayesinde, daha mod\u00fcler, okunabilir ve y\u00f6netilebilir kodlar yazabiliriz. Bu makalede, JavaScript kapan\u0131\u015flar\u0131n\u0131n ne oldu\u011funu, nas\u0131l \u00e7al\u0131\u015ft\u0131\u011f\u0131n\u0131 ve bu mekanizma arac\u0131l\u0131\u011f\u0131yla nas\u0131l &#8220;durumlu fonksiyonlar&#8221; olu\u015fturabilece\u011fimizi detayl\u0131 bir \u015fekilde inceleyece\u011fiz. Amac\u0131m\u0131z, kapan\u0131\u015flar\u0131n g\u00fcc\u00fcn\u00fc anlayarak daha etkili ve s\u00fcrd\u00fcr\u00fclebilir JavaScript kodlar\u0131 yazman\u0131za yard\u0131mc\u0131 olmakt\u0131r.<\/p>\n<h3>Durum (State) Nedir ve Neden \u00d6nemlidir?<\/h3>\n<p>Programlamada &#8220;durum&#8221;, bir program\u0131n veya bile\u015fenin belirli bir anda sahip oldu\u011fu veriler k\u00fcmesini ifade eder. Bu veriler, bir kullan\u0131c\u0131n\u0131n sepetindeki \u00fcr\u00fcnlerden bir formun giri\u015f de\u011ferlerine, bir animasyonun mevcut pozisyonundan bir veritaban\u0131 ba\u011flant\u0131s\u0131n\u0131n a\u00e7\u0131k olup olmad\u0131\u011f\u0131na kadar her \u015feyi i\u00e7erebilir. Durum y\u00f6netimi, yaz\u0131l\u0131m geli\u015ftirmenin en temel ve \u00e7o\u011fu zaman en karma\u015f\u0131k y\u00f6nlerinden biridir.<\/p>\n<h4>Programlamada Durum Kavram\u0131<\/h4>\n<p>Bir fonksiyonun veya nesnenin, \u00e7a\u011fr\u0131lar aras\u0131nda veya zaman i\u00e7inde de\u011ferlerini koruyabilen de\u011fi\u015fkenlere sahip olmas\u0131 durum kavram\u0131n\u0131n merkezindedir. \u00d6rne\u011fin, bir saya\u00e7 fonksiyonu her \u00e7a\u011fr\u0131ld\u0131\u011f\u0131nda mevcut say\u0131y\u0131 art\u0131r\u0131p bu de\u011feri hat\u0131rl\u0131yorsa, bu fonksiyon durumlu bir fonksiyondur. Durumsuz (stateless) fonksiyonlar ise her \u00e7a\u011fr\u0131ld\u0131\u011f\u0131nda ayn\u0131 girdiler i\u00e7in her zaman ayn\u0131 \u00e7\u0131kt\u0131y\u0131 verir ve \u00f6nceki \u00e7a\u011fr\u0131lar\u0131ndan hi\u00e7bir bilgi saklamaz.<\/p>\n<h4>Durum Y\u00f6netiminin Zorluklar\u0131<\/h4>\n<p>Durumun do\u011fru bir \u015fekilde y\u00f6netilmesi, \u00f6zellikle b\u00fcy\u00fck ve karma\u015f\u0131k uygulamalarda bir\u00e7ok zorlu\u011fu beraberinde getirir:<\/p>\n<ul>\n<li><strong>Tutarl\u0131l\u0131k:<\/strong> Durumun farkl\u0131 yerlerde g\u00fcncellenmesi, tutars\u0131z verilere yol a\u00e7abilir.<\/li>\n<li><strong>Yan Etkiler:<\/strong> Bir fonksiyonun durumu de\u011fi\u015ftirmesi, uygulaman\u0131n ba\u015fka bir yerinde beklenmedik davran\u0131\u015flara neden olabilir.<\/li>\n<li><strong>Test Edilebilirlik:<\/strong> Durumlu fonksiyonlar\u0131 test etmek, durumun ba\u015flang\u0131\u00e7 ko\u015fullar\u0131n\u0131 ayarlamay\u0131 gerektirdi\u011fi i\u00e7in daha karma\u015f\u0131k olabilir.<\/li>\n<li><strong>Hata Ay\u0131klama:<\/strong> Durumun ne zaman ve nerede de\u011fi\u015fti\u011fini izlemek zor olabilir.<\/li>\n<\/ul>\n<h4>Durumlu ve Durumsuz Fonksiyonlar Aras\u0131ndaki Fark<\/h4>\n<p>Bu iki fonksiyon t\u00fcr\u00fcn\u00fc basit bir \u00f6rnekle a\u00e7\u0131klayal\u0131m:<\/p>\n<pre><code class=\"language-javascript\">\/\/ Durumsuz Fonksiyon\nfunction toplama(a, b) {\n  return a + b;\n}\nconsole.log(toplama(2, 3)); \/\/ Her zaman 5\n\n\/\/ Durumlu Fonksiyon (kapan\u0131\u015f kullanmadan, global de\u011fi\u015fkenle k\u00f6t\u00fc \u00f6rnek)\nlet sayac = 0;\nfunction artir() {\n  sayac++;\n  return sayac;\n}\nconsole.log(artir()); \/\/ 1\nconsole.log(artir()); \/\/ 2\n<\/pre>\n<p><\/code><\/p>\n<p>Yukar\u0131daki <code>artir<\/code> fonksiyonu, global bir de\u011fi\u015fkeni kullanarak durum saklar. Bu, global de\u011fi\u015fkenlerin kirlenmesi ve beklenmedik yan etkiler a\u00e7\u0131s\u0131ndan iyi bir pratik de\u011fildir. \u0130\u015fte bu noktada kapan\u0131\u015flar devreye girer.<\/p>\n<h3>JavaScript Kapan\u0131\u015flar\u0131na Derin Bir Bak\u0131\u015f<\/h3>\n<p>Kapan\u0131\u015flar (closures), JavaScript'in en g\u00fc\u00e7l\u00fc ve en s\u0131k yanl\u0131\u015f anla\u015f\u0131lan \u00f6zelliklerinden biridir. Bir fonksiyonun, tan\u0131mland\u0131\u011f\u0131 lexical (s\u00f6zc\u00fcksel) kapsam\u0131 hat\u0131rlayabilmesi ve bu kapsama eri\u015febilmesi durumudur, hatta o kapsam art\u0131k mevcut olmasa bile.<\/p>\n<h4>Kapan\u0131\u015f Nedir? Temel Tan\u0131m<\/h4>\n<p>MDN Web Docs'a g\u00f6re, \"bir kapan\u0131\u015f, d\u0131\u015f fonksiyonun y\u00fcr\u00fct\u00fclmesi tamamland\u0131ktan sonra bile d\u0131\u015f fonksiyonun de\u011fi\u015fkenlerine eri\u015febilen bir i\u00e7 fonksiyondur.\" Daha basit bir ifadeyle, bir fonksiyon ba\u015fka bir fonksiyonun i\u00e7inde tan\u0131mland\u0131\u011f\u0131nda, i\u00e7teki fonksiyon d\u0131\u015ftaki fonksiyonun de\u011fi\u015fkenlerine ve parametrelerine eri\u015febilir. Bu eri\u015fim, d\u0131\u015f fonksiyonun \u00e7al\u0131\u015fmas\u0131 bittikten sonra bile devam eder.<\/p>\n<h4>Lexical Scope ve Kapan\u0131\u015f \u0130li\u015fkisi<\/h4>\n<p>JavaScript'te kapsam (scope), de\u011fi\u015fkenlerin nerede tan\u0131mland\u0131\u011f\u0131na g\u00f6re belirlenir. Buna \"lexical scope\" (s\u00f6zc\u00fcksel kapsam) denir, \u00e7\u00fcnk\u00fc de\u011fi\u015fkenlerin eri\u015filebilirli\u011fi kodun yaz\u0131ld\u0131\u011f\u0131 yere g\u00f6re belirlenir. Bir fonksiyon, tan\u0131mland\u0131\u011f\u0131 yerdeki t\u00fcm d\u0131\u015f kapsamlar\u0131 \"hat\u0131rlar\". Kapan\u0131\u015flar, bu lexical scope'un do\u011fal bir sonucudur.<\/p>\n<pre><code class=\"language-javascript\">function disFonksiyon(disDegisken) {\n  return function icFonksiyon(icDegisken) {\n    console.log('D\u0131\u015f de\u011fi\u015fken:', disDegisken);\n    console.log('\u0130\u00e7 de\u011fi\u015fken:', icDegisken);\n  };\n}\n\nconst benimKapanisim = disFonksiyon('Merhaba');\nbenimKapanisim('D\u00fcnya'); \/\/ D\u0131\u015f de\u011fi\u015fken: Merhaba, \u0130\u00e7 de\u011fi\u015fken: D\u00fcnya\n\/\/ disFonksiyon \u00e7al\u0131\u015fmay\u0131 bitirmi\u015f olsa da, icFonksiyon hala disDegisken'e eri\u015febilir.\n<\/pre>\n<p><\/code><\/p>\n<p>Yukar\u0131daki \u00f6rnekte, <code>icFonksiyon<\/code>, <code>disFonksiyon<\/code>'un <code>disDegisken<\/code>'ini \"kapat\u0131r\" (captures). <code>disFonksiyon<\/code> \u00e7a\u011fr\u0131s\u0131 tamamland\u0131\u011f\u0131nda ve <code>benimKapanisim<\/code> de\u011fi\u015fkenine atand\u0131\u011f\u0131nda bile, <code>icFonksiyon<\/code> hala <code>disDegisken<\/code>'e eri\u015febilir.<\/p>\n<h4>Kapan\u0131\u015flar\u0131n \u00c7al\u0131\u015fma Prensibi (Bellek Referanslar\u0131)<\/h4>\n<p>Bir kapan\u0131\u015f olu\u015fturuldu\u011funda, i\u00e7 fonksiyon, d\u0131\u015f fonksiyonun kapsam\u0131ndaki de\u011fi\u015fkenlere bir referans tutar. Bu, de\u011fi\u015fkenin de\u011ferinin kopyalanmad\u0131\u011f\u0131, aksine i\u00e7 fonksiyonun o bellek konumuna i\u015faret etti\u011fi anlam\u0131na gelir. Bu nedenle, d\u0131\u015f fonksiyonun de\u011fi\u015fkeni daha sonra de\u011fi\u015firse, i\u00e7 fonksiyon bu g\u00fcncel de\u011feri g\u00f6r\u00fcr. Bu mekanizma, durumun saklanmas\u0131 i\u00e7in temel olu\u015fturur.<\/p>\n<h3>Kapan\u0131\u015flar ile Durum Saklama Mekanizmas\u0131<\/h3>\n<p>Kapan\u0131\u015flar, fonksiyonlar\u0131n kendi \u00f6zel durumlar\u0131n\u0131 d\u0131\u015far\u0131dan eri\u015filemez bir \u015fekilde saklamalar\u0131n\u0131 sa\u011flayarak g\u00fc\u00e7l\u00fc bir veri gizlili\u011fi (encapsulation) mekanizmas\u0131 sunar.<\/p>\n<h4>\u00d6zel De\u011fi\u015fkenler Olu\u015fturma<\/h4>\n<p>Bir fonksiyonun i\u00e7inde tan\u0131mlanan ve d\u0131\u015far\u0131dan do\u011frudan eri\u015filemeyen de\u011fi\u015fkenler, kapan\u0131\u015flar arac\u0131l\u0131\u011f\u0131yla \"\u00f6zel\" hale getirilebilir. Bu de\u011fi\u015fkenlere yaln\u0131zca kapan\u0131\u015f i\u00e7indeki di\u011fer fonksiyonlar eri\u015febilir ve onlar\u0131 manip\u00fcle edebilir.<\/p>\n<pre><code class=\"language-javascript\">function sayacOlusturucu() {\n  let sayi = 0; \/\/ Bu de\u011fi\u015fken \"\u00f6zel\"dir, d\u0131\u015far\u0131dan do\u011frudan eri\u015filemez\n\n  return {\n    arttir: function() {\n      sayi++;\n      return sayi;\n    },\n    azalt: function() {\n      sayi--;\n      return sayi;\n    },\n    degeriAl: function() {\n      return sayi;\n    }\n  };\n}\n\nconst benimSayacim = sayacOlusturucu();\nconsole.log(benimSayacim.arttir()); \/\/ 1\nconsole.log(benimSayacim.arttir()); \/\/ 2\nconsole.log(benimSayacim.degeriAl()); \/\/ 2\n\n\/\/ console.log(benimSayacim.sayi); \/\/ undefined - sayi de\u011fi\u015fkenine do\u011frudan eri\u015filemez\n<\/pre>\n<p><\/code><\/p>\n<p>Bu \u00f6rnekte, <code>sayi<\/code> de\u011fi\u015fkeni yaln\u0131zca <code>sayacOlusturucu<\/code> fonksiyonunun d\u00f6nd\u00fcrd\u00fc\u011f\u00fc nesnedeki <code>arttir<\/code>, <code>azalt<\/code> ve <code>degeriAl<\/code> metotlar\u0131 arac\u0131l\u0131\u011f\u0131yla manip\u00fcle edilebilir. Bu, durumun g\u00fcvenli ve kontroll\u00fc bir \u015fekilde y\u00f6netilmesini sa\u011flar.<\/p>\n<h4>Mod\u00fcl Deseni ve Kapan\u0131\u015flar<\/h4>\n<p>Kapan\u0131\u015flar, JavaScript'teki Mod\u00fcl Deseni'nin temelini olu\u015fturur. Mod\u00fcl deseni, bir dizi ilgili fonksiyon ve de\u011fi\u015fkeni tek bir birim (mod\u00fcl) i\u00e7inde grupland\u0131rmak ve yaln\u0131zca belirli aray\u00fczleri d\u0131\u015far\u0131ya a\u00e7mak i\u00e7in kullan\u0131l\u0131r. Bu, global kapsam\u0131 kirletmeden kodun mod\u00fclerli\u011fini art\u0131r\u0131r.<\/p>\n<pre><code class=\"language-javascript\">const HesaplayiciModulu = (function() {\n  let toplam = 0; \/\/ \u00d6zel durum de\u011fi\u015fkeni\n\n  function ekle(sayi) {\n    toplam += sayi;\n  }\n\n  function cikar(sayi) {\n    toplam -= sayi;\n  }\n\n  function guncelToplamiAl() {\n    return toplam;\n  }\n\n  return {\n    ekle: ekle,\n    cikar: cikar,\n    toplamiAl: guncelToplamiAl\n  };\n})();\n\nHesaplayiciModulu.ekle(10);\nHesaplayiciModulu.cikar(3);\nconsole.log(HesaplayiciModulu.toplamiAl()); \/\/ 7\n\/\/ console.log(HesaplayiciModulu.toplam); \/\/ undefined\n<\/pre>\n<p><\/code><\/p>\n<p>Immediately Invoked Function Expression (IIFE) kullanarak olu\u015fturulan bu mod\u00fcl, <code>toplam<\/code> de\u011fi\u015fkenini \u00f6zel tutar ve yaln\u0131zca <code>ekle<\/code>, <code>cikar<\/code> ve <code>toplamiAl<\/code> metotlar\u0131 arac\u0131l\u0131\u011f\u0131yla eri\u015fim sa\u011flar.<\/p>\n<h4>\u00d6rnek: Basit Bir Saya\u00e7 Fonksiyonu<\/h4>\n<p>Yukar\u0131daki \u00f6rnekler kapan\u0131\u015flar\u0131n nas\u0131l durum saklad\u0131\u011f\u0131n\u0131 g\u00f6sterse de, daha basit bir kapan\u0131\u015f \u00f6rne\u011fi ile konuyu peki\u015ftirelim:<\/p>\n<pre><code class=\"language-javascript\">function createCounter() {\n  let count = 0; \/\/ Durum: Bu de\u011fi\u015fken kapan\u0131\u015f taraf\u0131ndan korunur.\n\n  return function() {\n    count++;\n    return count;\n  };\n}\n\nconst counter1 = createCounter();\nconsole.log(counter1()); \/\/ 1\nconsole.log(counter1()); \/\/ 2\n\nconst counter2 = createCounter(); \/\/ Yeni bir saya\u00e7 \u00f6rne\u011fi, kendi durumuna sahip\nconsole.log(counter2()); \/\/ 1\nconsole.log(counter1()); \/\/ 3 (counter1 hala kendi durumunu koruyor)\n<\/pre>\n<p><\/code><\/p>\n<p><code>createCounter<\/code> fonksiyonu her \u00e7a\u011fr\u0131ld\u0131\u011f\u0131nda, <code>count<\/code> de\u011fi\u015fkeninin yeni bir kopyas\u0131n\u0131 i\u00e7eren yeni bir kapan\u0131\u015f olu\u015fturur. Bu, her bir saya\u00e7 \u00f6rne\u011finin birbirinden ba\u011f\u0131ms\u0131z olarak kendi durumunu y\u00f6netmesini sa\u011flar.<\/p>\n<h3>Ger\u00e7ek D\u00fcnya Senaryolar\u0131nda Durumlu Fonksiyonlar<\/h3>\n<p>Kapan\u0131\u015flar arac\u0131l\u0131\u011f\u0131yla olu\u015fturulan durumlu fonksiyonlar, JavaScript uygulamalar\u0131nda bir\u00e7ok pratik kullan\u0131m alan\u0131na sahiptir.<\/p>\n<h4>Veri Y\u00f6netimi ve \u00d6nbellekleme<\/h4>\n<p>Kapan\u0131\u015flar, pahal\u0131 hesaplamalar\u0131n sonu\u00e7lar\u0131n\u0131 \u00f6nbelle\u011fe almak veya belirli verilere eri\u015fimi y\u00f6netmek i\u00e7in kullan\u0131labilir.<\/p>\n<pre><code class=\"language-javascript\">function memoize(fn) {\n  const cache = {}; \/\/ \u00d6zel \u00f6nbellek\n\n  return function(...args) {\n    const key = JSON.stringify(args);\n    if (cache[key]) {\n      console.log('\u00d6nbellekten \u00e7ekildi:', key);\n      return cache[key];\n    } else {\n      console.log('Hesapland\u0131:', key);\n      const result = fn(...args);\n      cache[key] = result;\n      return result;\n    }\n  };\n}\n\nfunction pahaliHesaplama(a, b) {\n  \/\/ \u00c7ok zaman alan bir i\u015flem oldu\u011funu varsayal\u0131m\n  return a * b;\n}\n\nconst memoizedHesaplama = memoize(pahaliHesaplama);\n\nconsole.log(memoizedHesaplama(2, 3)); \/\/ Hesapland\u0131: [2,3], 6\nconsole.log(memoizedHesaplama(2, 3)); \/\/ \u00d6nbellekten \u00e7ekildi: [2,3], 6\nconsole.log(memoizedHesaplama(4, 5)); \/\/ Hesapland\u0131: [4,5], 20\n<\/pre>\n<p><\/code><\/p>\n<p>Bu <code>memoize<\/code> fonksiyonu, bir fonksiyonun sonu\u00e7lar\u0131n\u0131 <code>cache<\/code> adl\u0131 \u00f6zel bir nesnede saklar. Ayn\u0131 arg\u00fcmanlarla tekrar \u00e7a\u011fr\u0131ld\u0131\u011f\u0131nda, sonucu \u00f6nbellekten d\u00f6nd\u00fcrerek performans\u0131 art\u0131r\u0131r.<\/p>\n<h4>Olay \u0130\u015fleyicileri ve UI Bile\u015fenleri<\/h4>\n<p>Web aray\u00fczlerinde, olay i\u015fleyicileri genellikle belirli bir bile\u015fenin durumuna eri\u015fmek veya bu durumu g\u00fcncellemek i\u00e7in kapan\u0131\u015flar\u0131 kullan\u0131r.<\/p>\n<pre><code class=\"language-javascript\">\/\/ HTML: <button id=\"toggleButton\">G\u00f6ster\/Gizle<\/button><div id=\"content\">\u0130\u00e7erik<\/div>\n\nfunction createToggleButton(buttonId, contentId) {\n  const button = document.getElementById(buttonId);\n  const content = document.getElementById(contentId);\n  let isVisible = true; \/\/ Durum: \u0130\u00e7eri\u011fin g\u00f6r\u00fcn\u00fcrl\u00fc\u011f\u00fc\n\n  button.addEventListener('click', function() {\n    isVisible = !isVisible; \/\/ Durumu g\u00fcncelle\n    content.style.display = isVisible ? 'block' : 'none';\n    button.textContent = isVisible ? 'Gizle' : 'G\u00f6ster';\n  });\n}\n\n\/\/ createToggleButton('toggleButton', 'content'); \/\/ Bu fonksiyonu DOM y\u00fcklendikten sonra \u00e7a\u011f\u0131r\u0131n\n<\/pre>\n<p><\/code><\/p>\n<p>Burada, <code>isVisible<\/code> de\u011fi\u015fkeni, <code>createToggleButton<\/code> fonksiyonunun d\u00f6nd\u00fcrd\u00fc\u011f\u00fc (asl\u0131nda do\u011frudan d\u00f6nd\u00fcrm\u00fcyor, event listener i\u00e7inde kullan\u0131l\u0131yor) anonim fonksiyon (olay i\u015fleyici) taraf\u0131ndan kapat\u0131l\u0131r. Her t\u0131klamada, bu durum g\u00fcncellenir ve UI buna g\u00f6re de\u011fi\u015fir.<\/p>\n<h4>Fabrika Fonksiyonlar\u0131 ve Nesne \u00dcretimi<\/h4>\n<p>Kapan\u0131\u015flar, belirli bir durumla \u00f6nceden yap\u0131land\u0131r\u0131lm\u0131\u015f nesneler \u00fcreten fabrika fonksiyonlar\u0131 olu\u015fturmak i\u00e7in idealdir.<\/p>\n<pre><code class=\"language-javascript\">function createProduct(name, price) {\n  let stock = 0; \/\/ \u00dcr\u00fcne \u00f6zel durum\n\n  return {\n    getName: () => name,\n    getPrice: () => price,\n    getStock: () => stock,\n    addStock: (quantity) => {\n      stock += quantity;\n      console.log(<code>${name} i\u00e7in stok eklendi. Yeni stok: ${stock}<\/code>);\n    },\n    sell: (quantity) => {\n      if (stock >= quantity) {\n        stock -= quantity;\n        console.log(<code>${name} sat\u0131ld\u0131. Kalan stok: ${stock}<\/code>);\n        return true;\n      } else {\n        console.log(<code>${name} i\u00e7in yeterli stok yok.<\/code>);\n        return false;\n      }\n    }\n  };\n}\n\nconst laptop = createProduct('Laptop', 1200);\nconst mouse = createProduct('Mouse', 25);\n\nlaptop.addStock(10); \/\/ Laptop i\u00e7in stok eklendi. Yeni stok: 10\nmouse.addStock(50);  \/\/ Mouse i\u00e7in stok eklendi. Yeni stok: 50\nlaptop.sell(2);      \/\/ Laptop sat\u0131ld\u0131. Kalan stok: 8\nmouse.sell(60);      \/\/ Mouse i\u00e7in yeterli stok yok.\n<\/pre>\n<p><\/code><\/p>\n<p>Her bir <code>createProduct<\/code> \u00e7a\u011fr\u0131s\u0131, kendi <code>stock<\/code> durumuna sahip ba\u011f\u0131ms\u0131z bir \u00fcr\u00fcn nesnesi d\u00f6nd\u00fcr\u00fcr. Bu, her \u00fcr\u00fcn\u00fcn stok bilgisini kendi i\u00e7inde izlemesini sa\u011flar.<\/p>\n<h3>Durumlu Fonksiyonlar\u0131n Avantajlar\u0131 ve Dezavantajlar\u0131<\/h3>\n<p>Kapan\u0131\u015flar arac\u0131l\u0131\u011f\u0131yla durumlu fonksiyonlar olu\u015fturmak bir\u00e7ok avantaj sunsa da, baz\u0131 potansiyel dezavantajlar\u0131 da g\u00f6z \u00f6n\u00fcnde bulundurmak \u00f6nemlidir.<\/p>\n<h4>Avantajlar: Veri Gizlili\u011fi, Mod\u00fclerlik, Kolay Y\u00f6netim<\/h4>\n<ul>\n<li><strong>Veri Gizlili\u011fi (Encapsulation):<\/strong> \u0130\u00e7 durum de\u011fi\u015fkenleri d\u0131\u015far\u0131dan do\u011frudan eri\u015filemez hale gelir, bu da veri b\u00fct\u00fcnl\u00fc\u011f\u00fcn\u00fc korur ve istenmeyen yan etkileri azalt\u0131r.<\/li>\n<li><strong>Mod\u00fclerlik:<\/strong> Kapan\u0131\u015flar, birbiriyle ili\u015fkili verileri ve davran\u0131\u015flar\u0131 tek bir birimde toplayarak daha mod\u00fcler ve yeniden kullan\u0131labilir kodlar yazmay\u0131 te\u015fvik eder.<\/li>\n<li><strong>Kolay Y\u00f6netim:<\/strong> Her fonksiyon \u00f6rne\u011fi kendi durumunu izledi\u011fi i\u00e7in, karma\u015f\u0131k global durum nesnelerine olan ba\u011f\u0131ml\u0131l\u0131\u011f\u0131 azalt\u0131r.<\/li>\n<li><strong>Fabrika Fonksiyonlar\u0131:<\/strong> Belirli bir durumla \u00f6nceden yap\u0131land\u0131r\u0131lm\u0131\u015f birden fazla benzer nesne veya fonksiyon \u00f6rne\u011fi olu\u015fturmak i\u00e7in idealdir.<\/li>\n<\/ul>\n<h4>Dezavantajlar: Bellek T\u00fcketimi, Yan Etkiler, Test Edilebilirlik<\/h4>\n<ul>\n<li><strong>Bellek T\u00fcketimi:<\/strong> Her kapan\u0131\u015f, kendi lexical kapsam\u0131ndaki de\u011fi\u015fkenlere referans tuttu\u011fu i\u00e7in, bu de\u011fi\u015fkenler \u00e7\u00f6p toplay\u0131c\u0131 (garbage collector) taraf\u0131ndan temizlenmeyebilir. \u00c7ok say\u0131da kapan\u0131\u015f olu\u015fturmak veya kapan\u0131\u015flar\u0131n i\u00e7inde b\u00fcy\u00fck nesneler tutmak bellek s\u0131z\u0131nt\u0131lar\u0131na yol a\u00e7abilir.<\/li>\n<li><strong>Yan Etkiler:<\/strong> Durumlu fonksiyonlar, i\u00e7 durumlar\u0131n\u0131 de\u011fi\u015ftirdikleri i\u00e7in yan etkilere sahiptir. Bu yan etkiler, dikkatli y\u00f6netilmezse uygulaman\u0131n davran\u0131\u015f\u0131n\u0131 tahmin etmeyi zorla\u015ft\u0131rabilir.<\/li>\n<li><strong>Test Edilebilirlik:<\/strong> \u0130\u00e7 durumu olan fonksiyonlar\u0131 test etmek, durumun her test senaryosu i\u00e7in do\u011fru bir \u015fekilde ayarlanmas\u0131n\u0131 gerektirdi\u011fi i\u00e7in daha karma\u015f\u0131k olabilir.<\/li>\n<\/ul>\n<h4>En \u0130yi Uygulamalar ve Dikkat Edilmesi Gerekenler<\/h4>\n<ul>\n<li><strong>Gereksiz Kapan\u0131\u015flardan Ka\u00e7\u0131n\u0131n:<\/strong> Sadece duruma ihtiyac\u0131n\u0131z oldu\u011funda kapan\u0131\u015flar\u0131 kullan\u0131n. Durumsuz fonksiyonlar genellikle daha basit ve daha kolay test edilebilir.<\/li>\n<li><strong>Bellek Kullan\u0131m\u0131n\u0131 \u0130zleyin:<\/strong> \u00d6zellikle uzun \u00f6m\u00fcrl\u00fc kapan\u0131\u015flar veya d\u00f6ng\u00fcler i\u00e7inde olu\u015fturulan kapan\u0131\u015flar i\u00e7in bellek kullan\u0131m\u0131na dikkat edin.<\/li>\n<li><strong>Durumu Net Tan\u0131mlay\u0131n:<\/strong> Bir kapan\u0131\u015f\u0131n hangi durumu y\u00f6netti\u011fini ve bu durumun nas\u0131l de\u011fi\u015fti\u011fini a\u00e7\u0131k\u00e7a belgeleyin.<\/li>\n<li><strong>\u0130\u015flevselli\u011fi S\u0131n\u0131rlay\u0131n:<\/strong> Bir kapan\u0131\u015f\u0131n \u00e7ok fazla sorumlulu\u011fu olmamal\u0131d\u0131r. Tek bir sorumluluk ilkesine (Single Responsibility Principle) uymaya \u00e7al\u0131\u015f\u0131n.<\/li>\n<\/ul>\n<h3>Alternatif Durum Y\u00f6netimi Yakla\u015f\u0131mlar\u0131 (K\u0131sa Bir Bak\u0131\u015f)<\/h3>\n<p>JavaScript ekosisteminde durum y\u00f6netimi i\u00e7in kapan\u0131\u015flar d\u0131\u015f\u0131nda bir\u00e7ok ba\u015fka yakla\u015f\u0131m da bulunmaktad\u0131r. Bu yakla\u015f\u0131mlar genellikle daha b\u00fcy\u00fck ve karma\u015f\u0131k uygulamalar i\u00e7in tasarlanm\u0131\u015ft\u0131r.<\/p>\n<h4>Global Durum Y\u00f6netimi (Redux, Zustand)<\/h4>\n<p>React gibi UI k\u00fct\u00fcphaneleriyle birlikte kullan\u0131lan Redux, Zustand, Vuex gibi k\u00fct\u00fcphaneler, uygulaman\u0131n durumunu tek bir merkezi yerde (store) tutar. Bu, durumun tahmin edilebilirli\u011fini art\u0131r\u0131r ve b\u00fcy\u00fck uygulamalarda durumu izlemeyi kolayla\u015ft\u0131r\u0131r. Ancak, kurulum ve \u00f6\u011frenme e\u011frileri daha dik olabilir.<\/p>\n<h4>React Hooks (useState, useReducer)<\/h4>\n<p>React Hooks, fonksiyonel bile\u015fenlerde durum ve yan etkileri y\u00f6netmek i\u00e7in modern bir yakla\u015f\u0131md\u0131r. <code>useState<\/code>, bir bile\u015fenin kendi durumunu y\u00f6netmesini sa\u011flarken, <code>useReducer<\/code> daha karma\u015f\u0131k durum mant\u0131klar\u0131 i\u00e7in kullan\u0131l\u0131r. Bu hook'lar asl\u0131nda JavaScript kapan\u0131\u015flar\u0131n\u0131n temel prensiplerini kullanarak \u00e7al\u0131\u015f\u0131r, ancak React \u00e7at\u0131s\u0131 i\u00e7inde daha soyut bir aray\u00fcz sunar.<\/p>\n<pre><code class=\"language-javascript\">\/\/ React'te useState hook'u ile durum y\u00f6netimi\nimport React, { useState } from 'react';\n\nfunction Counter() {\n  const [count, setCount] = useState(0); \/\/ count durumu ve onu g\u00fcncelleyen fonksiyon\n\n  return (\n    <div>\n      <p>Saya\u00e7: {count}<\/p>\n      <button onClick={() => setCount(count + 1)}>Art\u0131r<\/button>\n    <\/div>\n  );\n}\n<\/pre>\n<p><\/code><\/p>\n<p>Yukar\u0131daki \u00f6rnekte <code>setCount<\/code> fonksiyonu, <code>count<\/code> de\u011fi\u015fkenini kapat\u0131r ve her \u00e7a\u011fr\u0131ld\u0131\u011f\u0131nda bu durumu g\u00fcnceller. Bu, temelinde kapan\u0131\u015f mekanizmas\u0131n\u0131 kullan\u0131r.<\/p>\n<h4>Durumlu Fonksiyonlar Ne Zaman Tercih Edilmeli?<\/h4>\n<p>Kapan\u0131\u015flar arac\u0131l\u0131\u011f\u0131yla durumlu fonksiyonlar, genellikle a\u015fa\u011f\u0131daki senaryolarda tercih edilir:<\/p>\n<ul>\n<li>K\u00fc\u00e7\u00fck ve orta \u00f6l\u00e7ekli durum y\u00f6netimi ihtiya\u00e7lar\u0131.<\/li>\n<li>Mod\u00fcl deseni uygulayarak veri gizlili\u011fi sa\u011flamak.<\/li>\n<li>Fabrika fonksiyonlar\u0131 arac\u0131l\u0131\u011f\u0131yla \u00f6zelle\u015ftirilmi\u015f nesne \u00f6rnekleri olu\u015fturmak.<\/li>\n<li>\u00d6nbellekleme veya memoization gibi performans optimizasyonlar\u0131 yapmak.<\/li>\n<li>UI bile\u015fenlerinde yerel durumu y\u00f6netmek (React Hooks gibi soyutlamalar olmadan).<\/li>\n<\/ul>\n<p>Daha b\u00fcy\u00fck, payla\u015f\u0131ml\u0131 ve karma\u015f\u0131k durumlar i\u00e7in Redux veya Context API gibi merkezi durum y\u00f6netimi \u00e7\u00f6z\u00fcmleri daha uygun olabilir.<\/p>\n<h3>Sonu\u00e7<\/h3>\n<p>JavaScript kapan\u0131\u015flar\u0131, fonksiyonlar\u0131n kendi \u00f6zel durumlar\u0131n\u0131 g\u00fcvenli ve etkili bir \u015fekilde saklamalar\u0131n\u0131 sa\u011flayan temel bir mekanizmad\u0131r. Bu sayede, daha mod\u00fcler, okunabilir ve bak\u0131m\u0131 kolay kodlar yazabiliriz. Kapan\u0131\u015flar arac\u0131l\u0131\u011f\u0131yla olu\u015fturulan durumlu fonksiyonlar, saya\u00e7lardan \u00f6nbellekleme mekanizmalar\u0131na, UI bile\u015fenlerinden fabrika fonksiyonlar\u0131na kadar geni\u015f bir yelpazede uygulama alan\u0131 bulur. Ancak, bu g\u00fcc\u00fc kullan\u0131rken bellek y\u00f6netimi ve yan etkiler gibi potansiyel dezavantajlar\u0131 g\u00f6z \u00f6n\u00fcnde bulundurmak ve en iyi uygulamalar\u0131 takip etmek kritik \u00f6neme sahiptir. Kapan\u0131\u015flar\u0131 derinlemesine anlamak, her JavaScript geli\u015ftiricisinin ara\u00e7 kutusunda bulunmas\u0131 gereken vazge\u00e7ilmez bir beceridir ve daha karma\u015f\u0131k durum y\u00f6netimi k\u00fct\u00fcphanelerinin temelini olu\u015fturan prensipleri kavraman\u0131za yard\u0131mc\u0131 olacakt\u0131r.<\/p>\n<h3>SSS (S\u0131k Sorulan Sorular)<\/h3>\n<h4>1. Kapan\u0131\u015flar\u0131n ana faydas\u0131 nedir?<\/h4>\n<p>Kapan\u0131\u015flar\u0131n ana faydas\u0131, veri gizlili\u011fi (encapsulation) sa\u011flamas\u0131d\u0131r. Bir fonksiyonun i\u00e7 de\u011fi\u015fkenlerini d\u0131\u015far\u0131dan do\u011frudan eri\u015filemez hale getirerek, bu de\u011fi\u015fkenlerin yaln\u0131zca belirli metotlar arac\u0131l\u0131\u011f\u0131yla manip\u00fcle edilmesini sa\u011flar. Bu, kodun daha g\u00fcvenli, mod\u00fcler ve y\u00f6netilebilir olmas\u0131n\u0131 sa\u011flar.<\/p>\n<h4>2. Kapan\u0131\u015flar bellek s\u0131z\u0131nt\u0131lar\u0131na neden olur mu?<\/h4>\n<p>Evet, dikkatli kullan\u0131lmazsa kapan\u0131\u015flar bellek s\u0131z\u0131nt\u0131lar\u0131na neden olabilir. Bir kapan\u0131\u015f, d\u0131\u015f kapsam\u0131ndaki de\u011fi\u015fkenlere referans tuttu\u011fu i\u00e7in, bu de\u011fi\u015fkenler kapan\u0131\u015f\u0131n kendisi bellekten temizlenene kadar \u00e7\u00f6p toplay\u0131c\u0131 taraf\u0131ndan serbest b\u0131rak\u0131lamaz. \u00d6zellikle uzun \u00f6m\u00fcrl\u00fc kapan\u0131\u015flar veya d\u00f6ng\u00fcler i\u00e7inde b\u00fcy\u00fck nesneleri kapatan kapan\u0131\u015flar bu riski art\u0131rabilir. Bellek kullan\u0131m\u0131n\u0131 izlemek ve gereksiz referanslar\u0131 temizlemek \u00f6nemlidir.<\/p>\n<h4>3. Fonksiyonel programlamada kapan\u0131\u015flar\u0131 kullanabilir miyim?<\/h4>\n<p>Kesinlikle! Kapan\u0131\u015flar, fonksiyonel programlama paradigmalar\u0131yla m\u00fckemmel bir uyum i\u00e7indedir. Currying, memoization ve higher-order functions gibi bir\u00e7ok fonksiyonel programlama tekni\u011fi, kapan\u0131\u015flar\u0131n g\u00fcc\u00fcnden yararlan\u0131r. Kapan\u0131\u015flar, fonksiyonlar\u0131n durum saklamas\u0131n\u0131 sa\u011flayarak, daha karma\u015f\u0131k fonksiyonel yap\u0131lar olu\u015fturman\u0131za olanak tan\u0131r.<\/p>\n<h4>4. Durumlu fonksiyonlardan ne zaman ka\u00e7\u0131nmal\u0131y\u0131m?<\/h4>\n<p>Durumlu fonksiyonlardan, durumun uygulaman\u0131n farkl\u0131 b\u00f6l\u00fcmleri aras\u0131nda geni\u015f \u00e7apta payla\u015f\u0131lmas\u0131 gerekti\u011finde veya durum y\u00f6netiminin \u00e7ok karma\u015f\u0131k hale geldi\u011fi b\u00fcy\u00fck uygulamalarda ka\u00e7\u0131nmak isteyebilirsiniz. Bu t\u00fcr senaryolarda, Redux, Zustand, Context API gibi merkezi durum y\u00f6netimi \u00e7\u00f6z\u00fcmleri veya tamamen saf (pure) ve durumsuz fonksiyonlar kullanmak daha uygun olabilir. Ayr\u0131ca, fonksiyonun her \u00e7a\u011fr\u0131da ayn\u0131 girdiler i\u00e7in ayn\u0131 \u00e7\u0131kt\u0131y\u0131 vermesi beklenen durumlarda durumsuz fonksiyonlar tercih edilmelidir.<\/p>\n","protected":false},"excerpt":{"rendered":"Modern web uygulamalar\u0131 geli\u015ftirirken, veriyi y\u00f6netmek ve uygulaman\u0131n farkl\u0131 b\u00f6l\u00fcmleri aras\u0131nda tutarl\u0131l\u0131\u011f\u0131 sa\u011flamak kritik bir \u00f6neme sahiptir&#8230;.","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":[129],"tags":[],"class_list":{"0":"post-37685","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-javascript","7":"cs-entry","8":"cs-video-wrap"},"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v20.5 (Yoast SEO v25.3.1) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>JavaScript Kapan\u0131\u015flar\u0131 ile Durumlu Fonksiyonlar\u0131 Anlamak - Kodlar\u0131n Gizemli D\u00fcnyas\u0131<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/\" \/>\n<meta property=\"og:locale\" content=\"tr_TR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"JavaScript Kapan\u0131\u015flar\u0131 ile Durumlu Fonksiyonlar\u0131 Anlamak\" \/>\n<meta property=\"og:description\" content=\"Modern web uygulamalar\u0131 geli\u015ftirirken, veriyi y\u00f6netmek ve uygulaman\u0131n farkl\u0131 b\u00f6l\u00fcmleri aras\u0131nda tutarl\u0131l\u0131\u011f\u0131 sa\u011flamak kritik bir \u00f6neme sahiptir....\" \/>\n<meta property=\"og:url\" content=\"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/\" \/>\n<meta property=\"og:site_name\" content=\"Kodlar\u0131n Gizemli D\u00fcnyas\u0131\" \/>\n<meta property=\"article:published_time\" content=\"2026-01-12T10:31:10+00:00\" \/>\n<meta name=\"author\" content=\"Fatih Soysal\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Yazan:\" \/>\n\t<meta name=\"twitter:data1\" content=\"Fatih Soysal\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tahmini okuma s\u00fcresi\" \/>\n\t<meta name=\"twitter:data2\" content=\"14 dakika\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/\"},\"author\":{\"name\":\"Fatih Soysal\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"headline\":\"JavaScript Kapan\u0131\u015flar\u0131 ile Durumlu Fonksiyonlar\u0131 Anlamak\",\"datePublished\":\"2026-01-12T10:31:10+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/\"},\"wordCount\":2349,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"articleSection\":[\"Javascript\"],\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/#respond\"]}],\"copyrightYear\":\"2026\",\"copyrightHolder\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/\",\"name\":\"JavaScript Kapan\u0131\u015flar\u0131 ile Durumlu Fonksiyonlar\u0131 Anlamak - Kodlar\u0131n Gizemli D\u00fcnyas\u0131\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\"},\"datePublished\":\"2026-01-12T10:31:10+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/#breadcrumb\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Anasayfa\",\"item\":\"https:\/\/fatihsoysal.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"JavaScript Kapan\u0131\u015flar\u0131 ile Durumlu Fonksiyonlar\u0131 Anlamak\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/\",\"name\":\"Fatihsoysal.com\",\"description\":\"Blog - Yaz\u0131l\u0131m D\u00fcnyas\u0131 Tecr\u00fcbelerim\",\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/fatihsoysal.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"tr\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\",\"name\":\"Fatih Soysal\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"tr\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png\",\"contentUrl\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png\",\"width\":512,\"height\":512,\"caption\":\"Fatih Soysal\"},\"logo\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/\"},\"description\":\"Kullan\u0131m ve kodlama m\u00fckemmeliyetini odak alan uygulamalar olu\u015fturma deneyimine sahip, profesyonel olarak 15+ y\u0131l \u00fczeri deneyime sahip bir yaz\u0131l\u0131m m\u00fchendisi.\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/author\/fatihsoysal\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"JavaScript Kapan\u0131\u015flar\u0131 ile Durumlu Fonksiyonlar\u0131 Anlamak - Kodlar\u0131n Gizemli D\u00fcnyas\u0131","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/","og_locale":"tr_TR","og_type":"article","og_title":"JavaScript Kapan\u0131\u015flar\u0131 ile Durumlu Fonksiyonlar\u0131 Anlamak","og_description":"Modern web uygulamalar\u0131 geli\u015ftirirken, veriyi y\u00f6netmek ve uygulaman\u0131n farkl\u0131 b\u00f6l\u00fcmleri aras\u0131nda tutarl\u0131l\u0131\u011f\u0131 sa\u011flamak kritik bir \u00f6neme sahiptir....","og_url":"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/","og_site_name":"Kodlar\u0131n Gizemli D\u00fcnyas\u0131","article_published_time":"2026-01-12T10:31:10+00:00","author":"Fatih Soysal","twitter_card":"summary_large_image","twitter_misc":{"Yazan:":"Fatih Soysal","Tahmini okuma s\u00fcresi":"14 dakika"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/#article","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/"},"author":{"name":"Fatih Soysal","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"headline":"JavaScript Kapan\u0131\u015flar\u0131 ile Durumlu Fonksiyonlar\u0131 Anlamak","datePublished":"2026-01-12T10:31:10+00:00","mainEntityOfPage":{"@id":"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/"},"wordCount":2349,"commentCount":0,"publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"articleSection":["Javascript"],"inLanguage":"tr","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/#respond"]}],"copyrightYear":"2026","copyrightHolder":{"@id":"https:\/\/fatihsoysal.com\/blog\/#organization"}},{"@type":"WebPage","@id":"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/","url":"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/","name":"JavaScript Kapan\u0131\u015flar\u0131 ile Durumlu Fonksiyonlar\u0131 Anlamak - Kodlar\u0131n Gizemli D\u00fcnyas\u0131","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/#website"},"datePublished":"2026-01-12T10:31:10+00:00","breadcrumb":{"@id":"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/#breadcrumb"},"inLanguage":"tr","potentialAction":[{"@type":"ReadAction","target":["https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/fatihsoysal.com\/blog\/javascript-kapanislari-ile-durumlu-fonksiyonlari-anlamak\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Anasayfa","item":"https:\/\/fatihsoysal.com\/blog\/"},{"@type":"ListItem","position":2,"name":"JavaScript Kapan\u0131\u015flar\u0131 ile Durumlu Fonksiyonlar\u0131 Anlamak"}]},{"@type":"WebSite","@id":"https:\/\/fatihsoysal.com\/blog\/#website","url":"https:\/\/fatihsoysal.com\/blog\/","name":"Fatihsoysal.com","description":"Blog - Yaz\u0131l\u0131m D\u00fcnyas\u0131 Tecr\u00fcbelerim","publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/fatihsoysal.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"tr"},{"@type":["Person","Organization"],"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1","name":"Fatih Soysal","image":{"@type":"ImageObject","inLanguage":"tr","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png","contentUrl":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png","width":512,"height":512,"caption":"Fatih Soysal"},"logo":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/"},"description":"Kullan\u0131m ve kodlama m\u00fckemmeliyetini odak alan uygulamalar olu\u015fturma deneyimine sahip, profesyonel olarak 15+ y\u0131l \u00fczeri deneyime sahip bir yaz\u0131l\u0131m m\u00fchendisi.","url":"https:\/\/fatihsoysal.com\/blog\/author\/fatihsoysal\/"}]}},"yoast_meta":{"yoast_wpseo_title":"","yoast_wpseo_metadesc":"","yoast_wpseo_canonical":""},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/37685","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/comments?post=37685"}],"version-history":[{"count":0,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/37685\/revisions"}],"wp:attachment":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/media?parent=37685"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/categories?post=37685"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/tags?post=37685"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}