1

我对javascript很陌生,所以这个问题听起来可能很愚蠢。但是在变量和函数中替换某些单词的正确语法是什么。例如,我有这个功能:

function posTelegram(p){
var data = telegramData;
$("#hotspotTelegram").css("left", xposTelegram[p] +"px");
if (p < data[0] || p > data[1]) {
$("#hotspotTelegram").hide()
} else {
$("#hotspotTelegram").show()
}
};

有很多重复的“电报”这个词,每次我创建一个新的热点时,我都会手动插入这个词来替换每行中的“电报”。编写该代码的更聪明的方法是什么,以便我只需要编写一次“电报”?

4

4 回答 4

1

你不能总是避免这种重复(这对所有编程语言都是通用的)。

有时,您可以制作泛型函数或泛型类,例如嵌入所有数据的类:

Thing = function(key, xpos) {
    this.$element = $('#hotspot'+key);
    this.xpos = xpos;
};

Thing.prototype.pos = function (p, data) {
    this.$element.css("left", this.xpos[p] +"px");
    if (p < this.data[0] || p > this.data[1]) {
        this.$element.hide()
    } else {
       this.$element.show()
    }
};

我们可以想象这可以这样调用:

var telegramThing = new Thing('telegram', xposTelegram);
...
telegramThing.pos(p, data);

但是,如果没有关于您的确切问题的更多信息,很难做出更具体的提议。

我建议您阅读一些有关 OOP 和 javascript 的内容,因为它可以帮助您使复杂的程序更加清晰、简单和易于维护。例如,在此处使用 Thing 类将启用

  • 不要在代码中多次定义“#hotspotTelegram”字符串
  • 重用逻辑并避免使用“电报”以外的其他东西制作相同的代码
  • 在您的主应用程序逻辑中没有事物逻辑(通常在另一个 Thing.js 文件中)

但不要抽象太多,会适得其反。如果您不使用对象,请尝试保留有意义的变量名。

于 2012-06-01T06:48:26.953 回答
1

将相似/相关的数据分组到数据结构中,而不是为每个位设置一个变量。

缓存调用jQuery的结果

使用参数

function posGeneral(p, word){

  // Don't have a variable for each of these, make them properties of an object
  var data = generalDataThing[word].data; 

  // Don't search the DOM for the same thing over and over, use a variable
  var hotspot = $("#hotspot" + word);
  hotspot.css("left", generalDataThing[word].xpos[p] +"px");

  if (p < data[0] || p > data[1]) {
    hotspot.hide()
  } else {
    hotspot.show()
  }
};
于 2012-06-01T06:49:41.503 回答
0
var t = "Telegram";
var $_tg = $('#hotspotTelegram');

$_tg.css("left", "xpos"+t[p] + "px"); // not sure about this line, lol
$_tg.hide();
$_tg.show();

等等

于 2012-06-01T06:48:12.800 回答
0

你可以创建一个选择器作为变量,像这样

function posTelegram(p){
  var data = telegramData;
  var $sel = $("#hotspotTelegram");

  $sel.css("left", xposTelegram[p] +"px");
  if (p < data[0] || p > data[1]) {
    $sel.hide()
  } else {
    $sel.show()
  }
};
于 2012-06-01T06:48:46.643 回答