Search code examples
javascriptoperator-keywordternary

JS Ternary operator confusion


I'm learning about ternary operators now. I got the basics down, but then I saw this snippet and it doesn't make any sense to me. Can anyone please explain how is it put together?!

b.m & 4 || (c |= 2, 63 <= a && 77 >= a ? a = 65 : 48 <= a && 57 >= a ? a = 48 : c & 1 ? 97 <= a && 122 >= a ? a = 65 : 197 == a || 229 == a ? c &= 5 : 192 <= a && 687 >= a ? a = 192 : 1536 <= a ? a = 1536 : 912 <= a ? a = 912 : 160 <= a ? a = 160 : 127 <= a ? c &= 5 : 33 <= a ? a = 59 : c &= 5 : 48 > a ? c &= 5 : 65 > a ? a = 59 : 96 > a ? c &= 5 : 112 > a ? a = 96 : 187 > a ? c &= 5 : a = 59);

b.m & 4 || are bit operations as far as I understood, then (c |= 2, another bit operation, but what does comma mean?!

Then there's 63 <= a && 77 >= a ? a = 65 : 48

which translates to

if(a >= 63 && a <= 77){ a = 65 } else { a = 48; }

and then after that comes <= a && 57 >= a ? a = 48 : c & 1 ? 97 <= a which doesn't make any sense to me at all. because 48 was for the previous statement. Can anyone


Solution

  • Comma is a separate operator in javascript:

    The comma operator evaluates both of its operands (from left to right) and returns the value of the second operand.

    You have grasped just a part of expression:

    Then there's 63 <= a && 77 >= a ? a = 65 : 48

    Actually it is a little bit longer (with some formatting):

    63 <= a && 77 >= a
        ? a = 65
        : 48 <= a && 57 >= a
            ? a = 48
            : c & 1
                ? 97 <= a && 122 >= a
                    ? a = 65
                    : 197 == a || 229 == a
                        ? c &= 5
                        : 192 <= a && 687 >= a
                            ? a = 192
                            : 1536 <= a
                                ? a = 1536
                                : 912 <= a
                                    ? a = 912
                                    : 160 <= a
                                        ? a = 160
                                        : 127 <= a
                                            ? c &= 5
                                            : 33 <= a
                                                ? a = 59
                                                : c &= 5
                : 48 > a
                    ? c &= 5
                    : 65 > a
                        ? a = 59
                        : 96 > a
                            ? c &= 5
                            : 112 > a
                                ? a = 96
                                : 187 > a
                                    ? c &= 5
                                    : a = 59
    

    Trying to rewrite it in if-else fasion will yield the following result:

    if (63 <= a && 77 >= a){
        a = 65
    } else if (48 <= a && 57 >= a){
        a = 48
    } else if (c & 1){
        if (97 <= a && 122 >= a){
            a = 65
        } else if (197 == a || 229 == a){
            c &= 5
        } else if (192 <= a && 687 >= a){
            a = 192
        } else if (1536 <= a){
            a = 1536
        } else if (912 <= a){
            a = 912
        } else if (160 <= a){
            a = 160
        } else if (127 <= a){
            c &= 5
        } else if (33 <= a){
            a = 59
        } else {
            c &= 5
        }               
    } else {
        if (48 > a){
            c &= 5
        } else if (65 > a){
            a = 59
        } else if (96 > a){
            c &= 5
        } else if (112 > a){
            a = 96
        } else if (187 > a){
            c &= 5
        } else {
            a = 59
        }
    }
    

    Please, pay attention that if-else approach lacks returning value currently, whereas ternary operator does return the value of the last operator executed (this may affect the overall value of boolean expression in parentheses).