使用javascript oop减少代码重复

我有一个包含更多函数的javascript代码。在每个函数中，代码看起来都很相似。是否有任何方法可以使用javascript oop来减少和优化代码。我的剧本是这样的

function cal_a() {
    var a_list = [];
  function fetch_dom() {
    var a = document.getElementById("pOne");
    a.innerHTML = "Hello";
    a_list.push("Hello");
  }
  fetch_dom();
}
function cal_b() {
    var b_list = [];
  function fetch_dom() {
    var b = document.getElementById("pTwo");
    b.innerHTML = "World";
    b_list.push("World");
  }
  fetch_dom();
}
cal_a();
cal_b();
//..
//..
//..
//cal_z();

HTML代码外观

<p id="pOne"></p>
<p id="pTwo"></p>

---

如果问题不对，请原谅。提前感谢。

当然可以，拉出公共部分，制作一个返回函数的函数

function make_cal(elem_id, text) {
    return function() {
        var list = [];
      function fetch_dom() {
        var b = document.getElementById(elem_id);
        b.innerHTML = text;
        list.push(text);
      }
      fetch_dom();
    }
}

let cal_a = make_cal("pOne", "Hello");
let cal_b = make_cal("pTwo", "World");

---

我得说这份名单在这里没有任何作用

function cal(id, text) {
  var list = [];
  function fetch_dom() {
    var el = document.getElementById(id);
    el.innerHTML = text;
    list.push(text);
  }
  fetch_dom();
}

cal('id', 'text');

---

fetchDom

最好放在对象构造函数上：

function Cal(elClass, text) {
  this.list = [];
  this.elClass = elClass;
  this.text = text;
}

Cal.prototype.fetchDom = function() {
  var el = document.getElementById(this.elClass);
  el.innerHTML = this.text;
  this.list.push(el);
};

var calA = new Cal("pOne", "Hello");
var calB = new Cal("pTwo", "World");

calA.fetchDom();
calB.fetchDom();

然后，您可以通过以下方式访问列表：

calA.list;
calB.list;

---

我只是好奇，为什么要创建一个函数的许多实例来完成这项工作呢？我假设他不想更改其原始方法的方法签名。不，这不是工厂，而是咖喱，尽管术语只是一件小事here@JonasW. 为什么不？你的意思是currying不会创建函数的副本？

可能被称为工厂模式。

为什么需要那个iLife

fetch\u dom

？