web-dev-qa-db-ja.com

JS Ternary関数は複数の条件で機能しますか？

JavaScriptで三項演算子を使用して、ユーザー入力に基づいてオブジェクトの値を変更しています。次のコードを実行します。

var inputOneAns = inputOne == "Yes" ? "517" : "518";

ご覧のとおり、ユーザーが「はい」または「いいえ」を入力したかどうかに関係なく、数値文字列値をinputOneAnsに割り当てています。ただし、ユーザーが値を選択していない場合もあります（必須ではないため）。この入力を空白のままにした場合、空の文字列 ""をinputOneAnsに割り当てたいと思います。別の三項演算子の中に三項演算子を埋め込む方法または私はいますか？明確にするのを助けるために、ここに私が三項関数で満足させたいのと同じ関数がありますが、if elseステートメントがありますか？

if (inputOne == "Yes"){
    var inputOneAns = "517"
}else if (inputOne == "No"{
    var inputOneAns = "518"
}else{
    var inputOneAns = ""
}

三項関数に複数の式を含めることは可能ですか？私が探しているものを達成するためのより良い方法はありますか？事前にヒントをありがとう。

javascriptif-statementconditionalternary-operator
11
user7366442

はい、あなたは野生の入れ子の三元に行くことができます。このバージョンはかなり読みやすいと思います：

var foo = (
  bar === 'a' ? 1 : // if 
  bar === 'b' ? 2 : // else if 
  bar === 'c' ? 3 : // else if
  null // else 
);

しかし、それは広く共有されている意見ではなく、おそらくif/elseまたはswitchチームで作業する場合。

18
Damon

このような状況では、switchステートメントがおそらく最良の選択です。

let inputOneAns;
switch(inputOne) {
  case "Yes":
   inputOneAns = "517";
   break;
  case "No":
   inputOneNas = "518";
   break;
  default:
   inputOneNas = "";
}

2つの条件を超えて3項演算を実行できた場合、それらは非常に厄介になります。条件をまとめることはできますが、なぜそれが必要になるのか私にはわかりません-それは信じられないほど面倒です.

3
Ramzi C.

最もエレガントでクリーンな方法は、オブジェクトリテラルを利用することです。

const Switch = (str) => ({
  "Yes": "517",
  "No": "518",
})[str] || '';

console.log(Switch("Yes")); // 517
console.log(Switch("No"));  // 518
console.log(Switch("Non matching value")); // Empty

これには、読みやすく柔軟性があるという利点があります。

1
Mosè Raguzzini
var r = inputOne == "" ? "" : ( 
inputOne == "Yes" ? "517" : "518");
1
Abrar Hossain

残念ながら、JavaScriptはこれを行うための非常に簡潔で読みやすい方法を提供していません。個人的には、次のような単一行のifステートメントを使用します。

var inputOneAns;
if (inputOne === 'Yes') inputOneAns = '517';
if (inputOne === 'No') inputOneAns = '518';
else inputOneAns = '';

これを関数に抽象化すると、さらにクリーンになります（注：この場合はelseは不要です）。

function getInputOneAns(inputOne) {
    if (inputOne === 'Yes') return '517';
    if (inputOne === 'No') return '518';
    return '';
}

個人的に、私はこの2つの理由でswitchステートメントがあまり好きではありません。1つはコードを膨らませる余分なbreakステートメントで、もう1つはswitchステートメントが非常に制限されていることです。単一の変数。さらに、常に単一の文字列をチェックすることがわかっている場合は、単純なマップオブジェクトを使用します。

var map = { 'Yes': '517', 'No': '518' };
var inputOneAns = map[inputOne] || '';
1
jackocnr

ええ、else ifステートメントを使用するのと同じようにそれらをチェーンできますが、読みにくい場合もあります。そのため、私は複数の行に分割する傾向があります。

var inputOneAns = inputOne == 'Yes' ? '517' :
  inputOne == 'No' ? '518' : '';

ただし、この場合は、すべてのケースで同じ値を比較しているので、switchステートメントを使用することをお勧めします。

0
BenShelton

Switchステートメントの古典的な使用法のようです：

let inputOneAns = '';
switch(inputOne) {
  case 'Yes':
    inputOneAns = "517";
    break;
  case 'No': 
    inputOneAns = "518";
    break;
  default:
    inputOneAns = "";
}
  • デフォルトの大文字小文字は実際には必要ないことに注意してください。
0
RickTakes