Question

我有一个代码可以验证是否所有表单字段都填充了数据，但我的表单输入是根据this.id_company条件动态显示的。如您所见，this.is_company等于TRUE，那么验证还应检查用户是否已插入this.taxNumber和this.copmany

isComplete: function () {
    if (this.is_company) {
        return this.firstName && this.lastName && this.email && this.password && this.address && this.postNumber
            && this.city && this.id_country && this.iAggre && this.taxNumber && this.company
    }
    return this.firstName && this.lastName && this.email && this.password && this.address && this.postNumber
        && this.city && this.id_country && this.iAggre;
}

我正在寻找简化Javascript代码的最佳方法。你能不能提供一些例子。谢谢

Answer 1

为方便起见，只需使用或：

return (
   this.firstName && 
   this.lastName && 
   this.email && 
   this.password && 
   this.address && 
   this.postNumber && 
   this.city && 
   this.id_country && 
   this.iAggre && 
   (!this._isCompany || this.taxNumber && this.company)
);

被理解为且不是公司或具有taxNumber和公司财产。

Answer 2

更好，易读的版本将是：

isComplete: function () {
    var baseCondition = this.firstName && this.lastName && this.email 
        && this.password && this.address && this.postNumber
        && this.city && this.id_country && this.iAggre

    var companyCondition = baseCondition && this.taxNumber && this.company;

    return this.is_company ? companyCondition : baseCondition;
}

Answer 3

您可以将字段分组到一个数组中，并有条理地推送company和taxNumber字段：

var validate = function(isCompany) {
  var validateFields = [
    this.firstName,
    this.lastName,
    this.email,
    this.password,
    this.address,
    this.postNumber,
    this.city,
    this.id_country,
    this.iAggre
  ];

  if (isCompany) {
    validateFields.push(this.company, this.taxNumber);
  }

  return validateFields.find(f => !f) === undefined;
}

var isComplete = function() {
  return validate(this.is_company);
}

Answer 4

最好的办法是将每个功能降低到最简单的形式。 @ jonas-w通过计算价值走向了正确的方向。方法名称记录了结果的含义，并使条件更容易理解。

如果您不想公开私密方法，可以随时制作isCompanyComplete()和isPersonComplete()个私密方法。

将逻辑运算符（&&）分散到不同的行上会使语句更具可读性。

在单独的行中拆分三元语句还可以清楚地说明哪些部分适用于逻辑上的真或假。

避免在条件（!this.is_company）中反转逻辑。

＆＃13;

class Form {

  isPersonComplete() {
    return !!(
      this.firstName 
      && this.lastName 
      && this.email 
      && this.password 
      && this.address 
      && this.postNumber
      && this.city 
      && this.id_country 
      && this.iAgree 
    );
  }

  isCompanyComplete() {
    return !!(
      this.isPersonComplete()
      && !!this.taxNumber 
      && !!this.company
    );
  }

  isComplete() {
    return this.is_company 
      ? this.isCompanyComplete() 
      : this.isPersonComplete();
  }
  
}

const form = new Form()
console.log(
  'Person: ' + form.isPersonComplete(), 
  'Company: ' + form.isCompanyComplete(), 
  'Completed: ' + form.isComplete()
  );


form.firstName = 'John';
form.lastName = 'Smith';
form.email = 'john@smith.co';
form.password = 'somesecret';
form.address = '123 main street, anywhere';
form.postNumber = '12345';
form.city = 'Metropolis';
form.id_country = 1;
form.iAgree = true;
console.log(
  'Person: ' + form.isPersonComplete(), 
  'Company: ' + form.isCompanyComplete(), 
  'Completed: ' + form.isComplete()
  );

form.is_company = true;
form.taxNumber = 12345;
form.company = 'John Smith & Co';
console.log(
  'Person: ' + form.isPersonComplete(), 
  'Company: ' + form.isCompanyComplete(), 
  'Completed: ' + form.isComplete()
  );

＆＃13;

Answer 5

这个问题是“主要以意见为基础”等已经建立，所以到底是什么，这是另一个建议：

function form() {
  this.vld = {
    fields: ["firstName", "lastName", "email", "password", "address", "postNumber", "city", "id_country", "iAggre"],
    check: arr => !arr.some(el => !this[el]),
    isComplete: () => this.vld.check(this.vld.fields) && (!this.is_company || this.vld.check(["taxNumber", "company"]))
  }
}

var stuff = new form();

stuff.firstName = "Alice";
stuff.lastName = "Bob";
stuff.email = "alice@bob.com";
stuff.password = "12abc123";
stuff.address = "123 Main St";
stuff.postNumber = "12345";
stuff.city = "Springfield";
stuff.id_country = 1;
console.log(false, stuff.vld.isComplete());

stuff.iAggre = true;
console.log(true, stuff.vld.isComplete());

stuff.is_company = true;
stuff.taxNumber = "123456789";
console.log(false, stuff.vld.isComplete());

stuff.company = "Moe's";
console.log(true, stuff.vld.isComplete());

可以通过从表单本身获取输入字段的名称来优化此方法，这样可以避免显式重新显示所有字段。

Answer 6

这对你有用吗？

isComplete: function () { 
    let result = this.firstName && this.lastName && this.email && this.password && this.address && this.postNumber && this.city && this.id_country && this.iAggre;
    if (this.is_company) result += this.taxNumber && this.company;
    return result; 
}

建议如何简化这个if语句

6 个答案: