آشنایی با ES6 (ES6)
در این صفحه آشنایی با ES6 را خیلی ساده می بینیم. می فهمی ES6 چه ربطی به جاوااسکریپت و ری اکت دارد. همچنین می فهمی چرا قبل از ری اکت باید ES6 بلد باشی.
آشنایی با ES6 دقیقا یعنی چه؟
ES6 مخفف ECMAScript 6 است. ECMAScript اسم استاندارد زبان جاوااسکریپت است. یعنی یک قانون نامه که می گوید جاوااسکریپت باید چطور کار کند. نسخه ششم این استاندارد در سال 2015 منتشر شد و به آن ECMAScript 2015 هم می گویند.
می توانی ES6 را مثل نسخه جدید کتاب قوانین بازی تصور کنی. وقتی قوانین به روز می شوند، حرکت های جدید و راحت تری در بازی داری. در جاوااسکریپت هم ES6 کلی امکانات ساده تر و خواناتر به کد اضافه کرد.
چرا برای ری اکت باید ES6 بلد باشیم؟
تقریبا تمام کدهای ری اکت مدرن با قواعد ES6 نوشته می شوند. اگر ES6 را بلد نباشی، کدها شبیه یک متن رمز شده می شوند. اما وقتی مفاهیم ES6 را یاد بگیری، خواندن و نوشتن کامپوننت ها خیلی راحت می شود.
در فصل های بعدی برای هر مبحث ES6 یک بخش جدا داریم. می توانی روی هر موضوع تمرکز کنی و کم کم همه چیز برایت جا بیفتد. هر کدام از این ویژگی ها در پروژه های واقعی ری اکت زیاد استفاده می شوند.
مهم ترین ویژگی های ES6 برای ری اکت
در منبع چند ویژگی مهم ES6 معرفی شده است. این ها ستون های اصلی جاوااسکریپت مدرن هستند و در ری اکت هم همیشه می بینی شان:
- کلاس ها (Classes): ساختن الگو برای اشیا، شبیه قالب کارنامه.
- توابع پیکانی (Arrow Functions): نوشتن تابع کوتاه و جمع وجور.
- متغیرها با let و const: جایگزین امن تر برای var قدیمی.
- متدهای آرایه مثل
.map(): کار گروهی روی لیست ها. - ساختاردهی (Destructuring): باز کردن سریع اجزای آرایه و شیء.
- ماژول ها (Modules): جدا کردن کدها در فایل های منظم و تمیز.
- عملگر سه تایی (Ternary): نوشتن if کوتاه در یک خط.
- عملگر پخش (Spread): پخش کردن اعضای آرایه یا شیء در جای دیگر.
نکته: هر کدام از این سرفصل ها در یک صفحه جدا توضیح داده می شود. مثلا کلاس ها در صفحه «Classes»، و توابع پیکانی در صفحه «Arrow Functions» بررسی می شوند.
چطور شروع کنم ES6 را برای ری اکت یاد بگیرم؟
برای شروع آشنایی با ES6 بهتر است یک مسیر ساده و مرحله ای داشته باشی. این کار باعث می شود مغزت قاطی نکند و هر مفهوم را جداگانه هضم کند.
- اول صفحه ارتقا (Upgrade) را مرور کن تا بدانی چرا نسخه های جدید مهم اند.
- بعد دوباره به همین صفحه آشنایی با ES6 برگرد و سرفصل ها را نگاه کن.
- سپس سراغ صفحه کلاس ها برو و روی همان مبحث تمرکز کن.
می توانی هر بار فقط روی یک ویژگی مثل متدهای آرایه تمرکز کنی. مثلا چند تمرین کوچک با .map() انجام بده. این کار شبیه حل تمرین ریاضی است؛ هر چه بیشتر تمرین کنی، دستت راه می افتد.
ارتباط ES6 با بخش های بعدی آموزش ری اکت
در صفحه مقدمه (Intro) دیدی که ری اکت یک کتابخانه جاوااسکریپتی است. حالا ES6 می گوید این جاوااسکریپت بهتر است چگونه نوشته شود. در صفحه کلاس ها، توابع پیکانی و بقیه سرفصل ها دقیقا همین ایده را روی کد عملی می کنیم.
تقریبا در تمام مثال های بعدی ری اکت، ES6 حضور دارد. مثلا وقتی کامپوننت می نویسی، زیاد با توابع پیکانی و ساختاردهی روبه رو می شوی. پس هر قدر این صفحه و سرفصل های مرتبط را بهتر بفهمی، خواندن مثال های بعدی برایت ساده تر می شود.
جمع بندی سریع
- ES6 نسخه مدرن استاندارد جاوااسکریپت است.
- ری اکت تقریبا همیشه با قواعد ES6 نوشته می شود.
- کلاس ها، توابع پیکانی و let/const از مهم ترین ویژگی ها هستند.
- یادگیری مرحله ای هر سرفصل ES6 فهم ری اکت را خیلی راحت تر می کند.