The Qodesmith
The Qodesmith

Reputation: 3375

How to use the OR operator (`||`, double vertical line) to compare an expression against multiple possible values?

var choice1 = prompt("Enter choice 1");
var choice2 = prompt("Enter choice 2");

if (choice1 === "x" && choice2 === ("a" || "b" || "c")) {
  alert("Good job!");
}

Assume the user input x for choice1 and c for choice 2.

The above is a simple example to highlight my issue. I know it doesn't work but my question is why? Javascript won't compare the multiple || statements within () against choice2. Why not? The logic in my mind is choice2 is the same type and value (===) as "a" or "b" or "c".

The way I got it working was this:

(choice1 === "x" && ((choice2 === "a") || (choice2 === "b") || (choice3 === "c"));

Please help me understand why when using multiple ||'s, you need to explicitly write out each || scenario as opposed to putting a bunch within () as I tried up top. Thanks.

Upvotes: 2

Views: 179

Answers (4)

adeneo
adeneo

Reputation: 318302

It just doesn't work that way, you can't compare one value against multiple other values using OR, you have to compare each value individually.

The closest you'll get is using Array.indexOf

if ( ['a', 'b', 'c'].indexOf(choice2) != -1 )

The reason it doesn't work is because OR and AND checks for a truthy value, so in

('a' || 'b' || 'c') // return "a"

a is a truthy value, so the OR never proceeds, it doesn't have to, it already has a truthy value so the expression is true, and you're left with a, the rest is discarded

Upvotes: 4

Gabriel Sadaka
Gabriel Sadaka

Reputation: 1746

What is in the brackets get evaluated first so ("a" || "b" || "c") will evaluate to "a" because what you are effectively saying is return either "a" or "b" or "c" so it returns "a" because that is first.

I believe what you are expecting is ("a" || "b" || "c") to act some sort of set operation but JavaScript doesn't have that feature so your code choice2 === ("a" || "b" || "c") will only ever be true if the user chose "a". The best way to compare multiple values with choice2 is to store "a","b" and "c" in an array and see if choice2 exists in it. ["a","b","c"].indexOf(choice2) != -1.

In most languages you won't even be able to compare three strings but JavaScript does everything it can to not throw exceptions so it doesn't cause the user of the website to realise there is a problem with the page so it will try and compare the three strings as you would compare three booleans but instead of returning a boolean it returns a string. I would avoid that syntax completely as it would confuse most developers not familiar with the weird ways of JavaScript.

Upvotes: 0

Jenish Rabadiya
Jenish Rabadiya

Reputation: 6766

(object || object) syntax is something like null check operator not for condition check in javascript.

so

  1. console.log(null || "b") would log b

  2. console.log(undefined || "b") would log b

  3. console.log(("a" || "b")) would log a

console.log(null || "b")
console.log(undefined || "b")
console.log(("a" || "b"))

Your condintion(below) will only work if choice2 is "a" and choice1 is "x".

if (choice1 === "x" && choice2 === ("a" || "b" || "c")) {
  alert("Good job!");
}

Upvotes: 0

sarveshseri
sarveshseri

Reputation: 13985

In JavaScript, if you do this

var a = null;
var b = {};
var c = "haha"

var d = a || b || c;

the value of d will be b. Expressions of type var1 || var2 || var3 return with the value of first not null or not undefined value.

So, in you case choice2 === ("a" || "b" || "c") is same as writing choice2 === "a".

Upvotes: 0

Related Questions