我如何分解物体

时间:2019-04-08 15:07:52

标签: javascript es6-modules

我有一个功能

const displayUserPhotoAndName = (data) => {
  if (!data) return;

  // add your code here

  clearNotice();

};

在第一个if(!data)返回之后;如果未提供预期的数据参数,则终止该函数的语句,创建一个对数据参数进行解构并从中获取结果属性的语句;

在下一行中创建第二条语句来解构刚刚创建的结果变量,并从中获得第一项(它是一个数组!请参见https://randomuser.me/api/)。解构的数组项应声明为配置文件。这表示要从您要显示在应用程序中的API调用中获取的用户的个人资料数据。

const displayUserPhotoAndName = (data) => {
    if(!data) return;    

    // add your code here
    const {results: results} = data;
    const {profile: results} = results;

这是我现在的位置,但是我仍然收到一条错误消息,内容为“您尚未从传递给displayUserPhotoAndName函数的数据获得的结果中解构profile属性。将非常感谢您的帮助...

3 个答案:

答案 0 :(得分:1)

您可以通过两种方式执行此操作:

  1. 您的两个步骤:

    const {results} = data;
    const {profile} = results;
    
  2. 或者一步一步

    const {results: {profile}} = data;
    

为了更好地理解,您应该查看the documentation of object destructuring.

答案 1 :(得分:0)

这里有个例子:

const data = {
    results: {
        name: "test1",
        surname: "123"
    },
    profile: {
        name: "test2",
        surname: "321"
    }
};

const { results, profile } = data;

console.log(results);
console.log("====");
console.log(profile);

答案 2 :(得分:0)

如果需要使用结果数组中的第n个元素,则可以执行以下操作

{ results: { n: profile } } = data;

let data = { results: [1, 2, 3, 4] }

let { results: { 0: profile1, 2: profile2 } } = data;

console.log(profile1)
console.log(profile2)

即使您可以进行进一步的破坏

let data = { results: [{ name: 'myname1', gender: 'male' }, { name: 'myname2', gender: 'male' }, { name: 'myname3', gender: 'female' }, { name: 'myname4', gender: 'male' }] }

let { results: { 0: profile1, 2: { name, gender } } } = data;

console.log(profile1)
console.log(name)
console.log(gender)