نود‌جی‌اس با طعم +ES6

سلام، تو این مطلب توضیح میدم که چطوری از آخرین فیچرهای جاوا اسکریپت توی نودجی‌اس استفاده کنید.

مقدمه: ES6 اصلا چی هست؟

اکما (ECMA)
مخفف European Computer Manufacturer’s Association یک سازمان که استاندارد های کامپیوتری رو تعریف میکنه مثلا استاندارد کیبورد QWERTY رو همین اکما تعریف کرده.

اکمااسکریپت (ECMAScript)

یکی از استاندارد های اکما برای زبان های اسکریپتی که به اسم ECMA-262 یا ECMA SCRIPT یا ES معروفه.

هر سال اکما استاندارد خودش رو آپدیت و منتشر میکنه

محیط های اجرایی جاوا اسکریپت (کروم، فایرفاکس،نودجی‌اس و ... ) به مرور زمان طبق تعریف اکما اسکریپت فیچر‌های جدید رو پیاده‌سازی و به موتورشون اضافه می‌کنند.

فیچرهایی که هر ورژن نودجی‌اس پشتیبانی میکنه توی لینک زیر لیست شده

مشکل اینه که احتمالا خیلی از فیچرهای باحال توی ورژنی که استفاده می‌کنید(ورژن های TLS) هنوز اضافه نشده!

راه حل این مشکل Babel
Babel : ابزار خیلی هوشمند که کد با فیچر های جدیدتر رو تبدیل می‌کنه به کدی که برای محیط های اجرایی قدیمی‌تر سازگار باشه.

توی کانفیگ بابل می‌تونید مشخص کنید محیط اجرایی هدف چیه،‌ و بر اساس اون هدف فقط فیچر هایی که پیاده سازی نشده‌ان رو تبدیل کنه. (babel/preset-env)

برای شروع سریع از ریپازیتوری زیر استفاده می‌کنیم.

ریپازیتوری رو کلون می‌کنیم:

git clone https://github.com/semycolon/node-babel-nodemon-starter.git
cd node-babel-nodemon-starter

بعدش Dependency ها رو نصب می‌کنیم، با پکیج منیجر مورد ایلاقه مون

npm i # or yarn

اجرای اسکریپت dev :

npm run dev

بعد از اجرای اسکریپت dev به مسیر src/index.js برید و شروع به نوشتن کد با فیچر های جدید می‌کنیم.

بعد از هر ذخیره سازی، کد ریستارت میشه به کمک nodemon و برای ریستارت بدون دردسر از killport هم استفاده شده بصورت پیشفرض روی پورت ۸۰۸۰

بعد از اتمام کارتون، میتونید از کدی که نوشتید خروجی سازگار با محیط اجرایی‌ هدف‌تون بگیرید.

npm run babel
node dist.bundle.js

فایل خروجی رو میتونید بدون نیاز به babel و با node براحتی اجرا کنید.

اضافه کردن babel به پروژه های قبلی

از همین ریپازیتون بالا استفاده کنید و فایل های babelrc , nodemon.json رو توی مسیر پروژه اضافه کنید با توجه به package.json ، اسکریپت و dependency هاتون رو آپدیت کنید.

اطلاعات بیشتر در مورد کانفیگ babel

لیست فیچر های ES6

لیست preset ها:

پریست env :‌ آخرین فیچرهارو پشتیبانی می‌کنه و بر اساس محیط اجرایی هدف فیچر هایی که پیاده‌سازی شده رو تبدیل نمی‌کنه، در نتیجه حجم فایل bundle بهینه‌است.

پریست flow: شبیه به تایپ اسکریپت، تایپ متغیر هارو میتونید مشخص کنید و بصورت استاتیک تایپ متغیرهارو چک میکنه.
پریست React : پشتیبانی از jsx رو اضافه می‌کنه.

پریست TypeScript : کد های نوشته شده در typeScript رو به جاوا اسکریپت تبدیل میکنه.