نسخه ای زبان جاوا اسکریپت که از استاندارد های بین المللی ecma استفاده می کند را ecma script می نامیم. نمی توان ecma script را به عنوان زبان مادر جاوا اسکریپت خواند زیرا که جاوا اسکریپت امکاناتی دارد که در استاندارد ecma-262 تعریف نشده است.

ecma-262 یک استاندارد تعریف شده توسط ecma international می باشد که شامل مشخصه های لازم برای یک زبان اسکریپت نویسی می باشد. ecma script 6 نیز ششمین نسخه از جاوا اسکریپتی است که بر پایه استانداردهای ecma-262 نوشته شده است ( به عبارتی ششمین نسخه از استانداردهای ecma-262 می باشد).

Javascript Processor

Babel : یک پردازنده جاوا اسکریپت است که می‌تواند کدهای ES6 را به کدهای ES5 تبدیل کند تا موتور جاوا اسکریپت ما کدهای ES6 را با قطعیت اجرا کند. پردازنده های مختلفی برای تبدیل کد های جاوا اسکریپت وجود دارد :

• Babel
• TypeScript
• CoffeeScript
• LiveScript

ویژگی های جدید در ES6

مواردی که در ذیل مورد بررسی قرار می گیرد تغییرات ES6 نسبت به ES5 است که در سال 2015 ارائه شده است ، به همین دلیل برخی به آن ECMAScript 2015 نیز می گویند.

JavaScript let : یک نوع داده جدید برای تعریف متغیر ها می باشد که جایگزین کلمه کلیدی var می شود و تفاوت آن با var این است که تنها در scope خود قابل دسترس است.

var x = 10;
{
    let x = 5;
    var y = 12;
    console.log("let x = " + x);
}
console.log("var x = " + x);
console.log("var y = " + y);

در مثال بالا در scop باز و بسته شده x برابر با ۵ است و در خارج از آن از برابر ۱۰ می باشد با توجه به ناحیه دسترسی متغیر ها var , let .

برای فهم بهتر موضوع یک تابع را اجرا می کنیم که با فاصله زمانی یک ثانیه اعداد ۱ تا ۱۰ را برای ما در کنسول نمایش دهد :

function counter(x){
    for(let i=1;i<x;i++){
      setTimeout(function() {
          console.log(i);
      }, 1000);  
    }
}
counter(10);

تابع بالا حاوی یک حلقه است که ۱۰ سیکل دارد و در هر سیکل تابع setTimeout را که به ازای ۱۰۰ میلی ثانیه تاخیر متغیر i را نمایش می دهد فراخوانی می کند. پس از اجرای تابع بالا ۱۰ سیکل حلقه بلافاصله اجرا می شوند و ده تابع setTimeout در صف اجرا داریم که بلافاصله بعد از اتمام ۱۰۰۰ میلی ثانیه باید اجرا شوند. چون متغیر i از نوع let است به ازای هر سیک از درون حلقه که به تابع setTimeout داده می شود برابر مقدار جاری است. پس خروجی بعد از یک ثانیه اعداد ۱ تا ۹ می باشد.

اگر در حلقه متغیر i را از نوع var تعریف می کردیم حلقه ۱۰ تابع setTimeout را به صف اضافه می کرد و چون در پایان حلقه متغیر i برابر با ۹ بود نهایتا عدد ۹ ده بار نمایش داده می شد.

JavaScript const : نوع داده ای از نوع ثوابت با ویژگی رفتاری let از نظر سطح دسترسی در scop خودش.

var c = "global value";
{
    const c = "constant value";
    console.log(c); // constant value
}
console.log(c); //global value

Arrow Functions : نوع جدیدی از سینتکس تعریف تابع خطی یا همان closure ها می باشد که می توان از آن ها در این نوع سینتکس استفاده کرد :

var xArrow = (x,y) => console.log(x*y);
xArrow(10,12);

/* using arrow function As closure */
function SlowHello(){
    setTimeout(() => {
        console.log("Hello world");
    }, 1000);
}

Javascript closure : توابع خطی می تواند به صورت داخلی نیز فراخوانی شوند. یعنی شما می توانید عملیاتی را متناسب با عملیاتی دیگر انجام دهید . مثلا با فراخوانی یک تابع عملا شما یک تابع جدید با توجه به عملکرد تابع فراخواننده ساخته اید.

function sum(a){
    return function(b){
        return a+b;
    }
}

var adder2 = sum(2);
var result = adder2(5);
var result = sum(2)(6);
console.log(result);

به عبارت دیگر با فراخوانی یک تابع و ریختن آن در متغیر ،‌ آن متغیر یک حاوی یک تابع جدید (تابع درونی تابع فرخواننده) می باشد.

اگر دستورات این تابع یک خطی باشد نتیجه را خودکار بر می گرداند اما اگر در بین {} قرار گیرد نتیجه باید با تابع return برگردد.

/* multiline */
let b = a.map((item,index) => {
    return item*2
  });
/* one line */
let b = a.map((item,index) => item*2 );

Default parameter values : در ES6 شما می توانید مقدار پیشفرض به پارامتر های یک تابع تخصیص دهید:

function defaultVal(x,y=1){
    console.log(x*y);
}
defaultVal(2);
defaultVal(2,4);

iif : تعریف و اجرای همزمان تابع یا iif که مخفف immediately invoke function که به شکل زیر تعریف می شود :

/* iif = immediately invoke function */
(function(text){
    console.log(text);
})("Hello World");

در کد بالا تابع تعریف و فراخوانی شده و همزمان رشته ‍’Hello World’ نیز به عنوان پارامتر به آن داده شده است.

JavaScript Classes : ایجاد یک کلاس با ویژگی های ارث بری extends و ساخت اشیا مختلف از روی کلاس ها :

class Car {
    constructor(name,engine){
        this.name = name;
        this.engine = engine;
    }
    printInfo(){
        console.log("car name is : " + this.name);
        console.log("engin power is: " + this.engine);
    }
}

var tiba = new Car("tiba",1500);
tiba.printInfo();

extends : با استفاده از کلمه کلیدی extends می توانید یک کلاس جدید با استفاده کلاس دیگر بسازید ( خاصیت ارث بری )

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

  present() {
    return 'I have a ' + this.brand;
  }
}

class Model extends Car {
  constructor(name, mod) {
    super(name);
    this.model = mod;
  }  
  show() {
      return this.present() + ', it is a ' + this.model
  }
}
mycar = new Model("pride", "tiba");
mycar.show();

در درون هر کلاس با توجه به مکانی که در آن حضور داریم با استفاده از کلمه کلیدی this می توانیم به شئ یک کلاس دسترسی داشته باشیم . همچنین می توان با استفاده از متد super() به متد والد دسترسی پیدا کرد.

اشیا نیز از روی هم ساخته می شوند . به طور مثال ابتدا شئ ali را می سازیم و بعد شئ sahar را از روی ali می سازیم و name آن را تغییر می دهیم:

console.log(this);
var ali = {
    name: "Ali",
    getName: function(){
        console.log(this.name);
    }
}
ali.getName();
var sahar = {...ali,name: "sahar"}
sahar.getName();

this : در هر کجای برنامه کلمه کلیدی this به اولین شئ ساخته شده در بالای خود اشاره دارد. معمولا در اجرای برنامه هایی که در یک فایل html قرار دارند بالا ترین شئ window می باشد.

با استفاده از متد call می توان شئ جاری متد را تغییر داد و آن را اجرا کرد. این متد به عنوان پارامتر اول شئ را می گیرد و پارامتر های بعدی را برای متد فراخوانی شده پیاده سازی می کند.

var ali = {
    name: "Ali",
    getName: function(){
        console.log(this.name);
    },
    sayHello: function(hello){
        console.log(hello + this.name);
    }
}
ali.getName(); //ali
/* ------------ call ------------ */
var javad = {name: "javad"}
ali.getName.call(javad); // javad
/* ------------ apply ------------ */
ali.sayHello.call(javad,"hello "); //hello javad

متد apply نیز مانند call عمل می کند با این تفاوت که پارامتر های متد فراخواننده را به صورت آرایه می گیرد. متد bind نیز شئ را تغییر می دهد و برای فراخوانی متد باید از call استفاده کرد.