{"id":18924,"date":"2025-04-22T23:15:14","date_gmt":"2025-04-22T20:15:14","guid":{"rendered":"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/"},"modified":"2025-04-22T23:15:14","modified_gmt":"2025-04-22T20:15:14","slug":"eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi","status":"publish","type":"post","link":"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/","title":{"rendered":"EventTarget Aray\u00fcz\u00fc ve \u00d6zel Olaylar: JavaScript&#8217;te Etkinlik Y\u00f6netimi"},"content":{"rendered":"<p>EventTarget Aray\u00fcz\u00fc ve \u00d6zel Olaylar: JavaScript&#8217;te Etkinlik Y\u00f6netimi<\/p>\n<p>Merhaba, ben Fatih Soysal. Bu makalede, JavaScript&#8217;te olay y\u00f6netiminin temel ta\u015flar\u0131ndan biri olan <code>EventTarget<\/code> aray\u00fcz\u00fc ve \u00f6zel olaylar\u0131n (custom events) nas\u0131l kullan\u0131laca\u011f\u0131n\u0131 detayl\u0131 olarak inceleyece\u011fiz.  \u00d6ncelikle,  <code>EventTarget<\/code> aray\u00fcz\u00fcn\u00fcn ne oldu\u011funu ve neden \u00f6nemli oldu\u011funu a\u00e7\u0131klayarak ba\u015flayal\u0131m. Ard\u0131ndan, \u00f6zel olaylar\u0131n nas\u0131l olu\u015fturuldu\u011funu ve kullan\u0131ld\u0131\u011f\u0131n\u0131 \u00f6rneklerle g\u00f6sterece\u011fiz.  Bu bilgiler, daha geli\u015fmi\u015f JavaScript uygulamalar\u0131 geli\u015ftirmeniz i\u00e7in size sa\u011flam bir temel sa\u011flayacakt\u0131r.<\/p>\n<h2>EventTarget Aray\u00fcz\u00fc: Olaylar\u0131n Kalbi<\/h2>\n<p><code>EventTarget<\/code> aray\u00fcz\u00fc, JavaScript&#8217;te olaylar\u0131n hedeflendi\u011fi temel yap\u0131d\u0131r.  Bir\u00e7ok nesne (\u00f6rne\u011fin, <code>HTMLElement<\/code>, <code>Window<\/code>, <code>Document<\/code>)  bu aray\u00fcz\u00fc uygular.  Bu,  <code>addEventListener()<\/code> ve <code>dispatchEvent()<\/code> gibi y\u00f6ntemleri kullanarak bu nesnelere olay eklemenizi ve tetiklemenizi sa\u011flar.  K\u0131sacas\u0131,  olaylar\u0131n nas\u0131l ele al\u0131nd\u0131\u011f\u0131n\u0131 d\u00fczenleyen bir merkez g\u00f6revi g\u00f6r\u00fcr.  Bu mekanizma sayesinde,  bir d\u00fc\u011fmeye t\u0131klama gibi kullan\u0131c\u0131 etkile\u015fimlerini veya zamanlay\u0131c\u0131larla tetiklenen olaylar\u0131 yakalay\u0131p i\u015fleyebilirsiniz.<\/p>\n<p><code>EventTarget<\/code> aray\u00fcz\u00fcn\u00fcn en \u00f6nemli iki y\u00f6ntemi \u015funlard\u0131r:<\/p>\n<ul>\n<li><code>addEventListener(type, listener, options)<\/code>: Bir olay\u0131n dinleyicisini ekler.  <code>type<\/code> olay t\u00fcr\u00fcn\u00fc, <code>listener<\/code> olay tetiklendi\u011finde \u00e7al\u0131\u015facak fonksiyonu, <code>options<\/code> ise  (\u00f6rne\u011fin, <code>once<\/code>, <code>capture<\/code>)  ek se\u00e7enekleri belirtir.<\/li>\n<li><code>dispatchEvent(event)<\/code>: Belirtilen olay\u0131 tetikler.  Bu,  kullan\u0131c\u0131 etkile\u015fiminden ba\u011f\u0131ms\u0131z olarak olaylar\u0131 programatik olarak tetiklemek i\u00e7in kullan\u0131labilir.<\/li>\n<\/ul>\n<h2>\u00d6zel Olaylar (Custom Events): Kendi Olaylar\u0131n\u0131z\u0131 Olu\u015fturun<\/h2>\n<p>JavaScript&#8217;in yerle\u015fik olaylar\u0131 (\u00f6rne\u011fin, <code>click<\/code>, <code>load<\/code>) yeterli olmayabilir.  Bu durumlarda,  kendi \u00f6zel olaylar\u0131n\u0131z\u0131 olu\u015fturarak uygulaman\u0131z\u0131n ihtiya\u00e7lar\u0131na g\u00f6re uyarlayabilirsiniz.  \u00d6zel olaylar,  farkl\u0131 bile\u015fenler aras\u0131nda ileti\u015fim kurman\u0131n g\u00fc\u00e7l\u00fc bir yoludur. \u00d6rne\u011fin,  bir formdaki verilerin ge\u00e7erlili\u011fini kontrol eden bir bile\u015fen,  do\u011frulama sonu\u00e7lar\u0131n\u0131 \u00f6zel bir olay kullanarak ana bile\u015fene iletebilir.<\/p>\n<p>\u00d6zel bir olay olu\u015fturmak i\u00e7in <code>CustomEvent<\/code> yap\u0131c\u0131s\u0131n\u0131 kullan\u0131r\u0131z:<\/p>\n<pre><code class=\"language-javascript\">\nconst myEvent = new CustomEvent('myCustomEvent', { detail: { message: 'Merhaba, d\u00fcnya!' } });\n<\/code><\/pre>\n<p>Bu kod, <code>myCustomEvent<\/code> ad\u0131nda yeni bir \u00f6zel olay olu\u015fturur.  <code>detail<\/code> \u00f6zelli\u011fi,  olayla birlikte g\u00f6nderilecek ek verileri i\u00e7erir.  Daha sonra,  <code>dispatchEvent()<\/code> y\u00f6ntemi ile bu olay\u0131 tetikleyebilirsiniz:<\/p>\n<pre><code class=\"language-javascript\">\ndocument.dispatchEvent(myEvent);\n<\/code><\/pre>\n<p>Bu olay\u0131 dinlemek i\u00e7in <code>addEventListener()<\/code> kullanabilirsiniz:<\/p>\n<pre><code class=\"language-javascript\">\ndocument.addEventListener('myCustomEvent', function(event) {\n  console.log(event.detail.message); \/\/ \"Merhaba, d\u00fcnya!\" yazd\u0131r\u0131r\n});\n<\/code><\/pre>\n<h2>Uygulama \u00d6rne\u011fi ve \u0130leri Seviye Konular<\/h2>\n<p>\u00d6zel olaylar, karma\u015f\u0131k uygulamalarda bile\u015fenler aras\u0131 ileti\u015fimi b\u00fcy\u00fck \u00f6l\u00e7\u00fcde basitle\u015ftirir. \u00d6rne\u011fin, bir e-ticaret sitesi sepet g\u00fcncellemelerini, \u00f6deme i\u015flemlerini veya \u00fcr\u00fcn detay sayfalar\u0131n\u0131 dinamik olarak g\u00fcncellemek i\u00e7in \u00f6zel olaylar kullanabilir.  Ayr\u0131ca,  <code>EventTarget<\/code>&#8216;\u0131n  <code>removeEventListener()<\/code> y\u00f6ntemi ile dinleyicileri kald\u0131rmay\u0131 da unutmamak gerekir.  Bu,  haf\u0131za s\u0131z\u0131nt\u0131lar\u0131n\u0131 \u00f6nlemek i\u00e7in \u00f6nemlidir.<\/p>\n<p>Daha ileri seviye konular aras\u0131nda, olay kabarc\u0131\u011f\u0131 (event bubbling) ve olay yakalama (event capturing) mekanizmalar\u0131 yer al\u0131r.  Bu konular\u0131 anlamak,  olaylar\u0131n nas\u0131l yay\u0131ld\u0131\u011f\u0131n\u0131 ve hangi s\u0131rayla i\u015flendi\u011fini kontrol etmenizi sa\u011flar.  Bu konular hakk\u0131nda daha detayl\u0131 bilgi i\u00e7in <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/EventTarget\" target=\"_blank\" rel=\"noopener noreferrer\">MDN Web Docs<\/a> sayfas\u0131n\u0131 inceleyebilirsiniz.<\/p>\n<p>Umar\u0131m bu makale, <code>EventTarget<\/code> aray\u00fcz\u00fc ve \u00f6zel olaylar\u0131n nas\u0131l kullan\u0131laca\u011f\u0131 konusunda size yard\u0131mc\u0131 olmu\u015ftur.  Daha fazla bilgi ve \u00f6rnek uygulama i\u00e7in kendi web sitemi <a href=\"https:\/\/fatihsoysal.com\" target=\"_blank\" rel=\"noopener noreferrer\">fatihsoysal.com<\/a> adresini ziyaret edebilirsiniz.<\/p>\n<p><b>Anahtar Kelimeler:<\/b>  EventTarget, \u00d6zel Olaylar, Custom Events, JavaScript, Olay Y\u00f6netimi, addEventListener, dispatchEvent, Event Bubbling, Event Capturing, JavaScript Olaylar\u0131<\/p>\n<p>#Etiketler: EventTarget, \u00d6zel Olaylar, Custom Events, JavaScript, Olay Y\u00f6netimi, addEventListener, dispatchEvent, Event Bubbling, Event Capturing, JavaScript Olaylar\u0131<\/p>\n","protected":false},"excerpt":{"rendered":"EventTarget Aray\u00fcz\u00fc ve \u00d6zel Olaylar: JavaScript&#8217;te Etkinlik Y\u00f6netimi Merhaba, ben Fatih Soysal. Bu makalede, JavaScript&#8217;te olay y\u00f6netiminin temel&hellip;","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-18924","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-genel","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>EventTarget Aray\u00fcz\u00fc ve \u00d6zel Olaylar: JavaScript&#039;te Etkinlik Y\u00f6netimi<\/title>\n<meta name=\"description\" content=\"Merhaba, ben Fatih Soysal. Bu makalede, JavaScript&#039;te olay y\u00f6netiminin temel ta\u015flar\u0131ndan biri olan EventTarget aray\u00fcz\u00fc ve \u00f6zel olaylar\u0131n (custom events) nas\u0131l kullan\u0131laca\u011f\u0131n\u0131 detayl\u0131 olarak inceleyece\u011fiz. \u00d6ncelikle, EventTarget aray\u00fcz\u00fcn\u00fcn ne oldu\u011funu ve neden \u00f6nemli oldu\u011funu a\u00e7\u0131klayarak ba\u015flayal\u0131m. Ard\u0131ndan, \u00f6zel olaylar\u0131n nas\u0131l olu\u015fturuldu\u011funu ve kullan\u0131ld\u0131\u011f\u0131n\u0131 \u00f6rneklerle g\u00f6sterece\u011fiz. Bu bilgiler, daha geli\u015fmi\u015f JavaScript uygulamalar\u0131 geli\u015ftirmeniz i\u00e7in size sa\u011flam bir temel sa\u011flayacakt\u0131r.\" \/>\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\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/\" \/>\n<meta property=\"og:locale\" content=\"tr_TR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"EventTarget Aray\u00fcz\u00fc ve \u00d6zel Olaylar: JavaScript&#039;te Etkinlik Y\u00f6netimi\" \/>\n<meta property=\"og:description\" content=\"Merhaba, ben Fatih Soysal. Bu makalede, JavaScript&#039;te olay y\u00f6netiminin temel ta\u015flar\u0131ndan biri olan EventTarget aray\u00fcz\u00fc ve \u00f6zel olaylar\u0131n (custom events) nas\u0131l kullan\u0131laca\u011f\u0131n\u0131 detayl\u0131 olarak inceleyece\u011fiz. \u00d6ncelikle, EventTarget aray\u00fcz\u00fcn\u00fcn ne oldu\u011funu ve neden \u00f6nemli oldu\u011funu a\u00e7\u0131klayarak ba\u015flayal\u0131m. Ard\u0131ndan, \u00f6zel olaylar\u0131n nas\u0131l olu\u015fturuldu\u011funu ve kullan\u0131ld\u0131\u011f\u0131n\u0131 \u00f6rneklerle g\u00f6sterece\u011fiz. Bu bilgiler, daha geli\u015fmi\u015f JavaScript uygulamalar\u0131 geli\u015ftirmeniz i\u00e7in size sa\u011flam bir temel sa\u011flayacakt\u0131r.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/\" \/>\n<meta property=\"og:site_name\" content=\"Kodlar\u0131n Gizemli D\u00fcnyas\u0131\" \/>\n<meta property=\"article:published_time\" content=\"2025-04-22T20:15:14+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=\"3 dakika\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/\"},\"author\":{\"name\":\"Fatih Soysal\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"headline\":\"EventTarget Aray\u00fcz\u00fc ve \u00d6zel Olaylar: JavaScript&#8217;te Etkinlik Y\u00f6netimi\",\"datePublished\":\"2025-04-22T20:15:14+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/\"},\"wordCount\":575,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/#respond\"]}],\"copyrightYear\":\"2025\",\"copyrightHolder\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/\",\"name\":\"EventTarget Aray\u00fcz\u00fc ve \u00d6zel Olaylar: JavaScript'te Etkinlik Y\u00f6netimi\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\"},\"datePublished\":\"2025-04-22T20:15:14+00:00\",\"description\":\"Merhaba, ben Fatih Soysal. Bu makalede, JavaScript'te olay y\u00f6netiminin temel ta\u015flar\u0131ndan biri olan EventTarget aray\u00fcz\u00fc ve \u00f6zel olaylar\u0131n (custom events) nas\u0131l kullan\u0131laca\u011f\u0131n\u0131 detayl\u0131 olarak inceleyece\u011fiz. \u00d6ncelikle, EventTarget aray\u00fcz\u00fcn\u00fcn ne oldu\u011funu ve neden \u00f6nemli oldu\u011funu a\u00e7\u0131klayarak ba\u015flayal\u0131m. Ard\u0131ndan, \u00f6zel olaylar\u0131n nas\u0131l olu\u015fturuldu\u011funu ve kullan\u0131ld\u0131\u011f\u0131n\u0131 \u00f6rneklerle g\u00f6sterece\u011fiz. Bu bilgiler, daha geli\u015fmi\u015f JavaScript uygulamalar\u0131 geli\u015ftirmeniz i\u00e7in size sa\u011flam bir temel sa\u011flayacakt\u0131r.\",\"breadcrumb\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/#breadcrumb\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Anasayfa\",\"item\":\"https:\/\/fatihsoysal.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"EventTarget Aray\u00fcz\u00fc ve \u00d6zel Olaylar: JavaScript&#8217;te Etkinlik Y\u00f6netimi\"}]},{\"@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":"EventTarget Aray\u00fcz\u00fc ve \u00d6zel Olaylar: JavaScript'te Etkinlik Y\u00f6netimi","description":"Merhaba, ben Fatih Soysal. Bu makalede, JavaScript'te olay y\u00f6netiminin temel ta\u015flar\u0131ndan biri olan EventTarget aray\u00fcz\u00fc ve \u00f6zel olaylar\u0131n (custom events) nas\u0131l kullan\u0131laca\u011f\u0131n\u0131 detayl\u0131 olarak inceleyece\u011fiz. \u00d6ncelikle, EventTarget aray\u00fcz\u00fcn\u00fcn ne oldu\u011funu ve neden \u00f6nemli oldu\u011funu a\u00e7\u0131klayarak ba\u015flayal\u0131m. Ard\u0131ndan, \u00f6zel olaylar\u0131n nas\u0131l olu\u015fturuldu\u011funu ve kullan\u0131ld\u0131\u011f\u0131n\u0131 \u00f6rneklerle g\u00f6sterece\u011fiz. Bu bilgiler, daha geli\u015fmi\u015f JavaScript uygulamalar\u0131 geli\u015ftirmeniz i\u00e7in size sa\u011flam bir temel sa\u011flayacakt\u0131r.","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\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/","og_locale":"tr_TR","og_type":"article","og_title":"EventTarget Aray\u00fcz\u00fc ve \u00d6zel Olaylar: JavaScript'te Etkinlik Y\u00f6netimi","og_description":"Merhaba, ben Fatih Soysal. Bu makalede, JavaScript'te olay y\u00f6netiminin temel ta\u015flar\u0131ndan biri olan EventTarget aray\u00fcz\u00fc ve \u00f6zel olaylar\u0131n (custom events) nas\u0131l kullan\u0131laca\u011f\u0131n\u0131 detayl\u0131 olarak inceleyece\u011fiz. \u00d6ncelikle, EventTarget aray\u00fcz\u00fcn\u00fcn ne oldu\u011funu ve neden \u00f6nemli oldu\u011funu a\u00e7\u0131klayarak ba\u015flayal\u0131m. Ard\u0131ndan, \u00f6zel olaylar\u0131n nas\u0131l olu\u015fturuldu\u011funu ve kullan\u0131ld\u0131\u011f\u0131n\u0131 \u00f6rneklerle g\u00f6sterece\u011fiz. Bu bilgiler, daha geli\u015fmi\u015f JavaScript uygulamalar\u0131 geli\u015ftirmeniz i\u00e7in size sa\u011flam bir temel sa\u011flayacakt\u0131r.","og_url":"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/","og_site_name":"Kodlar\u0131n Gizemli D\u00fcnyas\u0131","article_published_time":"2025-04-22T20:15:14+00:00","author":"Fatih Soysal","twitter_card":"summary_large_image","twitter_misc":{"Yazan:":"Fatih Soysal","Tahmini okuma s\u00fcresi":"3 dakika"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/#article","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/"},"author":{"name":"Fatih Soysal","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"headline":"EventTarget Aray\u00fcz\u00fc ve \u00d6zel Olaylar: JavaScript&#8217;te Etkinlik Y\u00f6netimi","datePublished":"2025-04-22T20:15:14+00:00","mainEntityOfPage":{"@id":"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/"},"wordCount":575,"commentCount":0,"publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"inLanguage":"tr","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/#respond"]}],"copyrightYear":"2025","copyrightHolder":{"@id":"https:\/\/fatihsoysal.com\/blog\/#organization"}},{"@type":"WebPage","@id":"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/","url":"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/","name":"EventTarget Aray\u00fcz\u00fc ve \u00d6zel Olaylar: JavaScript'te Etkinlik Y\u00f6netimi","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/#website"},"datePublished":"2025-04-22T20:15:14+00:00","description":"Merhaba, ben Fatih Soysal. Bu makalede, JavaScript'te olay y\u00f6netiminin temel ta\u015flar\u0131ndan biri olan EventTarget aray\u00fcz\u00fc ve \u00f6zel olaylar\u0131n (custom events) nas\u0131l kullan\u0131laca\u011f\u0131n\u0131 detayl\u0131 olarak inceleyece\u011fiz. \u00d6ncelikle, EventTarget aray\u00fcz\u00fcn\u00fcn ne oldu\u011funu ve neden \u00f6nemli oldu\u011funu a\u00e7\u0131klayarak ba\u015flayal\u0131m. Ard\u0131ndan, \u00f6zel olaylar\u0131n nas\u0131l olu\u015fturuldu\u011funu ve kullan\u0131ld\u0131\u011f\u0131n\u0131 \u00f6rneklerle g\u00f6sterece\u011fiz. Bu bilgiler, daha geli\u015fmi\u015f JavaScript uygulamalar\u0131 geli\u015ftirmeniz i\u00e7in size sa\u011flam bir temel sa\u011flayacakt\u0131r.","breadcrumb":{"@id":"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/#breadcrumb"},"inLanguage":"tr","potentialAction":[{"@type":"ReadAction","target":["https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/fatihsoysal.com\/blog\/eventtarget-arayuzu-ve-ozel-olaylar-javascriptte-etkinlik-yonetimi\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Anasayfa","item":"https:\/\/fatihsoysal.com\/blog\/"},{"@type":"ListItem","position":2,"name":"EventTarget Aray\u00fcz\u00fc ve \u00d6zel Olaylar: JavaScript&#8217;te Etkinlik Y\u00f6netimi"}]},{"@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\/18924","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=18924"}],"version-history":[{"count":0,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/18924\/revisions"}],"wp:attachment":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/media?parent=18924"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/categories?post=18924"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/tags?post=18924"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}