Nested ternary: good vs bad

1.js

var data = x ? y ? z ? z : y : x : 0;

// I call this the "if..if" pattern, and it's BAD. It means:

var data;
if (x) {
  if (y) {
    if (z) {
      data = z;
    }
    else {
      data = y;
    }
  }
  else data = x;
}
else {
  data = 0;
}

2.js

var data = x ? x : y ? y : z ? z : 0;

// can be formatted as:

var data =
    x ? x :
    y ? y :
    z ? z :
    0;

// I call this the "if..else if" pattern, and it's much BETTER. It means:

var data;
if (x) {
  data = x;
}
else if (y) {
  data = y;
}
else if (z) {
  data = z;
}
else {
  data = 0;
}

Both of them are the root of bad readability.

Both of them are the root of bad readability.

Nope, only the first one is bad, but it's bad both ways ;-)