如何使用 JavaScript 以类似 JSON 的格式打印圆形结构？

在 JavaScript 中，有时候我们需要打印一个包含复杂结构的对象或数据，而使用类似于 JSON 格式的打印方式可以更清晰地表达结构，方便查看和理解。

对于一个类似于 JSON 的打印格式，我们可以使用库或者手动实现。

使用库

使用库是最方便的方法。其中一个流行的库是 loglevelnext，它提供了方便的方法来输出可读性较好的格式。

import log from 'loglevelnext';
const person = {
  name: 'John',
  age: 24,
  address: {
    city: 'New York',
    state: 'NY'
  },
  hobbies: ['reading', 'hiking']
};
log.info(person);

运行后，可以看到输出的结果类似于下面的格式：

{
  "name": "John",
  "age": 24,
  "address": {
    "city": "New York",
    "state": "NY"
  },
  "hobbies": [
    "reading",
    "hiking"
  ]
}

手动实现

如果您希望手动实现，这里提供一种实现方法。

function format (obj, level = 0) {
  const indent = '  '.repeat(level);
  if (Array.isArray(obj)) {
    return '[' + obj.map(item => format(item, level + 1)).join(',\n') + ']';
  } else if (typeof obj === 'object' && obj !== null) {
    const keys = Object.keys(obj);
    if (keys.length === 0) {
      return '{}';
    }
    return `{${keys.map(key => `\n${indent}  ${key}: ${format(obj[key], level + 1)}`).join(',')}\n${indent}}`;
  } else {
    return JSON.stringify(obj);
  }
}

const person = {
  name: 'John',
  age: 24,
  address: {
    city: 'New York',
    state: 'NY'
  },
  hobbies: ['reading', 'hiking']
};
console.log(format(person));

运行后，可以看到输出的结果也类似于下面的格式：

{
  "name": "John",
  "age": 24,
  "address": {
    "city": "New York",
    "state": "NY"
  },
  "hobbies": [
    "reading",
    "hiking"
  ]
}

这个方法的思路是，先判断输入的对象是数组还是普通对象，然后按照不同的情况分别处理。其中，如果是数组，递归调用 format 函数，然后在每个元素之间添加逗号，最后用方括号包裹。如果是普通对象，则递归调用 format 函数，然后再按照格式输出。如果是基本类型，则直接使用 JSON.stringify 输出。递归调用的时候，每次增加一个缩进的层数，以保证格式清晰。