Question

我有很多非常相似的功能，我做了不同的事情，我试图重构这个。我在下面创建了generic_command：

function generic_command(name, run){
  var start_position = $('textarea').prop('selectionStart'),
      end_position = $('textarea').prop('selectionEnd'),
      current_command = { command : name, last_start_position : start_position, last_end_position : end_position }

  if(current_command == last_command){

    original_content = $('textarea').val()

    run // different code needs to be executed here!

    last_command = current_command

  }
}

字面上，功能中唯一改变的是在run运行的代码。

我试着这样称呼它：

$('#remove_bold').bind('click', function(){
  generic_command('remove_bold', remove_character(start_position), remove_character(end_position - 2 ))
});

但是，由于start_position并且end位置在侦听器调用时未定义，因此无法正常工作。

如果我在run中评估eval(run)，我猜它会起作用，但我不想使用eval，因为这是不安全的。

我应该创建一个generic_command类并创建它的实例吗？我该怎么办？我能举个例子吗？

Answer 1

你可以通过功能思考来解决这个问题。您可以使用的方法是传入一个函数，该函数将所需的值作为参数，然后根据您的需要执行它们。像这样：

// run should be a function that takes a command object as its parameter
function generic_command(name, run) {
    var start_position = $('textarea').prop('selectionStart'),
        end_position = $('textarea').prop('selectionEnd'),
        current_command = { 
            command: name, 
            start_position: start_position, 
            end_position: end_position 
        };

    if (current_command == last_command) {    
        original_content = $('textarea').val();

        run(current_command);

        last_command = current_command;    
    }
}

然后你可以像这样实现你的事件处理程序：

$('#remove_bold').bind('click', function(){
    generic_command('remove_bold', function(command) {
        remove_character(command.start_position);
        remove_character(command.end_position - 2 );
    });
});

顺便说一句，我认为您在这里仍然存在逻辑问题，因为上述函数current_command == last_command始终为false。

Answer 2

您需要传递一个回调函数：

function generic_command(name, run){
    var start_position = $('textarea').prop('selectionStart'),
        end_position = $('textarea').prop('selectionEnd'),
        current_command = { command : name, last_start_position : start_position, last_end_position : end_position };
    if(current_command == last_command){
        original_content = $('textarea').val();
        run(start_position, end_position);
        last_command = current_command;
    }
}

generic_command("remove_bold", function(start_position, end_position) {
    remove_character(start_position), remove_character(end_position - 2 );
});

Answer 3

如果你希望运行这样的代码，它被称为“回调”。为了正确使用它，在传入它时，你经常测试以确保它是一个函数，然后执行该函数。

function myFunc(run){
 if($.isFunction(run))run() //since jQuery is already included in the post above
}

为了传递可以这种方式使用的函数，你应该使用匿名函数

myFunc(function(){ alert("hello");})

在你的情况下，有一些更复杂的东西，因为你期望在函数内部存在变量的情况下调用这个函数。在这种情况下，您应该传入函数句柄，然后使用参数

调用它

传递句柄

$('#remove_bold').bind('click', function(){
 generic_command('remove_bold', remove_character)
});

使用function generic_command

内的句柄

run(start_position);
run(end_position - 2 );

创建一个通用函数

3 个答案: