如何正确关联这个对象两个构造函数？

Question

我正在尝试使用 javascript 创建自己的提醒应用程序，所以基本上我可以创建一组提醒，如类别（工作、学校、编程提醒等）。每一个都可以有他们的提醒，比如工作类别我可以在那里有提醒列表等等。我还想将集合及其提醒保存在本地存储中，然后在页面上重新创建它们。当然，提醒列表应该在它所属的集合上。

在我做这个页面之前，我真的很想先对此进行建模，我决定继续使用 oop 方法作为一种实践，我正在弄清楚如何将它们关联起来，这就是我目前所得到的......

    var ReminderSet = function(set){
      this.set = set; //could be work, school , etc 

    }


    var Reminders = function(new_reminder){
      this.reminders = new_reminder; // a new reminder
    }

    ReminderSet.prototype.reminders = new Reminders();

    ReminderSet.prototype.printSet = function(){
      console.log(this.set, this.reminders); /* gives the ff output 
work { reminders: 'finish task on time' }
school { reminders: 'study on chem' }*/
    }

    var workReminders = new ReminderSet("work"); // create a new set of reminder
    var schoolReminders = new ReminderSet("school"); // create a new set of reminder

    workReminders.reminders = new Reminders("please the boss"); //add a new reminder to work
    workReminders.reminders = new Reminders("finish task on time");//add a new reminder to work
    schoolReminders.reminders = new Reminders("finish projects"); //add new reminder to school
    schoolReminders.reminders = new Reminders("study on chem"); //add new reminder to school

    workReminders.printSet(); 
    schoolReminders.printSet();

问题是它不会让我为这个集合创建多个提醒，我希望你能帮助我，谢谢！需要说明的是，我只学习了 3 个月的 javascript，这是我第一次做 oop，虽然我之前做过一些任务项目，但我认为真正熟悉 oop 很重要。

Answer 1

您只能添加一个提醒的原因是您没有构建提醒集合。每次设置新提醒时，都会覆盖之前的提醒。

我已经稍微改写了您发布的代码，使用我认为更直观的属性名称，而且还在每个ReminderSet 中构建提醒集合。

var ReminderSet = function (name) {
  this.name = name;
  this.reminders = [];
}

ReminderSet.prototype.add = function (reminder) {
  this.reminders.push(reminder);
  return this;
}

ReminderSet.prototype.list = function() {
  console.log(this.reminders);
}

var Reminder = function (description) {
  this.description = description;
}


var work = new ReminderSet('work')
  .add(new Reminder('Get to work on time!'))
  .add(new Reminder('Finish all my work!'));

var school = new ReminderSet('school')
  .add(new Reminder('Finish my coursework'))
  .add(new Reminder('Study for my exams!'));

work.list();
school.list();

Answer 2

试试这个，在创建它的新实例时使用函数作为模板来填写，而不是让它们成为自己的变量。

   function ReminderSet(set){
      this.set = set; //could be work, school , etc 

    }


    function Reminders(new_reminder){
      this.reminders = new_reminder; // a new reminder
    }

    ReminderSet.prototype.reminders = new Reminders();

    ReminderSet.prototype.printSet = function(){
      console.log(this.set, this.reminders); /* gives the ff output 
work { reminders: 'finish task on time' }
school { reminders: 'study on chem' }*/
    }

    var workReminders = new ReminderSet("work"); // create a new set of reminder
    var schoolReminders = new ReminderSet("school"); // create a new set of reminder

    workReminders.reminders = new Reminders("please the boss"); //add a new reminder to work
    workReminders.reminders = new Reminders("finish task on time");//add a new reminder to work
    schoolReminders.reminders = new Reminders("finish projects"); //add new reminder to school
    schoolReminders.reminders = new Reminders("study on chem"); //add new reminder to school

    workReminders.printSet(); 
    schoolReminders.printSet();

Answer 3

您可以将数组设置为class 的属性，并使用属性名称为提醒名称且值可以是任何类型的对象

class Reminders {
  constructor() {
    this.reminders = [];
  }
  setReminder(key, prop) {
    const reminder = {
      type: key,
      value: prop
    };
    this.reminders.push(reminder);
    return this;
  }
  getReminder(key) {
    return this.reminders.filter(({type}) => type === key)
  }
}

let reminders = new Reminders()

reminders.setReminder("work", ["a", "b"]);

let work = reminders.getReminder("work");

reminders.setReminder("school", "study")

let school = reminders.getReminder("school");

reminders.setReminder("do stuff", "stuff")

let stuff = reminders.getReminder("do stuff");

for (let [{type, value}] of Object.values([work, school, stuff])) {
  console.log(`reminder type:${type}, reminder value:${value}`)
}