时间戳

首页 > 解决方案 > 为什么当在另一个对象中传播对象时，我在浏览器中得到的输出与在节点中不同？

javascript - 为什么当在另一个对象中传播对象时，我在浏览器中得到的输出与在节点中不同？

问题描述

当我运行此代码时，浏览器中的结果与节点中的结果不同

const users = [
  {
    id: 1,
    name: "ada",
    surname: "wong",
    games: [
      { id: 1, name: "g1" },
      { id: 2, name: "g2" },
    ],
  },
  {
    id: 2,
    name: "leon",
    surname: "kennedy",
    games: [{ id: 2, name: "g2" }],
  },
];

const output = users.map((user) => ({ ...user }));

console.log(output);

在浏览器中我可以看到预期的结果

[
  {
    "id": 1,
    "name": "ada",
    "surname": "wong",
    "games": [
      {
        "id": 1,
        "name": "g1"
      },
      {
        "id": 2,
        "name": "g2"
      }
    ]
  },
  {
    "id": 2,
    "name": "leon",
    "surname": "kennedy",
    "games": [
      {
        "id": 2,
        "name": "g2"
      }
    ]
  }
]

但是当我用节点运行它时，我得到了这个结果

$node app.js

输出

[
  {
    id: 1,
    name: 'ada',
    surname: 'wong',
    games: [ [Object], [Object] ]
  },
  { id: 2, name: 'leon', surname: 'kennedy', games: [ [Object] ] }
]

我试图[ [Object], [Object] ]通过以下方式纠正节点中的这种行为，但在尝试它们后都返回相同的结果

const output = users.map((user) => ({ ...user, games: user.games }));
const output = users.map((user) => ({ ...user, games: [...user.games] }));
const output = users.map((user) => ({
  ...user,
  games: user.games.map(({ id, name }) => ({ id, name })),
}));

为什么另一个对象中的解构对象在浏览器中的输出与在节点中的输出不同？如何在节点中修复它？

标签： javascript

解决方案

它是关于浏览器和终端上的字符串和对象的，最初浏览器将所有内容都转换为字符串，或者如果您想深入登录 nodejs，您可以将其转换为日志上的对象，您可以同时使用这两种方式

第一种方式

// more compact, and colour can be applied (better for process managers logging)
console.dir(queryArgs, { depth: null, colors: true });

第二种方式

// get a clear list of actual values
console.log(JSON.stringify(queryArgs, undefined, 2));

推荐阅读