分解JS中的對象-嵌套對象

Question

如何處理可能具有未定義內部對象的嵌套對象的結構破壞？

例如。

我有一個xhr請求，該請求返回{person: user: {}}

例如： const xhrResponse = {person: user: 'hi'}}

我只對用戶部分感興趣，所以我破壞了。

const {person: {user}} = xhrResponse

console.log(user) => 'hi'

但是，如果api返回{person: null}該怎么辦

我的銷毀失敗， Cannot match against 'undefined' or 'null'.

我有一個解決方案，但我覺得可能會有一個更優雅的解決方案。

解

const handleResponse(res) => res.person ? res : {person: user: {}}

有沒有更好的方法來解決這個問題？ 甚至以另一種方式，更好地使用單詞有時是觀點的代名詞：D

更完整的用例：

$q.all([somePromise, someOtherPromise, getPersonPromise])
  .then(promises => [vm.promise1, vm.promise2, {person: {user: vm.user}] = promises);

Answer 1

您還可以為嵌套內容添加默認值：

const handleResponse = ({ person: { user = {}} = {}} = {}) => {
  console.log(user);
}

handleResponse({});

（我假設您根據箭頭功能使用es6）

編輯：很抱歉，僅適用於未定義的值，但不適用於值為null的情況，因為答案可能對其他讀者有用

Answer 2

你能用這個嗎？

const {user} = xhrResponse.person || {};

---

對於更新的用例，我想知道這是否可行？

$q.all([
  somePromise,
  someOtherPromise,
  getPersonPromise.then(res => (res.person || {}).user)
]).then(promises => [vm.promise1, vm.promise2, vm.user] = promises);

Answer 3

就個人而言，我希望清楚地看到函數接收的參數。

我將采用以下解決方案：

const handleResponse = (response) => {
  const { person: { user } = {} } = response || {};

  // since user is the value to be used you don't need to set a default unless you need it
  if (user) // do your stuff here
}

繁瑣的解構可能會以不可讀的代碼結束

因此，進行漸進式解構對我來說是一個更好的解決方案。