如何确保数组没有空值？

Question

我想在提交表单之前测试我的数组（输入值）。

我的数组有值：

const fields = [
  this.state.workshopSelected,
  this.state.countrySelected,
  this.state.productionTypeSelected,
  this.state.numEmployeesSelected,
  this.state.startAt
];

我试过这个：

_.forEach(fields, (field) => {
  if (field === null) {
    return false;
  }
});

alert('Can submit !');
...

我认为我的问题是因为我没有使用 Promise。我尝试使用Promise.all(fields).then(()); 进行测试，但我总是在then。

有人知道吗？

谢谢你:)

Answer 1

问题在于，即使您提前终止了lodash _.forEach 循环，您也不会else对您拥有null 条目的信息执行任何操作。

代替 lodash 的 _.forEach，我会使用内置的 Array#includes（相当新）或 Array#indexOf 来确定是否有任何条目是 null：

if (fields.includes(null)) { // or if (fields.indexOf(null) != -1)
    // At least one was null
} else {
    // All were non-null
    alert('Can submit !');
}

对于更复杂的测试，您可以使用Array#some，它可以让您为测试提供回调。

indexOf 的实时示例：

const state = {
  workshopSelected: [],
  countrySelected: [],
  productionTypeSelected: [],
  numEmployeesSelected: [],
  startAt: []
};
const fields = [
  state.workshopSelected,
  state.countrySelected,
  state.productionTypeSelected,
  state.numEmployeesSelected,
  state.startAt
];
if (fields.indexOf(null) != -1) {
  console.log("Before: At least one was null");
} else {
  console.log("Before: None were null");
}
fields[2] = null;
if (fields.indexOf(null) != -1) {
  console.log("After: At least one was null");
} else {
  console.log("After: None were null");
}

Answer 2

除非有异步操作（例如，如果您从服务器获取该数组），否则您不需要使用 Promise。

如果您已经拥有该数组，您可以执行以下操作：

// Using lodash/underscore
var isValid = _.every(fields, (field) => (field!==null)}

// OR using the Array.every method

var isValid = fields.every((field)=>(field!==null))

// Or using vanilla JS only
function checkArray(array){
   for(var i = 0; i < array.length ; i ++){
       if(array[i]===null){
           return false;
       }
   }
   return true;
}

var isValid = checkArray(fields);

// After you get that value, you can execute your alert based on it
if(!isValid){
    alert('Something went wrong..');
}

Answer 3

试试这个简单的 sn-p

var isAllowedToSubmit = true;
_.forEach(fields, (field) => {
  if (!field) {
    isAllowedToSubmit = false;
  }
});

if(isAllowedToSubmit)
 alert('Can submit !');

Answer 4

你可以在没有库的情况下做到这一点：

if (fields.some(field => field === null)) {
    alert('Cannot submit');
} else {
    alert('Can submit');
}

Answer 5

你不需要使用 lodash，你可以用简单的 vanilla javascript 来做到这一点。只需遍历每个字段，如果发生错误，请将您的 errors bool 设置为 true

let errors = false;
fields.forEach(field) => {
  if(field === null || field === '') {
    errors = true;
  }
});

if (!errors) {
  alert('Yay no errors, now you can submit');
}

你可以使用 es6。

 const hasNoError = fields.every((field, index, selfArray) => field !== null);
 if (!hasNoError) {
    alert('yay It works');
 };

查看 Array.every 文档Array every MDN documentation