одна функции для нескольких элементов

Question

я в настоящее время рисования элементов на холсте:

var head = new Kinetic.Ellipse({ 
    x: stage.width()/2, 
    y: 100, 
    radius: { 
      x: 50, 
      y: 60 
     }, 
    fill: '#DDDDDD', 
    stroke: 'black', 
    strokeWidth: 2 
    }); 

    var neck = new Kinetic.RegularPolygon({ 
    x: stage.width()/2, 
    y: 180, 
    sides: 4, 
    radius: 70, 
    fill: '#DDDDDD', 
    stroke: 'black', 
    strokeWidth: 2 
    }); 

layer.add(neck); 
layer.add(head); 

и изменить цвет этих элементов при нажатии или потрогать, но я буду иметь много элементов на экране и не хочу одинаковое количество функций для изменения каждого из них.

Есть ли способ, чтобы сказать, объединить два ниже, чтобы быть одной функцией, но эффект двух выше.

head.on('touchstart, mousedown', function() { 
    var current = this.getFill(); 
    var fill = ""; 
    switch (current) { 
     case "#DDDDDD": 
     fill = "#FFC926"; 
     break; 
     case "#FFC926": 
     fill = "#FF0000"; 
     break; 
     case "#FF0000": 
     fill = "#000000"; 
     break; 
     default: 
     fill= "#DDDDDD"; 
    } 
    this.setFill(fill); 
    layer.draw(); 
    }); 

    neck.on('touchstart, mousedown', function() { 
    var current = this.getFill(); 
    var fill = ""; 
    switch (current) { 
     case "#DDDDDD": 
     fill = "#FFC926"; 
     break; 
     case "#FFC926": 
     fill = "#FF0000"; 
     break; 
     case "#FF0000": 
     fill = "#000000"; 
     break; 
     default: 
     fill= "#DDDDDD"; 
    } 
    this.setFill(fill); 
    layer.draw(); 
    }); 

Answer 1

Вы можете выделить общую функцию, и использовать его как сильфон

var evaentListener = function(obj) { 
    return function() { 
     var current = obj.getFill(); 
     var fill = ""; 
     switch (current) { 
      case "#DDDDDD": 
      fill = "#FFC926"; 
      break; 
      case "#FFC926": 
      fill = "#FF0000"; 
      break; 
      case "#FF0000": 
      fill = "#000000"; 
      break; 
      default: 
      fill= "#DDDDDD"; 
     } 
     obj.setFill(fill); 
     layer.draw(); 
    } 
} 

head.on('touchstart, mousedown',evaentListener(this)); 

neck.on('touchstart, mousedown',evaentListener(this));