admin管理员组文章数量:1401491
I wrote a little check for an input field that counts the length and makes sure it is the proper amount. It gets plex because it needs to allow either 9 digits or 1 letter and 5 digits. The way I have it now works but the code hurts my brain, I would like to see what a more elegant solution would look like for this, maybe using ternary and/or switch?
So a little part of the not so pretty that I have in place now :
if (len !== 9) {
if (len == 1) {
y.hide();
n.show();
valInput.text("You need 8 more numbers");
} else {
if (len == 2) {
y.hide();
n.show();
valInput.text("You need 7 more numbers");
} else {
if (len == 3) {
y.hide();
n.show();
valInput.text("You need 6 more numbers");
} else {
if (len == 4) {
y.hide();
n.show();
valInput.text("You need 5 more numbers");
} else {
if (len == 5) {
y.hide();
n.show();
valInput.text("You need 4 more numbers");
} else {
if (len == 6) {
y.hide();
n.show();
valInput.text("You need 3 more numbers");
} else {
if (len == 7) {
y.hide();
n.show();
valInput.text("You need 2 more numbers");
} else {
if (len == 8) {
y.hide();
n.show();
valInput.text("You need 1 more number");
} else {
if (len > 9) {
y.hide();
n.show();
valInput.text("Order number must be 9 digits");
// gt 9
}
// 8
}
// 7
}
// 6
}
// 5
}
// 4
}
// 3
}
// 2
}
// 1
}
// this is not equal to 9
}
UPDATE
Thanks for all the answers! Lots of good stuff, I will accept my favorite after I play for a while. To clarify what happens when the proper requirements are met then the submit button fades in but not until it is validated. Not sure if it is relevant but will mention that the function also runs as "live type" so the message with the count is returned after each .keyup()
I wrote a little check for an input field that counts the length and makes sure it is the proper amount. It gets plex because it needs to allow either 9 digits or 1 letter and 5 digits. The way I have it now works but the code hurts my brain, I would like to see what a more elegant solution would look like for this, maybe using ternary and/or switch?
So a little part of the not so pretty that I have in place now :
if (len !== 9) {
if (len == 1) {
y.hide();
n.show();
valInput.text("You need 8 more numbers");
} else {
if (len == 2) {
y.hide();
n.show();
valInput.text("You need 7 more numbers");
} else {
if (len == 3) {
y.hide();
n.show();
valInput.text("You need 6 more numbers");
} else {
if (len == 4) {
y.hide();
n.show();
valInput.text("You need 5 more numbers");
} else {
if (len == 5) {
y.hide();
n.show();
valInput.text("You need 4 more numbers");
} else {
if (len == 6) {
y.hide();
n.show();
valInput.text("You need 3 more numbers");
} else {
if (len == 7) {
y.hide();
n.show();
valInput.text("You need 2 more numbers");
} else {
if (len == 8) {
y.hide();
n.show();
valInput.text("You need 1 more number");
} else {
if (len > 9) {
y.hide();
n.show();
valInput.text("Order number must be 9 digits");
// gt 9
}
// 8
}
// 7
}
// 6
}
// 5
}
// 4
}
// 3
}
// 2
}
// 1
}
// this is not equal to 9
}
UPDATE
Thanks for all the answers! Lots of good stuff, I will accept my favorite after I play for a while. To clarify what happens when the proper requirements are met then the submit button fades in but not until it is validated. Not sure if it is relevant but will mention that the function also runs as "live type" so the message with the count is returned after each .keyup()
-
4
try to use
switch. Btw, you can merge them to one single if..else...: if (len < 9) { y.hide(); n.show(); valInput.text("You need " + (9 - len) + " more numbers"); } – zs2020 Commented Sep 16, 2013 at 17:47 -
1
Textbook example of when to use
switch:D – tymeJV Commented Sep 16, 2013 at 17:48 -
2
For sure use
switch, but even without it why is this such a monstrosity? There is also anelse if... – Jon Commented Sep 16, 2013 at 17:48 - 1 This is not a textbook example of when to use switch. This is a textbook example of when to program with parameters and variables instead of checking magic numbers. – Jordan Commented Sep 16, 2013 at 17:51
- Thanks for the ments.. @jon this is just a small piece of the beast, believe me it is much more monstrous than this.. I will rewrite with switch then if that is the consensus, I was thinking might be a way to even avoid that since all that changes is the integer – Zac Commented Sep 16, 2013 at 17:53
7 Answers
Reset to default 5If you don't want to use switch, you can do something like this:
if (len < 9) {
y.hide();
n.show();
valInput.text("You need " + (9 - len) + " more number(s)");
}
else if (len > 9) {
y.hide();
n.show();
valInput.text("Order number must be 9 digits");
}
else {
// all good here...
}
And if you don't like the "number(s)" part, just check if len is not 1, and add that "s" to the "number".
As those look all the same why not use this:
if (len !== 9) {
var diff = 9 - len;
var value = ( 0 < diff ? "You need " + diff + " more numbers" : "Order number must be 9 digits" );
y.hide();
n.show();
valInput.text(value);
}
I think you should calculate the remaining characters through javascript, since that's the only difference in all the other if else branches, so you can do something like this and would be much more readable:
if (len !== 9) {
y.hide();
n.show();
if (len > 9) {
valInput.text("Order number must be 9 digits");
}
else{
var remaining = 9 - len;
valInput.text("You need " + remaining + " more numbers");
}
}
In your particular case it looks like the validation is simple enough for something like this:
function validate(len) {
var msg;
if (len == 9)
return true;
y.hide(); /* no need to duplicate these calls in each condition */
n.show();
if (len < 9)
msg = 'You need ' + (9-len) + ' more number' + (len == 1 ? '' : 's') + '.';
else
msg = 'You entered ' + (len-9) + ' number' + (len == 1 ? '' : 's') + ' too many.;
valInput.text(msg);
return false;
}
Comment: === should be saved for when needed, not just to be fancy! Unfortunately so many are taught to avoid double equals rather than actually understanding its useful and helpful extra features like type conversion. In this situation there is no reason whatsoever to use triple equals.
But in general, such as if your sequence of conditionals does something more significant than alert a sequence of messages varying only by a consecutive integer, then use switch...
switch (len) {
case 1:
/* handle this case */;
y.hide();
n.show();
valInput.text("You need 8 more numbers");
break;
/* make sure to end case 1 with a break; */
case 2:
y.hide();
n.show();
valInput.text("You need 7 more numbers");
break;
/* make sure to end every case with a break; */
...
}
You can simplify this to:
if (len !== 9) {
valInput.text("You need " + (9 -len ) + " more numbers");
y.hide();
n.show();
}
Why even use a switch or a huge if?
if(len == 9){
// do stuff.
}else{
y.hide();
n.show();
if(9 > len)
valInput.text("You need " + (len - 9) + " less numbers");
else
valInput.text("You need " + (9 - len) + " more numbers");
valInput.text("Order number must be 9 digits");
}
Just declare the range of the values you want then concatenate the string.
the shortest alternative:
(y.hide(), n.show(), valInput.text(
len < 9 && "You need " + (9-len) + " more digits"
|| len > 9 && "too many ("+ (len-9) + ") digits"
|| "ok!"
));
本文标签： javascriptMore efficient way to write this ifelseStack Overflow
版权声明：本文标题：javascript - More efficient way to write this ifelse - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1744277752a2598498.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论