Develop Reference

How to use check multiple object properties

I have an if-statement: if all the properties of an object have values, then the next button will be enabled.
const handleButton = () => {
if(
values.streetAdress !== ""
&& values.postalCode !== ""
&& values.city !== ""
&& values.sex !== ""
&& values.birthName !== ""
&& values.birthPlace !== ""
&& values.birthday !== ""
&& values.country !== ""
&& values.family !== ""
&& values.insuranceID !== ""
){
setDisabeld(false)
}else{
setDisabeld(true)
}
Is there a way to shorten this expression, so all properties will be checked at once?

you can use the Array.prototype.every() method on the values of the object.
const isNotEmpty = Object.values(values).every((v) => v !== '')
if(isNotEmpty) {
setDisabeld(false)
} else{
setDisabeld(true)
}

How to minimize the if statement in javascript

I have a very long if-conditional statement. How can I minimize it?
Here is my code,
if(this.refs.category.value.trim() != "" &&
this.refs.decisive_min.value.trim() != "" && this.refs.decisive_max.value.trim() != "" &&
this.refs.interactive_min.value.trim() != "" && this.refs.interactive_max.value.trim() != "" &&
this.refs.stabilizing_min.value.trim() != "" && this.refs.stabilizing_max.value.trim() != "" &&
this.refs.cautious_min.value.trim() != "" && this.refs.cautious_max.value.trim() != "" &&
this.refs.aesthetic_min.value.trim() != "" && this.refs.aesthetic_max.value.trim() != "" &&
this.refs.economic_min.value.trim() != "" && this.refs.economic_max.value.trim() != "" &&
this.refs.individualistic_min.value.trim() != "" && this.refs.individualistic_max.value.trim() != "" &&
this.refs.political_min.value.trim() != "" && this.refs.political_max.value.trim() != "" &&
this.refs.altruist_min.value.trim() != "" && this.refs.altruist_max.value.trim() != "" &&
this.refs.regulatory_min.value.trim() != "" && this.refs.regulatory_max.value.trim() != "" &&
this.refs.theoretical_min.value.trim() != "" && this.refs.theoretical_max.value.trim() != ""){
var data = {category:this.refs.category.value.trim()};
data.decisive_min = this.refs.decisive_min.value.trim();
data.decisive_max = this.refs.decisive_max.value.trim();
data.interactive_min = this.refs.interactive_min.value.trim();
data.interactive_max = this.refs.interactive_max.value.trim();
data.stabilizing_min = this.refs.stabilizing_min.value.trim();
data.stabilizing_max = this.refs.stabilizing_max.value.trim();
data.cautious_min = this.refs.cautious_min.value.trim();
data.cautious_max = this.refs.cautious_max.value.trim();
data.aesthetic_min = this.refs.aesthetic_min.value.trim();
data.aesthetic_max = this.refs.aesthetic_max.value.trim();
data.economic_min = this.refs.economic_min.value.trim();
data.economic_max = this.refs.economic_max.value.trim();
data.individualistic_max = this.refs.individualistic_max.value.trim();
data.individualistic_min = this.refs.individualistic_min.value.trim();
data.political_min = this.refs.political_min.value.trim();
data.political_max = this.refs.political_max.value.trim();
data.altruist_min = this.refs.altruist_min.value.trim();
data.altruist_max = this.refs.altruist_max.value.trim();
data.regulatory_min = this.refs.regulatory_min.value.trim();
data.regulatory_max = this.refs.regulatory_max.value.trim();
data.theoretical_min = this.refs.theoretical_min.value.trim();
data.theoretical_max = this.refs.theoretical_max.value.trim();
I just want to check all the values in the form if they are all not empty string.
I used refs by React JS in Meteor.

You could use an array with the wanted keys. Then take only one loop for assigning and checking.
If all values are truthy, data contains the trimmed values, otherwise it is undefined.
var keys = ['category', 'decisive_min', 'decisive_max', 'interactive_min', 'interactive_max', 'stabilizing_min', 'stabilizing_max', 'cautious_min', 'cautious_max', 'aesthetic_min', 'aesthetic_max', 'economic_min', 'economic_max', 'individualistic_min', 'individualistic_max', 'political_min', 'political_max', 'altruist_min', 'altruist_max', 'regulatory_min', 'regulatory_max', 'theoretical_min', 'theoretical_max'],
data = {};
data = keys.every(function (k) {
return data[k] = this.refs[k].value.trim();
}, this) && data || undefined;

Using ES2015, you can do something like that :
Inside your component
const fields = getFields(this.refs);
if (checkFieldsNotEmpty(fields)) {
const data = {category:this.refs.category.value.trim()};
fields.forEach(field => {
data[`${field.name}_min`] = field.valueMin;
data[`${field.name}_max`] = field.valueMax;
});
// ...
}
Outside your component (can be static methods)
const fieldNames = [
'decisive',
'interactive',
'stabilizing',
// ...
];
const getFields = refs => fieldNames.map(name => ({
name,
valueMin: refs[`${fieldName}_min`].value.trim(),
valueMax: refs[`${fieldName}_max`].value.trim()
}));
const checkFieldsNotEmpty = fields => {
for (let field of fields) {
if (field.valueMin === '' || field.valueMax === '') {
return false
}
}
return true;
};

Try using
for (var property in this.refs) {
if (this.refs.hasOwnProperty(property)) {
// perform a null check
if(this.refs[property]){
//perform operaion
data[property] = this.refs[property].trim();
}
}
}

How to check null and undefined both values for the property?

I have two properties where i need to check null and undefined both for each, how can i use that in if else statements ?
main.js
var validateControlRating = function () {
if ( ($scope.controlProcessRatingDTO.controlPerformanceRatingKey === null ||
$scope.controlProcessRatingDTO.controlPerformanceRatingKey === undefined)
&&
($scope.controlProcessRatingDTO.controlDesignRatingKey === null ||
$scope.controlProcessRatingDTO.controlDesignRatingKey === undefined) ) {
$scope.caculatedRatingDiv = false;
} else {
$http.get('app/control/rest/calculateControlEffectiveness/' + $scope.controlProcessRatingDTO.controlDesignRatingKey + '/' + $scope.controlProcessRatingDTO.controlPerformanceRatingKey).success(function (data) {
$scope.calcaulatedRating = data;
}, function (error) {
$scope.statusClass ='status invalid userErrorInfo';
var errorMessage = error.data.errorMsg;
if (error.data.techErrorMsg) {
errorMessage = error.data.techErrorMsg;
}
$scope.statusInfo = errorMessage;
});
$scope.ratingValidationMsg = '';
$scope.ratingWinValidationClass = 'valid';
$scope.caculatedRatingDiv = true;
$scope.enableRatingSave = false;
}
};

It's a little tedious in javascript, you have to write each condition, and use parentheses etc
if ( ($scope.controlProcessRatingDTO.controlPerformanceRatingKey === null ||
$scope.controlProcessRatingDTO.controlPerformanceRatingKey === undefined)
&&
($scope.controlProcessRatingDTO.controlDesignRatingKey === null ||
$scope.controlProcessRatingDTO.controlDesignRatingKey === undefined) ) {...
or just
if ([null, undefined].indexOf( $scope.controlProcessRatingDTO.controlPerformanceRatingKey ) === -1
&&
[null, undefined].indexOf( $scope.controlProcessRatingDTO.controlDesignRatingKey ) === -1) {...

I think you need to to check this correclty, check for undefined then for null
and use && not || because your code will go to check null value for undefined variable and this surely will throw exception
code:
if( typeof myVar == 'undefined' ? false: myVar )
{ // go here defined and value not null
}
or
code:
if(typeof myVar != 'undefined' && myVar)
{ // go here defined and value not null
}
In your code check will go like
if ((typeof $scope.controlProcessRatingDTO.controlDesignRatingKey !== undefined||
typeof $scope.controlProcessRatingDTO.controlPerformanceRatingKey !== undefined) &&
($scope.controlProcessRatingDTO.controlDesignRatingKey !== null ||
$scope.controlProcessRatingDTO.controlPerformanceRatingKey !== null)) {
// do home work
}else { // do other home work }

You can use negate operator as well, but this would make work for "false" as well:
if (!$scope.controlProcessRatingDTO.controlPerformanceRatingKey && !$scope.controlProcessRatingDTO.controlDesignRatingKey) {
This is a bit shorter but if you want to treat False values separately, then use the Adeneo's answer above.

You could do this:
if ( some_variable == null ){
// some_variable is either null or undefined
}
taken from: How to check for an undefined or null variable in JavaScript?

testing multiple variables that are object or not

I'm trying to get if both variables are object return true else return false
var sString = "test string";
var oString = new String("test objects");
if( typeof sString == 'object' && typeof oObject == 'object'){
alert('true');
} else {
alert('false');
}
It's alerting fasle. And it's okay.
var sString = new String("some test");
var oString = new String("test objects");
if( typeof sString == 'object' && typeof oObject == 'object'){
alert('true');
} else {
alert('false');
}
It's alerting false. But should return true!
I've tried like this too: typeof sString && oString == 'object' but not working.

I think there's a typo in your code:
if( typeof sString == 'object' && typeof oObject == 'object')
But your variables are called sString and oString. typeof oObject, if oObject is not defined, will return 'undefined', and that's why it alerts 'false'

If-statement condition checking on != "undefined" fails

I'm trying to generate some HTML content for a google maps infowindow. I have 7 values which is supposed to be displayed if they do not equal null, undefined or "" (empty string).
But apparently my if(e.Property != null || e.Property != "undefined" || e.Property == "") doesn't work when a Property is undefined. Mostly the case is that e.Email is undefined. So instead of skipping that part, my code still inserts the html + "<br /> part. And when I alert() the e.Email it returns undefined which it's supposed to catch and skip if that was the case.
I have tried writting if(typeof e.Property != null || typeof e.Property != "undefined" || typeof e.Property == ""), but that made no difference.
// 'e ' is JSON object
var generateHTML = {
init: function(e) {
if (e != null || e != "undefined"){
generateHTML.check(e);
}
},
check: function (e) {
if(e.Title != null || e.Title != "undefined" || e.Title == ""){
html = html + "<b>"+e.Title+"</b>";
}
if(e.Address != null || e.Address != "undefined" || e.Address == ""){
html = html +"<br />"+ e.Address;
}
if(e.Zipcode != null || e.Zipcode != "undefined" || e.Zipcode == ""){
html = html +"<br />"+ e.Zipcode+", ";
}
if(e.City != null || e.City != "undefined" || e.City == ""){
html = html + e.City;
}
if(e.Phone != null || e.Phone != "undefined" || e.Phone == ""){
html = html +"<br />"+ e.Phone;
}
if(e.Email != null || e.Email != "undefined" || e.Email == ""){
html = html +"<br />"+ e.Email;
}
if(e.WebAddress != null || e.WebAddress != "undefined" || e.WebAddress == ""){
html = html +"<br />"+ e.WebAddress;
}
return html;
}
};

You want to check for !== undefined
e.g.
if(myvar !== undefined) {
//DO SOMETHING
}

If you want a more shorthand version you can just use:
if (e.Title) {
// add to HTML
}
if (e.Address) {
// add to HTML
}
You may want to consider building your HTML as an Array and then joining at the end to avoid creating many strings, e.g.
var html = [];
html.push("FirstName");
html.push("<br />");
html.push("LastName");
html.push("<br />");
html.push("Number");
var output = html.join(""); // "FirstName<br />LastName<br />Number"

if(e) //this would be shorter
if(e != undefined)
//
if(typeof(e) != 'undefined')

undefined is a variable name, not a string.
You don't need the quotes around it.

You are checking it as if its value is string "undefined"
remove the ""

better check something via e.length cause variables type are not acurate in JavaScript

I would also use the length function, if the array or object is empty the Logged length will be 0.0, i.e.
if(e.length == 0){
//then do something or nothing
}
else {
//Do somthing
}