JavaScript：異步創建實例並在不同模塊中使用它

Question

我正在建立一個小型網絡聊天。 我用於聊天的服務要求我在前端創建一個客戶端-然后可以使用該客戶端進行通信。 代碼如下：

import Client from 'some-chat-service'

async function connect() {
    const token = await getToken() // first need to get token from backend
    const client = await Client.create(token) // then we can create client instance
}

現在的問題是，我無法在其他任何地方（不同文件中）使用client ，因為它是在connect函數中聲明的。

解決方法如下所示：

import Client from 'some-chat-service'

export let client;

async function connect() {
    const token = await getToken()
    client = await Client.create(token)
}
connect()

現在，我們可以在所需的任何地方使用該客戶端，但是對我來說這看起來很奇怪。

你知道如何處理這樣的問題嗎？

Answer 1

你想去哪里調用connect ？ 如果導入模塊應該調用它，那么只需從函數中return客戶端，如果導出模塊應該啟動連接本身（如第二個片段中所示），則應該導出一個promise：

export const clientPromise = getToken().then(Client.create);

// or with async/await:
async function connect() {
    const token = await getToken()
    return Client.create(token)
}
export const clientPromise = connect()

無論如何，導入它的模塊將需要等待初始化承諾。