Array与Object无法在浏览器显示，访问时仅返回undefined求助

• 检查自定义构造函数的返回逻辑
  用构造函数生成数组时，如果没有正确返回数组实例，推入inventory的会是无效对象。比如错误写法：

  function CustomArray() {
    this.elements = [];
    // 无return语句，默认返回this（普通对象）
  }
  

  正确写法要确保生成数组实例：

  function CustomArray() {
    return Array.apply(null, arguments);
  }
  // 或用class继承
  class CustomArray extends Array {}
  

• 确认inventory的初始化状态
  必须保证inventory是已初始化的数组，而非未定义的变量：

  // 错误：未初始化
  let inventory;
  // 正确：初始化为空数组
  let inventory = [];
  

• 验证push操作的执行时机
  如果push是在异步流程中执行，同步访问inventory会拿不到值：

  let inventory = [];
  // 异步操作
  setTimeout(() => {
    const newArr = new CustomArray();
    inventory.push(newArr);
  }, 100);
  console.log(inventory[0]); // 此时还没执行push，返回undefined
  

  需在异步回调内或通过async/await等待操作完成后再访问。

• 检查数组访问的索引有效性
  确认访问的索引在inventory的长度范围内：

  inventory.push(new CustomArray());
  console.log(inventory[0]); // 正确访问第一个元素
  console.log(inventory[1]); // 索引超出范围，返回undefined
  

• 用console.dir查看对象完整结构
  在浏览器控制台使用console.dir(inventory)，可以展开查看数组的原型链和内部属性，确认构造函数生成的对象是否为标准数组类型。

内容的提问来源于stack exchange，提问作者CTR