متد fetch چطوری کار می‌کنه؟
زمانی که ما یه ریکوئست می‌زنیم، متد fetch توی دو شاخه اجرا می‌شه:

const todo = fetch('https://jsonplaceholder.typicode.com/todos/1')
      .then(response => response.json())

شاخه اول:
جاوااسکریپت بلافاصله یه آبجکت می‌سازه به اسم Promise Object که مقادیر زیر رو داره:

{
    value: undefined,
    onFulfilled: function[],
    onRejection: function[]
}

و با identifier یعنی todo داخل global memory ذخیره می‌شه.
همین‌طور، یه network request روی وب‌براوزر ثبت می‌کنه.

شاخه دوم:
وب‌براوزر ریکوئست رو می‌فرسته به سرور و هر زمانی که response اومد، اون رو داخل todo.value ذخیره می‌کنه.

onFulfilled چیه؟

این یه آرایه از فانکشن‌هاست که وقتی todo.value آپدیت شد، خودشون auto call می‌شن.
یعنی هر فانکشنی که داخل این آرایه باشه، به محض آپدیت شدن value اجرا می‌شه.

ولی ما نمی‌تونیم مستقیم فانکشنی رو به onFulfilled اضافه کنیم، چون یه hidden property هست و دسترسی مستقیم بهش نداریم.
جاوااسکریپت یه متد built-in داده به اسم `then`، که هر چیزی رو بهش پاس بدیم، خودش می‌ره داخل همون آرایه می‌ذاره.

`onRejection` چیه؟

این هم یه آرایه از فانکشن‌هاست برای زمانی که network request به خطا بخوره.
وقتی ریکوئست fail می‌کنه، نه تنها فانکشن‌های داخل onFulfilled اجرا نمی‌شن، بلکه فانکشن‌های داخل onRejection auto trigger می‌شن.

مثل onFulfilled`، `onRejection هم یه hidden property هست و دسترسی مستقیم نداریم.
با استفاده از متد catch می‌تونیم فانکشن خودمون برای error handling رو داخلش قرار بدیم.



پ‌ن:then و catch هر دو توسط Promise ارائه می‌شن و راه ما برای دسترسی به فانکشن‌هاشون هستن.

#js #deep #behind_the_scenes