解构嵌套参数，未定义错误

Question

解构时我不断得到 payload undefined:

let videosArray = [];
if (payload.videos) {
  const {
    payload: { videos }
  } = action;
  videosArray = videos;
}

return videosArray;

如何检查未定义？我尝试了下面的检查，但不断收到错误消息：

   if (typeof payload !== "undefined") {

Answer 1

您需要像这样定义操作 const action = {payload: {videos: ["Matrix", "Star Wars"]}}

并且您可以像这样检查有效载荷是否未定义 if(action && action.payload) 然后您可以进行破坏操作。

Answer 2

你只需要确保首先定义了动作，然后访问它的参数而不是自己调用负载。在您的示例中，当您尝试访问 payload 时，它看起来好像未声明 [=13=]

function getVideos(action) {
  if (action && action.payload && action.payload.videos) {
    const {payload: {videos}} = action;
    return videos;
  }

  return [];
}

console.log(getVideos()); // action undefined, expected []
console.log(getVideos({})); // payload undefined, expected []
console.log(getVideos({payload: {}})); // videos undefined, expected []
console.log(getVideos({payload: {videos: [1,2,3]}})); // expected [1,2,3]

当然，如果你真的想通过解构来完成任务，你可以简单地创建一些默认值，如下所示：

function getVideos(action) {
  const {payload: {videos=[]}={}} = action || {};
  return videos;
}

console.log(getVideos()); // action undefined, expected []
console.log(getVideos({})); // payload undefined, expected []
console.log(getVideos({payload: {}})); // videos undefined, expected []
console.log(getVideos({payload: {videos: [1,2,3]}})); // expected [1,2,3]

Answer 3

您可以在不解构的情况下进行检查和默认值。

function getVideos(action) {
    return action && action.payload && action.payload.videos || [];
}

console.log(getVideos());                 // action undefined, expected []
console.log(getVideos({}));              // payload undefined, expected []
console.log(getVideos({ payload: {} }));  // videos undefined, expected []
console.log(getVideos({ payload: { videos: [1, 2, 3] } })); // expected [1, 2, 3]

解构嵌套参数，未定义错误

Destructuring nested params, undefined error

javascript

object

destructuring