JavaScript:ECMAScript 6 - ECMAScript 2015

از ویکی کد
پرش به ناوبری پرش به جستجو
میانبر:
الگو:اج
دورهٔ آموزشی جاوااسکریپت
Javascript.jpg
Tutorial
۱آموزش جاوااسکریپت
۲مقدمه‌ای بر جاوااسکریپت
۳JavaScript:قوانین و اصول اولیه زبان جاوااسکریپت
۴JavaScript:خروجی جاوااسکریپت
۵JavaScript:عبارت‌ها در جاوااسکریپت
۶JavaScript:شیوهٔ نوشتن (Syntax) عبارات یا دستورات در جاوااسکریپت
۷JavaScript:نظرات یا کامنت‌ها (Comments) در جاوااسکریپت
۸JavaScript:متغیرها در جاوااسکریپت
۹JavaScript:عملگرهای جاوااسکریپت
۱۰JavaScript:عملگرهای ریاضی در جاوااسکریپت
۱۱JavaScript:عملگرهای مقداردهی در جاوااسکریپت
۱۲JavaScript:انواع داده‌ها در جاوااسکریپت
۱۳JavaScript:توابع در جاوااسکریپت
۱۴JavaScript:اشیاء (object) در جاوااسکریپت
۱۵JavaScript:رویدادها در جاوااسکریپت
۱۶JavaScript:رشته‌های متنی (string) در جاوااسکریپت
۱۷JavaScript:متدهای نوع داده متنی یا رشته‌ای در جاوااسکریپت
۱۸JavaScript:اعداد در جاوااسکریپت
۱۹JavaScript:متدهای داده‌های عددی در جاوااسکریپت
۲۰JavaScript:آرایه‌ها در جاوااسکریپت
۲۱JavaScript:متدهای آرایه در جاوااسکریپت
۲۲JavaScript:مرتب‌سازی آرایه‌ها در جاوااسکریپت
۲۳JavaScript:متدهای پیمایش آرایه در جاوااسکریپت
۲۴JavaScript:اشیاء تاریخ و زمان در جاوااسکریپت
۲۵JavaScript:فرمت‌های تاریخ و زمان در جاوااسکریپت
۲۶JavaScript:متدهای دریافت تاریخ و زمان در جاوااسکریپت
۲۷JavaScript:متدهای تنظیم زمان و تاریخ در جاوااسکریپت
۲۸JavaScript:شی ریاضی (Math) در جاوااسکریپت
۲۹JavaScript:ایجاد عدد تصادفی در جاوااسکریپت
۳۰JavaScript:مقادیر بولین (Booleans) در جاوااسکریپت
۳۱JavaScript:عملگرهای منطقی و مقایسه‌ای در جاوااسکریپت
۳۲JavaScript:ساختار if else و else if در جاوااسکریپت
۳۳JavaScript:تکه کد Switch در جاوا اسکریپت
۳۴JavaScript:حلقه For در جاوااسکریپت
۳۵JavaScript:حلقه While در جاوااسکریپت
۳۶JavaScript:کلمات کلیدی Break و Continue در جاوااسکریپت
۳۷JavaScript:تبدیل نوع داده‌ها در جاوااسکریپت
۳۸JavaScript:عملیات‌های بیتی در جاوااسکریپت
۳۹JavaScript:عبارات با قاعده در جاوااسکریپت
۴۰JavaScript:خطاها در جاوااسکریپت - رخ دادن خطا و رفع آن
۴۱JavaScript:Scope در جاوااسکریپت
۴۲JavaScript:Hoisting یا جا به جایی کدها در جاوااسکریپت
۴۳JavaScript:استفاده از مد یا حالت سخت‌گیرانه (use strict) در جاوااسکریپت
۴۴JavaScript:کلمه کلیدی This در جاوااسکریپت
۴۵JavaScript:کلمه کلیدی Let در جاوااسکریپت
۴۶JavaScript:ثابت‌ها در جاوااسکریپت
۴۷JavaScript:تعریف توابع به صورت پیکان
۴۸JavaScript:کلاس‌ها در جاوااسکریپت
۴۹JavaScript:اشکال‌زدایی در جاوااسکریپت
۵۰JavaScript:راهنمای استایل و استانداردهای کدنویسی در جاوااسکریپت
۵۱JavaScript:بهترین تمرینات جاوااسکریپت
۵۲JavaScript:اشتباهات رایج در برنامه‌نویسی جاوااسکریپت
۵۳JavaScript:کارایی در جاوااسکریپت
۵۴JavaScript:کلمات رزرو شده در جاوااسکریپت
۵۵JavaScript:ورژن‌های جاوااسکریپت
۵۶JavaScript:ECMAScript 5 - JavaScript 5
۵۷JavaScript:ECMAScript 6 - ECMAScript 2015
۵۸JavaScript:جیسون (JSON) در جاوااسکریپت
---

ECMAScript6 با نام ES6 و ECMAScript2015 نیز شناخته می‌شود. [۱]

برخی از مردم این ورژن را JavaScript 6 نیز می‌نامند.

این فصل به برخی از ویژگی‌های جدید در ES6 اشاره می‌کند.

  • کلمهٔ کلیدیletدر جاوااسکریپت
  • کلمهٔ کلیدیconstدر جاوااسکریپت
  • شیوه تعریف تابع به صورت پیکان یا فلش
  • کلاس‌های جاوااسکریپت
  • مقداربرای پیشفرض پارامترهای تابع
  • متدArray.find()·
  • متدArray.findIndex()
  • عملگر توان(**) (ورژن Ecma Script 2016)


سازگاری مرورگرها با Es6 (ECMAScript 2015)

ورژن ۱۰ مرورگر سافاری و ورژن ۱۴ مرورگر Edge اولین مرورگرهایی بودند که به طور کامل از Es6 پشتیبانی می‌کردند:

کروم Edge فایرفاکس سافاری اپرا
Chrome58 Edge 14 FireFox 54 Safari 10 Opera 55
ژانویه ۲۰۱۷ اوت ۲۰۱۶ مارس ۲۰۱۷ ژوئیه ۲۰۱۶ اوت ۲۰۱۸

کلمهٔ کلیدی let در جاوااسکریپت

کلمهletبه شما اجازه می‌دهد که یک متغیر را در ناحیه یا Scope یک بلاک تعریف کنید.

مثال

var x = 10;
// Here x is 10
{
  let x = 2;
  // Here x is 2
}
// Here x is 10

کلمهٔ کلیدی const در جاوااسکریپت

کلمهٔ کلیدیconstبه شما این اجازه می‌دهد که یک ثابت (یک متغیر جاوااسکریپت با مقدار ثابت) تعریف کنید.

ثابت‌ها بسیار شبیه به متغیرهایی هستند که با استفاده از کلمه let تعریف می‌شوند، به جز اینکه مقادیر ثابتها قابل تغییر نیستند.

مثال

var x = 10;
// Here x is 10
{
  const x = 2;
  // Here x is 2
}
// Here x is 10

شما می‌توانید در مورد کلماتletوconstدر فصل کلمات کلیدی Let / Const در جاوااسکریپت، مطالب بیشتری را بخوانید.

تعریف تابع به صورت پیکان یا فلش

تعریف تابع به صورت پیکان یا فلش به شما اجازه نوشتن تعریف تابع‌ها را با شیوه نوشتار یا syntax کوتاه تری را می‌دهد.

شما به کلمهٔ کلیدیfunction، کلمهٔ کلیدیreturn، و یک جفت براکت‌ها { } نیازی ندارید.

مثال

// ES5
var x = function(x, y) {
   return x * y;
}

// ES6
const x = (x, y) => x * y;

تابع‌هایی با این روش نوشتار (به انگلیسی: syntax) واژهٔ کلیدی This خود را ندارند. آنها برای تعریف متدهای شیء، مناسب نیستند.

تابع‌هایی با این روش نوشتار (به انگلیسی: Syntax) به بالای اسکریپت جابه‌جا (به انگلیسی: hoisted) نمی‌شوند. آنها را می‌بایست قبل از استفاده، تعریف کرد.

استفاده از واژهٔconstبسیار روش مطمئن تری نسبت به واژهٔvarاست، زیرا که یک تابع همیشه یک مقدار ثابت را برمی‌گرداند.

شما نمی‌توانید در صورتی که تابع شما تک عبارتی است کلمهٔ کلیدیreturnو یک جفت براکت‌ها یعنی { } را فراموش کنید. به خاطر این امر عادت خوبی است که اگر آنها را به صورت زیر بنویسید:

مثال

const x = (x, y) => { return x * y };

شما می‌توانید مطالب بیشتری را در این مورد در فصل تعریف توابع به صورت پیکان یاد بگیرید.

کلاس‌ها

در ورژن ES6 مفهوم کلاس‌ها اضافه شدند.

یک کلاس نوعی تابع است، اما به جای استفاده از کلمهٔ کلیدیfunctionبرای تعریف آن از کلمهٔ کلیدیclassاستفاده می‌کنیم و ویژگی‌های آن درون متدconstructor()مقدار دهی می‌شود.

از کلمهٔ کلیدیclassبرای ساختن یک کلاس (به انگلیسی: Class) استفاده کنید، و همیشه به آن متد سازنده (به انگلیسی: Constructor) را اضافه کنید.

متد سازنده، هر زمانی که شیءای از کلاس مقداردهی شود فراخوانی می‌شود.

مثال

یک تعریف ساده کلاس برای کلاسی با نام “Car”:

class Car {
  constructor(brand) {
    this.carname = brand;
  }
}

حال شما می‌توانید با استفاده از کلاس Car شی بسازید:

مثال

ساخت یک شی بر پایه کلاس Car به نام “mycar”:

class Car {
  constructor(brand) {
    this.carname = brand;
  }
}
mycar = new Car("Ford");

شما می‌توانید در فصل کلاس‌ها در جاوااسکریپت مطالب بیشتری را در این مورد بخوانید.

مقدار پیش‌فرض پارامترهای تابع

ورژن ES6 به تابع‌ها این اجازه را می‌دهد که برای پارامترهای خود مقادیر پیش‌فرض داشته باشند.

مثال

function myFunction(x, y = 10) {
  // y is 10 if not passed or undefined
  return x + y;
}
myFunction(5); // will return 15

متد ()Array.find

متدfind()مقدار اولین عنصر آرایه را که با یک شرط همخوانی دارد را برمی‌گرداند.

این مثال اولین عنصری که مقدار آن بزرگتر از ۱۸ است را پیدا می‌کند (مقدار آن را برمی‌گرداند):

مثال

var numbers = [4, 9, 16, 25, 29];
var first = numbers.find(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

توجه داشته باشید که تابع، ۳ آرگومان دارد:

  • مقدار عنصر آرایه
  • اندیس یا موقعیت عنصر
  • خود آرایه

متد ()Array.findIndex

متدfindIndex()موقعیت یا شماره اندیس اولین خانه ای را که با یک شرط هم‌خوانی داشته باشد را برمی‌گرداند.

این مثال اندیس اولین عنصری را که بزرگتر از ۱۸ است را برمی‌گرداند:

مثال

var numbers = [4, 9, 16, 25, 29];
var first = numbers.findIndex(myFunction);

function myFunction(value, index, array) {
  return value > 18;
}

توجه داشته باشید که تابع ۳ آرگومان دارد:

مقدار عنصر آرایه

اندیس یا موقعیت عنصر

خود آرایه

ویژگی‌های جدید برای شیء Number

ES6 ویژگی‌های زیر را به شیء Number اضافه کرده‌است:

  • EPSILON
  • MIN_SAFE_INTEGER
  • MAX_SAFE_INTEGER

مثال

var x = Number.EPSILON;

مثال

var x = Number.MIN_SAFE_INTEGER;

مثال

var x = Number.MAX_SAFE_INTEGER;

متدهای جدید شیء Number

ورژن Es6 دو متد زیر را به شیء Number اضافه کرده‌است:

  • Number.isInteger()
  • Number.isSafeInteger()

متد ()Number.isInteger

متدNumber.isInteger()در صورتی که آرگومان آن یک عدد صحیح یا Integer باشد مقدارtrueرا برمی‌گرداند.

مثال

Number.isInteger(10);        // returns true
Number.isInteger(10.5);      // returns false

متد ()Number.isSafeInteger

یک عدد صحیح safe عددی است که بتوان آن را دقیقاً مانند یک عدد اعشاری از نوعdoubleنوشت.

متدNumber.isSafeInteger()در صورتی که مقدار آرگومان آن یک عدد صحیح safe باشد، مقدارtrueرا برمی‌گرداند.

مثال

Number.isSafeInteger(10);    // returns true
Number.isSafeInteger(12345678901234567890);  // returns false


متدهای کلی (به انگلیسی: Global) جدید

در ورژن Es6 دو متد جدید Global اضافه شده‌است:

  • isFinite()
  • isNaN()

متد ()isFinite

متد global یا کلیisFinite()در صورتی که آرگومان آن از نوع Infinity (به فارسی: بی‌نهایت) یاNaNباشد، مقدارfalseرا برمی‌گرداند.

در غیر اینصورت مقدارtrueرا برمی‌گرداند:

مثال

isFinite(10/0);       // returns false
isFinite(10/1);       // returns true

متد ()isNan

متد global (به فارسی: کلی) isNaN()در صورتی که آرگومان آن از نوعNaNباشد مقدارtrueرا برمی‌گرداند. در غیراینصورت مقدارfalseرا برمی‌گرداند:

مثال

isNaN("Hello");       // returns true

عملگر به توان رساندن

عملگر توان(**)عملوند اول خود را به توان عملوند دوم خود می‌رساند.

مثال

var x = 5;
var z = x ** 2;          // result is 25

دستورx ** yنتیجه ای مشابه متدMath.pow(x,y)دارد:

مثال

var x = 5;
var z = Math.pow(x,2);   // result is 25

منابع آموزشی