如何在 JS es6 类中实现多个方法？答案

【问题标题】：How to implement more than one method in JS es6 class?如何在 JS es6 类中实现多个方法？
【发布时间】：2019-01-08 07:40:52
【问题描述】：

我有一类我在 JS 中创建的验证：

let test = new Validator(req.body);

现在我想测试一些东西，也许这个对象中的特定键是 2-5 字符长度，我会这样做：

let myBoolean = test.selector("firstName").minLength(2).maxLength(5);
// firstName is like: req.body.firstName

在课堂上如何做到这一点？

编辑

我做了这样的事情：

audit.isLength({selector: "from", gte: 2, lte: 35})

class Validator {

  constructor(obj) {
    this.obj = obj;
    this.isValid = true;
  }

  isExists(sel) {
    if (typeof this.obj[sel] === "undefined") return false;
    return true;
  }

  isLength(info) {
    let sel = this.obj[info.selector];
    if (typeof sel === "undefined") return false;
    if (info.gte) {
      if (sel.length<info.gte) return false;
    }
    if (info.lte) {
      if (sel.length>info.lte) return false;
    }
    if (info.gt) {
      if (sel.length<=info.gt) return false;
    }
    if (info.lt) {
      if (sel.length>=info.lt) return false;
    }
    return true;
  }
}

【问题讨论】：

您的selector 方法需要返回具有minLength 方法的something，而该方法又返回具有maxLength 方法的something . selector 是否是 class 的一部分并不重要。
请注意，您提出的 api 不起作用 - 大概 minlength 也应该返回布尔值？但它不能，因为它还应该返回你可以调用 maxlength 的东西。您将需要一个返回最终结果的终止调用。在你重新发明轮子之前，你可能想看看 github.com/rjperes/FluentValidationJS 这样的东西，如果只是为了获得一些灵感

标签： javascript class ecmascript-6

【解决方案1】：

尝试这样的事情 - 将要验证的对象分配给实例化的属性，从每个验证调用返回 this，并在验证时分配给对象的 isValid 属性（如果尚未false)。请注意，您最终需要访问 isValid 属性才能检索布尔值。

class Validator {
  constructor(obj) {
    this.obj = obj;
    this.isValid = true;
  }
  selector(sel) {
    this.sel = sel;
    return this;
  }
  minLength(min) {
    if (this.isValid) this.isValid = this.obj[this.sel].length >= min;
    return this;
  }
  maxLength(max) {
    if (this.isValid) this.isValid = this.obj[this.sel].length <= max;
    return this;
  }
}

const test = new Validator({firstName: 'foobar'}); // 6 chars: invalid
console.log(test.selector("firstName").minLength(2).maxLength(5).isValid);
const test2 = new Validator({firstName: 'fooba'}); // 5 chars: valid
console.log(test2.selector("firstName").minLength(2).maxLength(5).isValid);
const test3 = new Validator({firstName: 'f'}); // 1 char: invalid
console.log(test3.selector("firstName").minLength(2).maxLength(5).isValid);

【讨论】：

我想这是this.isValid = this.isValid && …; 可能比if (this.isValid) this.isValid = …; 更干净的少数情况之一 :-)
选择器中的 undefined 怎么样？
@Raz 如果obj 不存在，或者当selector 被调用并且this.obj[sel] 不存在时，您可以在构造函数中将isValid 属性设置为false （或者不是字符串，随便你）
如果选择器是： "when.date.start" 会发生什么？ this.obj[this.sel] 无论如何都是未定义的，不是吗？
如果您担心 That（通常）不会是对象上存在的合理属性名称，请参阅 this question，因为考虑到点运算符，它非常令人困惑。但是，就像我说的那样，您可以在调用 selector 时测试密钥的存在，并适当地设置 isValid。

【解决方案2】：

用fluent methods/chainable methods创建一个类，返回this，这是类本身的一个实例，当你最终根据规则运行验证时，调用.validate()，它将充当最终返回结果的方法：

class Validator {
  constructor (body) {
    this._body = body;
  }
  
  selector(str) {
    this._selector = str;
    return this;
  }
  
  minLength(num) {
    this._minLength = num;
    return this;
  }
  
  maxLength(num) {
    this._maxLength = num;
    return this;
  }
  
  validate() {
    // run your validation logic here and return true or false accordingly
    return true
  }
}

const req = { body: 'body' };
const test = new Validator(req.body);
const myBoolean = test
  .selector('firstName')
  .minLength(2)
  .maxLength(5)
  .validate();
  
console.log('rules:');
console.log(test);
console.log(`result: ${myBoolean}`);

【讨论】：

WTH 是一种流体方法？

【解决方案3】：

这是建造者模式（有点）。您可能想要定义一个具有 minLength 和 maxLength 函数的单独类。这些函数将在构建器上设置一些状态，并返回this（构建器自身）或作为this 副本的新构建器。然后你会在构建器上有一些 finalize 函数，它查看状态，处理基于最小值/最大值的所有逻辑，并返回一个布尔值。

【讨论】：