Any way to toggle between two strings using one piece of JavaScript?

问题

I want to do something like

if(something.val() == 'string1')
{
     something.val('string2');
}
else if(something.val() == 'string2')
{
    something.val('string1')
}

But in one line of code. I can't quite remember how it's done, but it involves question marks and colons...

回答1:

Try:

something.val(something.val() == 'string1' ? 'string2' : 'string1');

It is called a ternary expression.

回答2:

Look ma, no ternary operator!

The following works because Javascript short circuits boolean expressions.

If something == string1 then evaluate string2 -- since string2 is a truthy value and the next expression involves the OR operation there is no need to continue. Stop and return string2.

If something !== string1 then it will skip the next operand because if it is false, there is no point in evaluating the next operand (with AND). It will "jump" to the OR operation and return string1.

function toggleString(something, string1, string2) {
   return something == string1 && string2 || string1;
}

something.val(toggleString(something.val(), "string1", "string2"));

If you want the assignment done:

function toggleValue(something, string1, string2) {
   something.val(something.val() == string1 && string2 || string1);
}

toggleValue(something, "string1", "string2"); // something is a jQuery collection

In the end however, I would end up using the ternary operator because this solution might be unclear to other programmers. If you come from Java or other languages, you may expect the function to return a boolean because of all the boolean operators.

回答3:

How about using @Daniel's code along with a jquery function:

$.fn.toggleVal = function (str1, str2) {
     return this.val(this.val() == str1 && str2 || str1);
};
$("input").toggleVal('string 1', 'string 2');

回答4:

Another way to do it using object properties:

{ 'string1': 'string2', 'string2': 'string1' }[value]

As in the question:

something.val(
  { 'string1': 'string2', 'string2': 'string1' }[something.val()]
)

回答5:

You mean to use the ternary operator:

something.val((something.val() == 'string1') ? 'string2' : 'string1');

回答6:

As of jQuery 1.4, you can do this:

something.val(function(index, val) {
    return val == 'string1' ? 'string2' : 'string1';
});

回答7:

Though, the solutions with a ternary operator are the most readable, you could also use xor from Lodash:

x = _.xor([a, b], [x])[0]

For your specific case:

something.val(_.xor(['s1', 's2'], [something.val()])[0]);

Ref: https://lodash.com/docs/4.17.10#xor

回答8:

 something.val( something.val() == 'string1'? 'string2' : 'string1' );

or for clarification

val astring = something.val() == 'string1'? 'string2' : 'string1';
something.val( astring );

回答9:

something.val(something.val() == 'string1' ? 'string2' : 'string1');

来源：https://stackoverflow.com/questions/3807736/any-way-to-toggle-between-two-strings-using-one-piece-of-javascript

标签

javascript

jquery

logic