Що роблять фігурні дужки всередині списків параметрів функцій у es6?

122

Я постійно бачу функції, схожі на це в кодовій базі, над якою я працюю:

const func = ({ param1, param2 }) => {
  //do stuff
}

Що саме це робить? Мені важко знайти його в google, тому що я навіть не впевнений, як це називається, або як описати це в пошуку Google.

javascript ecmascript-6

— Натан
джерело

можливий дублікат синтаксису параметра об'єкта для функцій javascript?

— Берги

117

Він руйнує , але міститься в межах параметрів. Еквівалент без руйнування буде:

const func = o => {
    var param1 = o.param1;
    var param2 = o.param2;
    //do stuff
}

— Джеймс Торп
джерело

12

Просто для того, щоб переконатися, що я правильно розумію, в основному це означає, що об’єкт, що містить ці властивості, буде переданий у функцію, а потім у межах функції, до властивостей можна автоматично отримати доступ лише за допомогою їх імені?

— Натан

7

@Nathan Так, див. Розділ про руйнування об'єктів . Зауважте, однак, що оновлення змінних не оновлюватиме оригінальні властивості об'єкта - це не так, як це створює посилання на вихідне значення.

— Джеймс Торп

@JamesThorpe було б краще посилання на developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…

— lsborg

11

Це передача об'єкта як властивості.

Це в основному скорочення для

let param1 = someObject.param1
let param2 = someObject.param2

Інший спосіб використання цієї методики без параметрів полягає в наступному, розглянемо потім на секунду, що деякийObject містить ці властивості.

let {param1, param2} = someObject;

— Оз Лодрігес
джерело

3

Це призначення руйнування об'єкта. Як і я, можливо, ви вважаєте це дивовижним, оскільки схожий на синтаксис деструктуризації об’єктів ES6 виглядає, але НЕ веде себе як буквальна побудова об'єкта.

Він підтримує дуже стисну форму, в яку ви зіткнулися, а також перейменування полів та аргументів за замовчуванням:

По суті, це {oldkeyname: newkeyname = defaultvalue, ...}. ':' НЕ роздільник ключа / значення; '=' є.

Випадок цього рішення дизайну мови полягає в тому, що вам, можливо, доведеться робити такі речі

; ({a, b} = деякий_об'єкт);

Додаткові парени перешкоджають розбору лівих фігурних дужок як блок, а провідна крапка з комою запобігає розбору паронів як виклик функції до функції у попередньому рядку.

Для отримання додаткової інформації див: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment

Остерігайтеся, ключові помилки при призначенні деструктуризації об'єкта НЕ кидають; ви просто закінчуєтесь із "невизначеними" значеннями, будь то ключова помилка чи якась інша помилка, яка мовчки поширюється як "невизначена".

> var {rsienstr: foo, q: bar} = {p:1, q:undefined};
undefined
> foo
undefined
> bar
undefined
>

— Ендрю Вагнер
джерело