JavaScript 类继承 - 填充方法不起作用

Question

问题

我正在尝试创建两个类，其中一个是另一个的子类，并通过填充方法填充构造函数中的私有变量。但是，当使用fill方法填充父类私有变量时，这些变量会在初始化子类时消失。

class RequestFile {
    constructor (args = {}) {
        // this.to = args.to ? args.to : []
        // this.files = args.files ? args.files : []
        // this.body = args.body ? args.body : ''
    }
    fill ({to=[],files=[], subject='', body='', }) {
      this.to = to
      this.files = files
      this.subject = subject
      this.body = body
    }
}

class Mail extends RequestFile {
    constructor (args = {}) {
      super(args)
      this.fill(args)
    }
    fill ({cc='', draft=false, preview=true}) {
      this.cc = cc
      this.draft = draft
      this.preview = preview
    }
    to() {
      console.log(this.to)
    }
}
let mail = new Mail({
  to: [ 'name@gmail.com' ],
  files: [ 1111 ],
  subject: 'Sent from Node',
  body: 'test body  -- sent from node',
  cc: [ 'anotherone@gmail.com', 'another@gmail.com' ],
  draft: true,
  preview: true
})

console.log(mail)

以上输出如下：

Mail {
cc:(2) [...],
draft: true ,
preview: true
}

取消注释 RequestFile 类中的代码会产生不同的结果：

class RequestFile {
    constructor (args = {}) {
        this.to = args.to ? args.to : []
        this.files = args.files ? args.files : []
        this.body = args.body ? args.body : ''
    }
    fill ({to=[],files=[], subject='', body='', }) {
      this.to = to
      this.files = files
      this.subject = subject
      this.body = body
    }
}

Mail {
to:(1) [...],
files:(1) [...],
body: "test body -- sent from node" ,
cc:(2) [...],
draft: true ,
preview: true
}

理想情况下，我想依靠 fill 方法来填充类变量，我只是对为什么它在子类（Mail）中工作但在父类（RequestFile）中不起作用感到困惑

Answer 1

从子类中的fill()方法，调用基类继承的fill()方法。在应用对象解构之前，使用特殊的arguments 变量传递原始参数。

然后您甚至可以将对fill() 的调用移至基类构造函数，而不必从子类构造函数调用填充方法。

class RequestFile {
    constructor (args = {}) {
        this.fill(args);
    }

    fill ({to=[],files=[], subject='', body='', }) {
      this.to = to
      this.files = files
      this.subject = subject
      this.body = body
    }
}

class Mail extends RequestFile {
    constructor (args = {}) {
      super(args)
    }

    fill ({cc='', draft=false, preview=true}) {
      // pass on original parameter to base class fill method
      super.fill(arguments[0])
      this.cc = cc
      this.draft = draft
      this.preview = preview
    }
    to() {
      console.log(this.to)
    }
}

---

另一种解决方案是为基类和子类中的填充方法使用不同的名称：

class RequestFile {
    constructor (args = {}) {
        this.fillRequestFile(args);
    }

    fillRequestFile ({to=[],files=[], subject='', body='', }) {
      this.to = to
      this.files = files
      this.subject = subject
      this.body = body
    }
}

class Mail extends RequestFile {
    constructor (args = {}) {
      super(args)
      this.fillMail(args);
    }

    fillMail ({cc='', draft=false, preview=true}) {
      this.cc = cc
      this.draft = draft
      this.preview = preview
    }
    to() {
      console.log(this.to)
    }
}

Answer 2

class Mail extends RequestFile {
    constructor (args = {}) {
      super()
      super.fill(args)
      this.fill(args)
    }
    fill ({cc='', draft=false, preview=true}) {
      this.cc = cc
      this.draft = draft
      this.preview = preview
    }
    to() {
      console.log(this.to)
    }
}