بررسی Enhanced Object literals در جاوااسکریپ

در این آموزش ، با Syntax جدید تعریف Enhanced object literal آشنا می شویم که بسیار کد ما را خواناتر و منعطف تر می کند.

یکی از مشهورترین pattern ها برای ایجاد objects در جاوا اسکریپت(javascript) Enhanced object literal است.

function createMachine(name, status) {
    return {
        name: name,
        status: status
    };
}

تابع ()createMachine دو تا arguments  به نام های name و status می گیرد و یک object literal یا دو تا properties به نام های name و status برمی گرداند.properties های name  و status مقادیر خودشون رو از پارامترهای name و status می گیرد.این syntax به نظر اضافی است زیرا name  و status  دو بار برای name و value تکرار شده اند.

ویژگی جدید ES6 به شما این امکان را می دهد که وقتی property  یک property با نام local variable یکسان است ، نام آن را بدون colon  و value حذف کنید.

برای مثال شما می توانید تابع ()createMachine را در ES6 به شکل زیر بازنویسی کنید:

function createMachine(name, status) {
    return {
        name,
        status
    };
}

هنگامی که property  یک object literal  فقط نام دارد ، موتور جاوا اسکریپت متغیری با همان نام را درsurrounding scope جستجو می کند. اگر موتور جاوا اسکریپت بتواند یکی را پیدا کند ، مقدار متغیر را به property اختصاص می دهد.

به طور مشابه ، می توانید یک object literal را  از م local variables بسازید که در مثال زیر نشان داده شده است:

let name = 'Computer', status = 'On';

let machine = {
    name,
    status
};

برای جا افتادن بیشتر این مفهوم به یک مثال دیگر توجه کنید:

const openingHours = {
    thu: {
        open: 12,
        close: 22,
    },
    fri: {
        open: 11,
        close: 23,
    },
    sat: {
        open: 0,
        close: 24,
    },
};

const restaurant = {
    nameRestaurant: 'Classico Italiano',
    location: 'Via Angelo Tavanti 23, Firenze, Italy',
    categories: ['Italian', 'Pizzeria', 'Vegetarian', 'Organic'],
    starterMenu: ['Focaccia', 'Bruschetta', 'Garlic Bread', 'Caprese Salad'],
    mainMenu: ['Pizza', 'Pasta', 'Risotto'],

    openingHours,

}