CODEWITHSUNDEEP
javascriptarraysecmascript-6reduce
j obe
j obe

Reputation: 2049

Trying to understand ternary condition logic in this example

I was doing a code kata which involves taking an array of football scores e.g.

["3:1", "2:2"]   (Total points here would be 4, 3 + 1)

and applying some rules and then summing up the points. One of the solutions was:

const points = g => g.reduce((a, [x, _, y]) => a + (x > y ? 3 : x == y), 0)

To clarify, the rules are, if 1st value is greater than 2nd return 3, if equal return 1, else return 0, similar to a football match scoring system.

How does the part "x == y" work in this case, the rule here is that if "x == y" then a single point should be returned.

If someone can explain this in a simple way with an example, that would help me, thanks.

On a side note if someone can explain the "[x, _, y]" I would also appreciate that. I understand it's supposed to represent the current item in the array, but the current item is a string, not an array, so what is happening here?

Upvotes: 3

Views: 158

Answers (5)

Ele
Ele

Reputation: 33726

The String values are kind of arrays (iterables) with indexes, so you can access the indexes:

So, you can destructure strings.

console.log("3:1"[0]);
console.log("3:1"[1]);
console.log("3:1"[2]);
.as-console-wrapper { max-height: 100% !important; top: 0; }

In your case, this is getting the first, second and third index [x, _, y]

let [x, _, y] = "3:1";
console.log(x, _, y);

This a + (x == y) is called coercion, true -> 1 and false -> 0.

console.log(1 + false);
console.log(1 + true);

Upvotes: 1

Micha
Micha

Reputation: 191

Here is a node session for you to study. First it shows modern JS string-to-array destructuring, second it shows some boolean behavior.

micha@linux-micha: ~
$ node
> [...arr] = "hello";
'hello'
> [...arr]
[ 'h', 'e', 'l', 'l', 'o' ]
> [x, dummy, y] = "3:2"
'3:2'
> x
'3'
> y
'2'
> dummy
':'
> typeof (x == y)
'boolean'
> typeof true
'boolean'
> typeof false
'boolean'
> 1 + true
2
> 1 + false
1
>

As you can see from that node session, "2:2" undergoes string-to-array destructuring, which results in x=2, y=2. Hence,x==y is boolean true. Now, there's a + (... x==y) in the function body, so the true value (aka x==y) is converted to a numerical 1 value, due to the + (plus) operator. So, a single point is returned.

Regards, M.

Upvotes: 1

Brian Adams
Brian Adams

Reputation: 45830

It's just a quirky type coercion side-effect of JavaScript.

true can be coerced to 1 when used like this in an arithmetic operation:

console.log('hi' == 'hi');  // true
console.log(0 + (true));  // 1
console.log(0 + ('hi' == 'hi'));  // 1

Upvotes: 2

Vincent Ramdhanie
Vincent Ramdhanie

Reputation: 103145

This comes down to how JavaScript interprets true and false. Try in the console the following:

let x = 1;
let y = 2;
2 + (x == y);

What do we expect here? x == y is evaluated to false so that last line is really:

2 + (false);

Then to resolve the addition it coerces that false into a number. In JavaScript false is 0. So its actually:

2 + 0

Now try this:

let x = 1;
let y = 1;
2 + (x == y);

And what do we expect now? Since x == y will now evaluate to true and true will be coerced into a 1 this is actually:

2 + 1;

Upvotes: 2

Adrian Brand
Adrian Brand

Reputation: 21648

It is destructuring the string

x is the first char, _ is an unused variable and y is the 3rd;

const [x, _, y] = "3:1";

console.log(x);
console.log(_);
console.log(y);

Upvotes: 2

Related Questions