Question

js对象中可以有多个属性吗？

我想构建一个类似于workaway.info的网站，并考虑如何设计搜索组件。在高级搜索选项下，他们有大约30个复选框，用于各种类型的工作。每个职位列表中都可以包含多种工作类型。

对象中的每个复选框选项都有boolean属性，或者所有选项中包含array输入的boolean属性是不是很常见？

任何理由选择一个而不是另一个？

    ...
//Method 1:
function Job(theCompany, thePosition){
  this.company = theCompany;
  this.position = thePosition;
  this.isMedical = true;
  this.isAdministrative = true;
  this.isLaw = false;
  ...
  }

//Method 2:
function Job(theCompany, thePosition){
  this.company = theCompany;
  this.position = thePosition;
  this.typeOptions = [true, true, false...];
  ...
  }

Answer 1

一般来说，the property limit是65535.由于你不会达到这个限制，你的问题纯粹是风格。

我认为我这样做的首选方法是拥有一个字符串标志数组。例如：

function Job(theCompany, thePosition) {
    this.company = theCompany;
    this.position = thePosition;
    this.typeOptions = ['medical', 'administrative'];
}

Answer 2

这里没有完美的答案，它会根据编程风格而大幅改变。

我建议反对的一件事是你的第二种选择，从字面意义上来说;

options = [ true, true, true, true, false, true, true, false, false, false, false, /*...*/];

在保持代码的上下文的同时，无法理解每个人所做的事情。

单个对象上的布尔属性很好，但是当您在同一嵌套级别上谈论单个对象上的数十个属性（更不用说数万个属性）时，它们会变得难以处理。

在更现代的浏览器（或使用ES5 polyfill的旧浏览器）中，我觉得这是Set的主要候选者;

var options = new Set();

form.onchange = function (e) {
  var el = e.target;
  if (isCheckbox(el)) {
    if (el.checked) {
      options.add( el.value );
    } else {
      options.delete( el.value );
    }
  }
};

我可能会这样写它的原因是添加键的代码并不需要知道关于键的任何信息。

在较大的应用程序中，采用通用方法，将数据输入框架（React / Angular / Ember / etc / hand-made），自动构建表单，侦听事件，并从动态构建中提取值像这样的方式的页面，使得它更难以推理，但也使得更容易添加，删除或修改选项，在路上，只有显示选项的代码，以及使用该值的代码需要照顾。

const formOptions = [
  { label: "Medical", value: "medical" },
  { label: "Legal", value: "legal" }
];

const form = buildForm(formOptions);
/* ...previous code... */
form.onsubmit = function () {
  Array.from(options). /* map, filter, forEach, reduce, etc */( ... );
};

其余代码介于两者之间，只是布线。

再次，不完美;不是唯一的答案，而是一个人，以及为什么。

Answer 3

选择方法1：为了便于维护代码，任何阅读代码的人都会确切地知道什么意思

Answer 4

我更喜欢i，因为它让开发人员以一些有意义的方式访问属性名称，这个名称是有意义的，而不是通过索引数组。这个方法可以帮助开发人员在将来进行更好的调试。如果你使用数组，开发人员会完全转发你的注释和业务逻辑，找出数组中每个元素的确切目的，这使调试变得非常困难。method 1有助于非常好的调试，并遵循标准，每个变量都应该有一些有意义的名称。

js对象中的属性太多

4 个答案: