PubSub脚本不接受变量 [英] PubSub script not accepting variables

问题描述

我在互联网上找到了一个PubSub脚本，效果很好，不幸的是我还不完全理解它是如何工作的......

I found a PubSub script on the internet, which works quite well, unfortunately I don't completely understand how it works...

这不是一个问题直到现在。对于一个项目，我需要通过这个pubsub脚本调用一个函数并传递一些参数。但是，该函数似乎不接受任何arguemnts并且只传递其事件的已更改变量。

This wasn't a problem until now. For a project I need to call a function via this pubsub script and pass it some arguments. However, the function seems to not accept any arguemnts and only passes the changed variable of its event.

这是订阅PubSub事件并调用的代码行功能：

Here is the line of code which subscribes to a PubSub event and calls a function:

events.on( 'scrollChanged', self.translate );

正如您所知，事件是滚动事件，传递的值是像素数量滚动。

As you can probably tell, the event is a scroll event and the passed value is the amount of pixels scrolled.

这一行代表一个jQuery插件，我正在开发它，应该作为一个函数调用，我们通常会这样： self.translate（）

This line stands inside a jQuery plugin, which I'm currently developing and should act as a function call, which we would normally wirte like this: self.translate()

到目前为止，一切运作良好，但翻译 function还需要来自 init -function（从中调用它）的一些其他变量。
所以通常我会写：

Until now, everything works well, but the translate function also needs some other variabels from the init-function (from which it is called). So normally I would write:

[...]
init: function( options, this ) {
  // Logic
  self.translate(var1, var2); 
},

translate: function( var1, var2 ) {
  // Logic
}
[...]

要在滚动时更新功能，我需要使用 events.on（'scrollChanged'）调用它，self.translate）; 功能，并传递 yScroll 变量进行一些计算。但是，如果我将两个变量传递给它，我只会收到错误消息，告诉我该函数未定义。

To have the function update while scrolling I need to call it with the events.on( 'scrollChanged', self.translate ); funtion and also pass the yScroll variable for some calculations. But if I pass the two variables to this, I only get error messages which tell me, that the function is undefined.

// Exchanged `self.translate(var1, var2);` in the above code by:
events.on( 'scrollChanged', self.translate(var1, var2) );

所以我猜，PubSub代码不接受任何其他变量？！

So I'm guessing, that the PubSub code does not accept any other variables?!

希望有人可以帮助我。

PubSub代码

var events = {
  events: {},
  on: function (eventName, fn) {
    this.events[eventName] = this.events[eventName] || [];
    this.events[eventName].push(fn);
  },
  off: function(eventName, fn) {
    if (this.events[eventName]) {
      for (var i = 0; i < this.events[eventName].length; i++) {
        if (this.events[eventName][i] === fn) {
          this.events[eventName].splice(i, 1);
          break;
        }
      };
    }
  },
  emit: function (eventName, data) {
    if (this.events[eventName]) {
      this.events[eventName].forEach(function(fn) {
        fn(data);
      });
    }
  }
};

错误发生在 emit -function：

The error occurs in this line of the emit-function:

fn（数据）;

fn(data);

告诉我， fn 未定义。

这是<$ c的代码如果没有参数传递，$ c> emit 效果很好：

$(window).scroll(function(){
  var yScroll = $(this).scrollTop();

  events.emit('scrollChanged', yScroll);
});

推荐答案

将函数引用传递给。 on（）在第二个参数，而不是通过使用（）调用立即调用函数;将 rest参数定义为 emit 的第二个参数，使用解构赋值， spread元素 at fn 定义参数传递给 fn 作为 fn 函数体内的数组

Pass function reference to .on() at second parameter instead of calling function immediately by invoking with (); define rest parameters as second parameter to emit, use destructuring assignment, spread element at fn to define arguments passed to fn as an array within fn function body

var events = {
  events: {},
  on: function (eventName, fn) {
    this.events[eventName] = this.events[eventName] || [];
    this.events[eventName].push(fn);
  },
  off: function(eventName, fn) {
    if (this.events[eventName]) {
      for (var i = 0; i < this.events[eventName].length; i++) {
        if (this.events[eventName][i] === fn) {
          this.events[eventName].splice(i, 1);
          break;
        }
      };
    }
  },
  emit: function (eventName, ...data) {
    if (this.events[eventName]) {
      this.events[eventName].forEach(function(fn) {
        fn(data);
      });
    }
  }
};

function cb() {
  var [args] = [...arguments];
  console.log(args, args[0], args[1]); // `["abc", 123]`, `"abc"`, `123`
}

events.on("scrollChanged", cb);
events.emit("scrollChanged", "abc", 123);

这篇关于PubSub脚本不接受变量的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！