288

私はいくつかの JavaScript をデバッグしていますが、これが何をするのか説明できません||:

function (title, msg) {
  var title = title || 'Error';
  var msg   = msg || 'Error on Request';
}

こいつはなんで使ってるのvar title = title || 'ERROR'？var宣言なしでも時々見かけます。

4

12 に答える 12

237

これは、title引数がオプションであることを意味します。したがって、引数なしでメソッドを呼び出すと、デフォルト値の が使用されます"Error"。

それは書くための省略形です：

if (!title) {
  title = "Error";
}

ブール式を使用したこの種の速記は、Perl でも一般的です。次の式を使用します。

a OR b

またはであるtrue場合に評価されます。したがって、true の場合は、まったくチェックする必要はありません。これは短絡ブール評価と呼ばれるので、次のようになります。abtrueab

var title = title || "Error";

titleが に評価されるかどうかを基本的にチェックしfalseます。そうである場合は「戻り」"Error"、そうでない場合は を返しますtitle。

于 2010-05-10T11:00:26.717 に答える
234

二重パイプ演算子 ( ||) とは?

二重パイプ演算子 ( ||) は論理OR演算子です。ほとんどの言語では、次のように機能します。

  • 最初の値が の場合false、2 番目の値をチェックします。それが の場合は をtrue返しtrue、2 番目の値が の場合はfalseを返しますfalse。
  • 最初の値が の場合、2 番目の値に関係なくtrue、常に を返しますtrue。

したがって、基本的には次の関数のように機能します。

function or(x, y) {
  if (x) {
    return true;
  } else if (y) {
    return true;
  } else {
    return false;
  }
}

それでもわからない場合は、次の表を見てください。

      | true   false  
------+---------------
true  | true   true   
false | true   false

つまり、両方の値が false の場合にのみ false になります。

JavaScript ではどのように違うのですか?

JavaScript は型付けが緩い言語であるため、少し異なります。この場合、||ブール値以外の値で operator を使用できることを意味します。意味はありませんが、この演算子を関数とオブジェクトなどで使用できます。

(function(){}) || {}

そこでは何が起こりますか？

値が boolean でない場合、JavaScript は暗黙的に boolean に変換します。これは、値が false の場合 (例: 0、""、null( JavaScript のすべての falsey 値undefinedも参照))、 として扱われることを意味します。それ以外の場合は として扱われます。falsetrue

したがって、true空の関数は真であるため、上記の例は を与えるはずです。そうではありません。空の関数を返します。それは冒頭に書いたように JavaScript の||演算子が動かないからです。次のように動作します。

  • 最初の値がfalseの場合、2 番目の値を返します。
  • 最初の値がtrueの場合、最初の値を返します。

驚いた？||実際、従来のオペレーターと「互換性」があります。次の関数のように記述できます。

function or(x, y) {
  if (x) {
    return x;
  } else {
    return y;
  }
}

として真の値を渡すと、真の値xである が返されxます。したがって、if句の後半で使用する場合:

(function(x, y) {
  var eitherXorY = x || y;
  if (eitherXorY) {
    console.log("Either x or y is truthy.");
  } else {
    console.log("Neither x nor y is truthy");
  }
}(true/*, undefined*/));

あなたが得る"Either x or y is truthy."。

xが falsey の場合、eitherXorYになりますy。この場合、"Either x or y is truthy."if ywas true;を取得します。そうでなければ、あなたは得るでしょう"Neither x nor y is truthy"。

実際の質問

さて、演算子がどのように機能するかを知って||いれば、おそらく自分で何を意味するかを理解できるでしょうx = x || y。xが true の場合、xに割り当てられるためx、実際には何も起こりません。それ以外の場合yは に割り当てられxます。これは、関数で既定のパラメーターを定義するためによく使用されます。ただし、誤った値 (または であるとは限らない) をパラメーターとして渡すことができないため、多くの場合、不適切なプログラミング手法と見なされます。次の例を検討してください。undefinednull

function badFunction(/* boolean */flagA) {
  flagA = flagA || true;
  console.log("flagA is set to " + (flagA ? "true" : "false"));
}

一見有効に見えます。ただし、パラメーターfalseとして渡した場合はどうなるでしょうか(ブール値であるため、 orになる可能性があるため)。となります。この例では、 に設定する方法はありません。flagAtruefalsetrueflagAfalse

次のように であるflagAかどうかを明示的に確認することをお勧めします。undefined

function goodFunction(/* boolean */flagA) {
  flagA = typeof flagA !== "undefined" ? flagA : true;
  console.log("flagA is set to " + (flagA ? "true" : "false"));
}

長くなりますが、常に機能し、理解しやすくなっています。

デフォルトの関数パラメーターに ES6 構文を使用することもできますが、古いブラウザー (IE など) では機能しないことに注意してください。これらのブラウザーをサポートしたい場合は、コードをBabelでトランスパイルする必要があります。

MDN の論理演算子も参照してください。

于 2016-01-10T16:18:39.613 に答える
29

タイトルが設定されていない場合は、デフォルト値として「ERROR」を使用します。

より一般的な:

var foobar = foo || default;

読み取り: foobar をfooまたはに設定しdefaultます。これを何度も連鎖させることもできます：

var foobar = foo || bar || something || 42;
于 2010-05-10T10:59:57.903 に答える
14

これをもう少し説明すると…

operatorは||論理or演算子です。結果は、最初の部分が true の場合は true、2 番目の部分が true の場合は true、両方の部分が true の場合は true です。わかりやすくするために、次の表に示します。

 X | Y | X || Y 
---+---+--------
 F | F |   F    
---+---+--------
 F | T |   T    
---+---+--------
 T | F |   T    
---+---+--------
 T | T |   T    
---+---+--------

ここで何か気づきましたか？が true の場合X、結果は常に true です。したがって、それが真実であることがわかっている場合Xは、チェックする必要はまったくありませんY。orこのように、多くの言語は、logical- (およびand反対方向から来るlogical-)の「短絡」エバリュエーターを実装しています。彼らは最初の要素をチェックし、それが真であれば、2 番目の要素をまったくチェックしません。結果は (論理的には) 同じですが、2 番目の要素の計算にコストがかかる場合、実行に関しては大きな違いが生じる可能性があります。

それで、これはあなたの例と何の関係がありますか？

var title   = title || 'Error';

それを見てみましょう。要素が関数に渡されtitleます。JavaScript では、パラメーターを渡さない場合、デフォルトで null 値になります。また、JavaScript では、変数が null 値の場合、論理演算子によって false と見なされます。したがって、この関数がタイトルを指定して呼び出された場合、それは false ではない値であり、したがってローカル変数に割り当てられます。ただし、値が指定されていない場合は null 値になり、false になります。次に、論理or演算子は 2 番目の式を評価し、代わりに「エラー」を返します。したがって、ローカル変数には「エラー」という値が与えられます。

これは、JavaScript での論理式の実装により機能します。適切なブール値 (trueまたは) を返すのではなく、 と同等と見なされるものと と同等とfalse見なされるものに関するいくつかのルールの下で指定された値を返します。JavaScript リファレンスを参照して、ブール値のコンテキストで JavaScript が true または false と見なすものを確認してください。truefalse

于 2010-05-10T11:14:53.490 に答える
10

||基本的に、 の前の値が true と評価されるかどうかをチェックします。はいの場合はこの値を取得し、そうでない場合は の後の値を取得します||。

||（私が覚えている限り）の後の値を取る値：

  • 未定義
  • 間違い
  • 0
  • '' (ヌルまたはヌル文字列)
于 2010-05-10T11:02:12.443 に答える
8

二重パイプは論理「OR」を表します。これは、「パラメーターが設定されていない」場合には当てはまりません。これは、厳密には JavaScript で次のようなコードがある場合です。

function foo(par) {
}

次に、呼び出します

foo()
foo("")
foo(null)
foo(undefined)
foo(0)

は同等ではありません。

二重パイプ (||) は最初の引数をブール値にキャストし、結果のブール値が true の場合は割り当てを行い、それ以外の場合は正しい部分を割り当てます。

これは、未設定のパラメーターをチェックする場合に重要です。

オプションのパラメーターを 1 つ持つ関数 setSalary があるとします。ユーザーがパラメーターを指定しない場合は、デフォルト値の 10 を使用する必要があります。

次のようにチェックを行う場合：

function setSalary(dollars) {
    salary = dollars || 10
}

これは、次のような呼び出しに対して予期しない結果をもたらします。

setSalary(0)

上記のフローに従って、引き続き 10 を設定します。

于 2010-05-10T11:11:38.127 に答える
5

二重管オペレーター

この例は役に立つかもしれません:

var section = document.getElementById('special');
if(!section){
     section = document.getElementById('main');
}

次のこともできます。

var section = document.getElementById('special') || document.getElementById('main');
于 2010-05-10T11:01:22.610 に答える
-5

そして、もう 1 つ付け加えなければならないことがあります。偶発的なインタープリターの最適化 (最初の操作が真実である場合は 2 番目の操作を気にしない) を悪用して、代入を制御します。その使用は、オペレーターの目的とは何の関係もありません。私はそれが決して使われるべきではないと信じています。

初期化には三項演算子を好みます。たとえば、

var title = title?title:'Error';

これは、正しい目的のために 1 行の条件付き操作を使用します。それはまだ真実で見苦しいゲームをプレイしますが、それはあなたのための JavaScript です。

于 2016-04-29T19:43:33.093 に答える