Почему параметр функции обработчика then() заключен в фигурные скобки в этом запросе POST?

#javascript

#javascript

Вопрос:

Итак, вот весь запрос:

 fetch(`/api/quotes?quote=${quote}amp;person=${person}`, {
    method: 'POST',
  })
  .then(response => response.json())
  .then(({quote}) => {
    const newQuote = document.createElement('div');
    newQuote.innerHTML = `
    <h3>Congrats, your quote was added!</h3>
    <div class="quote-text">${quote.quote}</div>
    <div class="attribution">- ${quote.person}</div>
    <p>Go to the <a href="index.html">home page</a> to request and view all quotes.</p>
    `
    newQuoteContainer.appendChild(newQuote);
  });  

И это строка, которую я не могу понять

 .then(({quote}) => {
  

Почему фигурные скобки вокруг параметра «кавычка»? Как это работает?
Тело ответа на этот запрос выглядит следующим образом:

 {
  quote: {
            id: number,
            quote: 'some string',
            person: 'some string'
         }
 }
  

Комментарии:

1. developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…

2. developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…

3. Привет, Марчин, на втором шаге then() вы проанализировали тело ответа как Json. итак, следующее, что вам нужно сделать, это просто получить его как then(result) => { console.log(result.quote.id); } . Я не видел ничего подобного ({quote}). проверьте это и дайте мне знать

Ответ №1:

Ваш ответ — это объект с атрибутом quote . { quote } получит этот объект и присвоит quote содержимому свойства quote .

Смотрите этот пример:

 let foo = {
  bar: 5
}

function printbar({bar}) {
  console.log(bar)
}

printbar(foo)  

Это называется «деструктурированием объекта». Проверьте это сообщение для подробного объяснения:https://hacks.mozilla.org/2015/05/es6-in-depth-destructuring /