#TypeScript
#JavaScript

📌آموزش تایپ اسکریپت قسمت اول:

#تایپ_اسکریپت یکی از فریم‌ورک‌های زبان برنامه‌نویسی جاوا اسکریپت هست. زبان TypeScript به عنوان superset زبان JavaScript ارائه شده‌ است. زمانی که جاوا اسکریپت را توسعه بدهیم تبدیل خواهد شد به تایپ اسکریپت پس تایپ اسکریپت قرار نیست که جایگزین زبان برنامه نویسی جاوا اسکریپت شود درواقع ما صرفا جاوا اسکریپت را توسعه دادیم.

در واقع #تایپ_اسکریپت حاصل یک همکاری رسمی بین ماکروسافت و گوگل است. همین موضوع همکاری دو کمپانی قدرتمند برای استفاده از زبان TypeScript بسیار خوشحال‌کننده است. زیرا پشتیبانی این زبان برای مدتی طولانی همواره برقرار است. نکته‌ی قابل توجه این است که شما حتما نباید از زبان تایپ اسکریپت برای کار با انگولار استفاده کنید. زیرا انگولار یک سری API برای استفاده از جاوا اسکریپت به عنوان زبان معیار، ایجاد کرده است و می‌توانید توسط آن به تمام توابع و کتابخانه‌های تایپ اسکریپت دست پیدا کنید. اما توصیه می‌کنیم این زبان قدرتمند را یاد بگیرید زیرا ویژگی‌های بسیاری دارد که کار را برای برنامه‌نویسان و توسعه‌دهندگان بهتر می‌کند.

✅یک سری از Option های که #تایپ_اسکریپت در اختیار ما قرار می دهد:

1️⃣ تایپ اسکریپت توسط «مایکروسافت» پشتیبانی شده است. ضمنا به صورت متن باز بوده که می‌­توان مطابق سلیقه خود، در این زبان برنامه نویسی تغییراتی ایجاد کرد.
2️⃣ پسوند فایل­‌های کدنویسی شده‌­ی توسط زبان تایپ اسکریپت، به صورت TS است (مخفف typescript)
3️⃣ امکان کارکرد بر روی تمامی سیستم عامل ها
4️⃣ در تمامی Host ها از آن میشود استفاده کرد و این مزیت خوبی است.
6️⃣ این PlatForm در همه Browser ها به خوبی عمل خواهد نمود.

@ABlueDeveloper

#Promise
#Javascript

کاربرد Promise در جاوا اسکریپت یا React Native

کاری که Promise برای ما در جاوا اسکریپت انجام می دهد و ری اکت نیتیو دقیقا بطور مشابه است. یعنی زمان هایی که لازم باشد ما را از وقوع رویدادهایی مطلع می کند تا در صورت وقوع رویداد مورد نظرمان ، قطعه کد مربوطه اجرا شود.

خب حالا این به چه درد میخورد؟ برخی از کارها هست در برنامه ما که نمی دانیم دقیقا کی اجرایش به اتمام می رسد. این کارها مثل سایر خطوط کد ما خطی اجرا نمی شوند. مثلا یک در خواست Ajax یا fetch . شبکه دارای تاخیر است. ارسال درخواست و دریافت پاسخ از سمت سرور اندکی طول میکشد. خب ما که نمی توانیم کل برنامه را معطل رسیدن پاسخ سرور کنیم. اگر اینکار کنیم برنامه کند میشود. اصطلاحا دارای لگ می شود و برای کاربر مشهود است.

پس برای جلوگیری از این مشکل جاوااسکریپت این نوع از کدها را بصورت موازی با سایر کدها اجرا می کند و منتظر رسیدن پاسخ سرور نمی ماند. اصطلاحا می گوییم بصورت غیر همزمان یا async اجرا می کند. در حالت نرمال که پس از اجرای هر خط کد به خط بعدی می رود می گوییم sync اجرا می شود.
پس promise برای دستورات async است. پس سناریو کلی اینگونه می شود:
شما یک درخواست مثلا ajax ایجاده کرده و برای سرور می فرستید.نمی دانید پاسخ دقیقا کی می رسد. توابعی را که بعد از رسیدن پاسخ باید اجرا شود به promise می دهید.می روید سراغ اجرای خطوط بعدی کد Promise هم به شما قول می دهد وقتی پاسخ از سرور رسید توابع مورد نظر شما را اجرا کند.
در مثال زیر به نحوه ایجاد یک Promise دقت کنید:

 let myFirstPromise = new Promise((resolve, reject) => {
  // We call resolve(...) when what we were doing asynchronously was successful, and reject(...) when it failed.
  // In this example, we use setTimeout(...) to simulate async code.
  // In reality, you will probably be using something like XHR or an HTML5 API.
  setTimeout(function(){
    resolve("Success!"); // Yay! Everything went well!
  }, 250);
});

@ABlueDeveloper


ورودی constructor آبجکت promise دو تابع به نام resolve و reject است. هنگام اجرای موفقت آمیز درخواست async ما تابع resolve و هنگام اجرای ناموفق آن تابع reject را فراخوانی می کنیم.
به یک مثال دیگر که کاربرد Promise در XMLHttpRequest را نشان می دهد دقت کنید:

 function myAsyncFunction(url) { return new Promise((resolve, reject) => {    const xhr = new XMLHttpRequest();  xhr.open("GET", url);    xhr.onload = () => resolve(xhr.responseText);   xhr.onerror = () => reject(xhr.statusText);    xhr.send();  });}

طور دیگری هم می تواند از promise استفاده کرد. آبجکت Promise دارای دو تابع به نام then و catch است که ترتیب در زمان اجرای موفقیت آمیز و غیر موفقیت آمیز کد async ، تابع ورودی خود را اجرا می کنند. خود then و catch نیز آبجکت promise بر می گردانند. بنابراین می توان چندیدن تا از آنها را بصورت زنجیر یا chain پشت هم بکار برد.
به کاربرد این دوتابع در fetch دقت کنید. این مثال می تواند در ری اکت نیتیو هم کاربرد داشته باشد.
تابع fetch کارش ارسال درخواست http است و خود promise بر می گرداند.

 function getMoviesFromApiAsync() {
  return fetch('https://facebook.github.io/react-native/movies.json')
    .then((response) => response.json())
    .then((responseJson) => {
      return responseJson.movies;
    })
    .catch((error) => {
      console.error(error);
    });
}

برگرفته از سایت جعبه آبی

@ABlueDeveloper