﻿
{"id":8527,"date":"2018-07-12T08:53:58","date_gmt":"2018-07-12T08:53:58","guid":{"rendered":"http:\/\/www.gencayyildiz.com\/blog\/?p=8527"},"modified":"2018-07-12T08:53:58","modified_gmt":"2018-07-12T08:53:58","slug":"ecmascript-6-promise-yapisi","status":"publish","type":"post","link":"https:\/\/www.gencayyildiz.com\/blog\/ecmascript-6-promise-yapisi\/","title":{"rendered":"ECMAScript 6 &#8211; Promise Yap\u0131s\u0131"},"content":{"rendered":"<div id=\"fb-root\"><\/div>\n<p>Merhaba,<\/p>\n<p>Bir Developer; geli\u015ftirdi\u011fi yaz\u0131l\u0131mda do\u011fru algoritma, performans, d\u00fc\u015f\u00fck maliyet vs. gibi fakt\u00f6rleri g\u00f6z \u00f6n\u00fcne alarak s\u00fcreci i\u015fletmektedir. Lakin bu fakt\u00f6rler kadar \u00f6nemli olan bir di\u011fer husus ise yaz\u0131lan kodlar\u0131n okunabilirlik derecesinin bir ba\u015fka deyi\u015fle temiz kod kabiliyetinin y\u00fcksek olmas\u0131 gerekmektedir. Bu durum yaz\u0131l\u0131m a\u00e7\u0131s\u0131ndan gelecek vaadetme durumuna istinaden ilerideki s\u00fcre\u00e7te kod ak\u0131\u015f\u0131n\u0131n rahat bir \u015fekilde tekrar takibinin yap\u0131labilmesi i\u00e7in ve yeni fikirler, eklemeler yahut g\u00fcncellemelerle yaz\u0131l\u0131m\u0131 daha da ileri boyutta geli\u015ftirebilmek i\u00e7in gerekmektedir.<\/p>\n<p>Promise yap\u0131s\u0131, JavaScript&#8217;te olu\u015fturulan kompleks ve okunabilirli\u011fi d\u00fc\u015f\u00fck olan fonksiyon yap\u0131lar\u0131 i\u00e7in geli\u015ftirilmi\u015f bir yap\u0131d\u0131r. \u00d6zellikle i\u00e7 i\u00e7e CallBack olarak tan\u0131mlanm\u0131\u015f fonksiyonlar yerine Promise yap\u0131s\u0131 hayat kurtar\u0131c\u0131 nitelikte olacakt\u0131r.<\/p>\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\nlet myFunction = (data, callback) =&gt; {\r\n    console.log(data);\r\n    callback(data + 5);\r\n};\r\n<\/pre>\n<p>Yukar\u0131daki CallBack tan\u0131ml\u0131 fonksiyonu ele alal\u0131m. Bu fonksiyonu a\u015fa\u011f\u0131daki gibi kompleks bir \u015fekilde kulland\u0131\u011f\u0131m\u0131z\u0131 varsayal\u0131m;<\/p>\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\nmyFunction(5, function (data) {\r\n    myFunction(data, function (data) {\r\n        myFunction(data, function (data) {\r\n            myFunction(data, function (data) {\r\n                myFunction(data, function (data) {\r\n                    myFunction(data, function (data) {\r\n                        myFunction(data, function (data) {\r\n                            myFunction(data, function (data) {\r\n                                console.log(`Son ${data}`);\r\n                            });\r\n                        });\r\n                    });\r\n                });\r\n            });\r\n        });\r\n    });\r\n});\r\n<\/pre>\n<p>Evet, g\u00f6rd\u00fc\u011f\u00fcn\u00fcz gibi nerde ne var ne yok belli olmayan bir kod demeci&#8230;<\/p>\n<p>\u015eimdi Promise yap\u0131s\u0131n\u0131 kullanarak yukar\u0131daki kod blo\u011fundaki i\u015flevin bire bir ayn\u0131s\u0131n\u0131 olu\u015fturmam\u0131z\u0131 sa\u011flayacak yap\u0131m\u0131z\u0131 tan\u0131mlayal\u0131m.<\/p>\n<p>Tabi \u00f6ncelikle teknik olarak Promise yap\u0131s\u0131n\u0131n nas\u0131l kullan\u0131lmas\u0131 gerekti\u011fini konu\u015fal\u0131m.<\/p>\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\nlet myFunction = () =&gt; {\r\n    return new Promise((resolve, reject) =&gt; {\r\n        if (data &lt; 50)\r\n            resolve(`Ba\u015far\u0131l\u0131`);\r\n        else\r\n            reject(`Ba\u015far\u0131s\u0131z`);\r\n    });\r\n};\r\n<\/pre>\n<p>Yukar\u0131daki kod blo\u011funu incelerseniz e\u011fer; CallBack metodumuzu Promise hale getirmi\u015f bulunuyoruz. Fonksiyon geriye bir Promise nesnesi d\u00f6nmekte ve constructer ile i\u00e7erisine bir CallBack fonksiyonu tan\u0131mlanmaktad\u0131r. Bu fonksiyon &#8220;resolve&#8221; ve &#8220;reject&#8221; olmak \u00fczere iki adet parametre almaktad\u0131r. Bu parametreler asl\u0131nda birer CallBack fonksiyonudurlar.<\/p>\n<ul>\n<li>\n<strong>resolve<\/strong><br \/>\nE\u011fer i\u015flem ba\u015far\u0131l\u0131ysa tetiklenmektedir.\n<\/li>\n<li>\n<strong>reject<\/strong><br \/>\nE\u011fer i\u015flem ba\u015far\u0131s\u0131zsa tetiklenmektedir.\n<\/li>\n<\/ul>\n<p>\u015eimdi fonksiyonumuzu a\u015fa\u011f\u0131daki gibi Promise yap\u0131s\u0131nda olu\u015ftural\u0131m.<\/p>\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\nlet myFunction = data =&gt; {\r\n    return new Promise((resolve, reject) =&gt; {\r\n        if (data &lt; 45)\r\n            resolve(data);\r\n        else\r\n            reject(`Son ${data}`);\r\n    });\r\n};\r\n<\/pre>\n<p>Art\u0131k Promise yap\u0131s\u0131n\u0131n nimetlerinden faydalanarak kompleks \u00e7al\u0131\u015fmam\u0131z\u0131 daha anlaml\u0131 bir hale getirebiliriz.<\/p>\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\nmyFunction(5).then(data =&gt; {\r\n    console.log(data);\r\n    return data + 5;\r\n}).then(data =&gt; {\r\n    console.log(data);\r\n    return data + 5;\r\n}).then(data =&gt; {\r\n    console.log(data);\r\n    return data + 5;\r\n}).then(data =&gt; {\r\n    console.log(data);\r\n    return data + 5;\r\n}).catch(data =&gt; console.log(data));\r\n<\/pre>\n<p>Evet&#8230; G\u00f6r\u00fcld\u00fc\u011f\u00fc \u00fczere &#8220;myFunction&#8221; \u00e7a\u011fr\u0131ld\u0131ktan sonra &#8220;then&#8221; foksiyonlar\u0131yla bir sonraki \u00e7al\u0131\u015fmaya ge\u00e7ebiliyoruz. Yani \u00f6nceki kullan\u0131mdaki CallBack fonksiyonlara nazaran burada her ad\u0131m\u0131 &#8220;then&#8221; fonksiyonlar\u0131yla ger\u00e7ekle\u015ftirebiliyoruz. Her bir &#8220;then&#8221; fonksiyonunda geriye return edilen de\u011fer bir sonraki &#8220;then&#8221; fonksiyonuna parametre olarak gelmektedir. Ayriyetten &#8220;reject&#8221; fonksiyonunun tetiklenmesi durumunda &#8220;catch&#8221; ile b\u00fct\u00fcnsel bir hata kontrol\u00fcde sa\u011flanabilmektedir.<\/p>\n<p>&#8220;Kod yazmak sanatt\u0131r&#8230;&#8221; Dolay\u0131s\u0131yla t\u00fcm yaz\u0131l\u0131mc\u0131lar\u0131n bu sanat\u0131 daha anlaml\u0131 ve okunabilir icra etmesi temennisiyle&#8230;<\/p>\n<p>Sonraki yaz\u0131lar\u0131mda g\u00f6r\u00fc\u015fmek \u00fczere&#8230;<br \/>\n\u0130yi \u00e7al\u0131\u015fmalar dilerim&#8230;<\/p>\n<!-- AddThis Advanced Settings generic via filter on the_content --><!-- AddThis Share Buttons generic via filter on the_content -->","protected":false},"excerpt":{"rendered":"<p>Merhaba, Bir Developer; geli\u015ftirdi\u011fi yaz\u0131l\u0131mda do\u011fru algoritma, performans, d\u00fc\u015f\u00fck maliyet vs. gibi fakt\u00f6rleri g\u00f6z \u00f6n\u00fcne alarak s\u00fcreci i\u015fletmektedir. Lakin bu fakt\u00f6rler kadar \u00f6nemli olan bir di\u011fer husus ise yaz\u0131lan kodlar\u0131n okunabilirlik derecesinin bir ba\u015fka&#46;&#46;&#46;<!-- AddThis Advanced Settings generic via filter on get_the_excerpt --><!-- AddThis Share Buttons generic via filter on get_the_excerpt --><\/p>\n","protected":false},"author":1,"featured_media":8497,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2443,2145],"tags":[2440,2459,2460],"class_list":["post-8527","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ecmascript-6","category-node-js","tag-ecmascript-6","tag-ecmascript-6-promise-yapisi","tag-promise-yapisi"],"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/posts\/8527","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/comments?post=8527"}],"version-history":[{"count":15,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/posts\/8527\/revisions"}],"predecessor-version":[{"id":8542,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/posts\/8527\/revisions\/8542"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/media\/8497"}],"wp:attachment":[{"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/media?parent=8527"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/categories?post=8527"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/tags?post=8527"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}