在类外调用函数与在类内调用函数有什么区别？答案

【问题标题】：What is the difference between invoking a function outside of class vs inside of it?在类外调用函数与在类内调用函数有什么区别？
【发布时间】：2019-06-15 22:13:47
【问题描述】：

在客户端的套接字事件中遇到了一些意想不到的功能。我有两个客户加入了 socket.io 房间。他们已成功加入，如我的服务器控制台日志中所示。客户端，事件发送成功，服务器成功接收。服务器正在向房间中的两个客户端发送事件，发送者和另一个客户端。只有发送客户端接收第一次尝试。在所述半失败尝试之后，如果另一个客户端尝试相同的套接字发射，则服务器成功地向两个客户端发送。 .emit() 和 .on() 在组件函数中。

有趣的是，如果将服务器事件的.on() 放在类的之外，那么第一次一切正常。

组件：

import stuff
const socket = io("http://172.**.**.***:3000");
// example '.on()' that works correctly
socket.on("test", () => {
  alert("response from outside component");
});
export default class Lobby extends React.Component {
  constructor() { }
  onTest(socket) {
    alert("outgoing alert");
    socket.emit("test", {
      room: this.state.room
    });
    // '.on()' that doesn't work correctly
    socket.on("test", () => {
      alert("incoming client alert")
    });
  }
  render() {
    <View>
      <TouchableOpacity onPress={() => this.onTest(socket)}>
        <Text>Press me </Text>
      </TouchableOpacity>
    </View> 
  }

服务器事件：

io.on("connection", socket => {
  console.log("user connected with socket id:" + socket.id);
  socket.on("test", test => {
    console.log(received from client, emitting to room #:" + test.room);
    io.to(test.room).emit("test");
  });
}

【问题讨论】：

切换顺序，您的代码将起作用，即socket.emit 在socket.on 下，但会在每次点击时添加重复事件。

标签： javascript react-native socket.io

【解决方案1】：

对于尚未发送任何内容的客户端，尚未调用 omTest，因此未执行 socket.on("test", ...) 并且未添加任何处理程序，因此没有人在处理传入消息，看起来好像它没有到达。设置套接字时应始终直接附加处理程序。

【讨论】：

有什么推荐的材料吗？