为何类静态属性的命名导出为undefined，默认导出却有值？

代码结构 #

.
├── myClass.js
├── myModule.js
└── index.js

代码内容 #

index.js #

import myModule from './myModule.js'
import myClass from './myClass.js'

myClass.init()
myModule()

myModule.js #

import A, { prop1 } from './myClass.js'
export default () => {
    console.log("A.prop1 is: ", A.prop1)
    console.log("while prop1 is: ", prop1)
}

myClass.js #

export default class A {
    static prop1
    static init() {
        this.prop1 = 88
    }
}
export const { prop1 } = A

运行结果 #

执行node index.js后输出：

A.prop1 is:  88
while prop1 is:  undefined

用户问题 #

为何命名导出的prop1为undefined，而默认导出的类对应的该属性却有值？JavaScript不是采用引用机制吗？
另外补充：曾使用TypeScript，它也未检测到命名导出的prop1可能为undefined，反而认为它是number类型。

问题解答 #

核心原因 #

1. 解构赋值的时机与值的拷贝
   myClass.js里的export const { prop1 } = A是在模块加载时执行的。此时类A的static prop1仅被声明，还没通过init()赋值，所以解构出来的prop1就是undefined。而且prop1是基本类型（数字），解构时会直接拷贝它当前的值，后续修改类A上的prop1属性，不会影响这个已经解构出来的变量。

2. 类引用的实时访问
   默认导出的A是类对象的引用，当你在myModule.js中访问A.prop1时，是实时从类对象上读取属性值——此时init()已经把A.prop1改成88了，所以能拿到正确结果。

TypeScript未检测到的原因 #

TS的静态类型分析无法完全追踪代码的执行顺序。它看到类中声明了static prop1，又看到init()给它赋值为数字，就会推断prop1的类型为number，但没意识到解构赋值发生在init()调用之前，因此没检测到它可能为undefined的情况，这属于静态类型分析的局限性。

内容的提问来源于stack exchange，提问作者Islam Y-