Javascript 套接字IO客户端在分配给变量时延迟触发连接事件

我在前端使用React，在后端使用Node.js，在websockets中使用Socket.io

考虑这一点：

我这里有这个模块，用于客户端的套接字设置

socket.js

export default () => {

 const socket = io(`${config.origin}/chat`);
  const getAllChatMessages = messages => {
    socket.on('get-chat', messages);
  };

  const updateChatHistory = lastMessage => {
    socket.on('new-message', lastMessage);
  };

  const sendNewMessage = newMessage => {
    socket.emit('new-message', newMessage);
  };

  const unregisterHandlers = () => {
    socket.off('get-chat');
    socket.off('new-messge');
  };

  return {
    getAllChatMessages,
    updateChatHistory,
    unregisterHandlers,
    sendNewMessage
  };
};

我在React组件中也是这样使用它的

Chat.js

class Chat extends Component {
  constructor() {
    super();
    this.client = socket();
    this.state = { chatMessage: '', chatHistory: [], today: new Date() };
  }

请注意，一切正常。然而，有一些非常奇怪的行为，那就是当我在构造函数中为

socket（）

赋值给

this.client

时，在服务器上触发“on connection”事件之前，我得到了7秒的延迟。但如果我像这样重写构造函数：

 class Chat extends Component {
    constructor() {
    super();
    socket();
    this.state = { chatMessage: '', chatHistory: [], today: new Date() };
  }

也就是说，如果我只是执行

socket（）

函数，而没有将其分配给

this.client

属性，那么一切都是即时的

这是为什么？？在这两种情况下，都是在socket.js内部触发

io(

${config.origin}/chat

);