path: root/files/de/conflicting/web/javascript/reference/operators_8b4515dbed18a24ecb01bfe0755ca163/index.html

---
title: Logische Operatoren
slug: >-
  conflicting/Web/JavaScript/Reference/Operators_8b4515dbed18a24ecb01bfe0755ca163
tags:
  - JavaScript
  - Logic
  - Logical Operators
  - Not
  - Operator
  - Reference
  - and
  - or
translation_of: Web/JavaScript/Reference/Operators
translation_of_original: Web/JavaScript/Reference/Operators/Logical_Operators
original_slug: Web/JavaScript/Reference/Operators/Logische_Operatoren
---
<div>{{jsSidebar("Operators")}}</div>

<p>Logische Operatoren werden typischerweise im Zusammenhang mit {{jsxref("Boolean")}} (logischen) Werten verwendet. Die Operatoren <code>&amp;&amp;</code> (Logisches UND) und <code>||</code> (Logisches ODER) geben dabei den Wert von einem der Operanden zurück. Sind die Operanden mit nicht-booleschen Werten belegt, geben diese Operatoren entsprechend nicht-boolesche Werte zurück.</p>

<div>{{EmbedInteractiveExample("pages/js/expressions-logicaloperator.html")}}</div>



<h2 id="Beschreibung">Beschreibung</h2>

<p>In der folgenden Tabelle werden die logischen Operatoren erläutert.</p>

<table class="fullwidth-table">
 <tbody>
  <tr>
   <th>Operator</th>
   <th>Verwendung</th>
   <th>Beschreibung</th>
  </tr>
  <tr>
   <td>Logisches UND (<code>&amp;&amp;</code>)</td>
   <td><code><em>ausdruck1</em> &amp;&amp; <em>ausdruck2</em></code></td>
   <td>Gibt <code>ausdruck1</code> zurück, wenn er zu <code>false</code> konvertiert werden kann; anderfalls wird <code>ausdruck2</code> zurückgegeben. Sind beide Operanden <code>true</code>, gibt <code>&amp;&amp;</code> <code>true</code> zurück, Andernfalls <code>false</code>.</td>
  </tr>
  <tr>
   <td>Logisches ODER (<code>||</code>)</td>
   <td><code><em>ausdruck1</em> || <em>ausdruck2</em></code></td>
   <td>Gibt <code>ausdruck1</code> zurück, wenn er zu <code>true</code> konvertiert werden kann; andernfalls wird <code>ausdruck2</code> zurückgegeben. Ist einer der Operanden <code>true</code>, gibt <code>||</code> <code>true</code> zurück.</td>
  </tr>
  <tr>
   <td>Logisches NICHT (<code>!</code>)</td>
   <td><code>!<em>ausdruck</em></code></td>
   <td>Gibt <code>false</code> zurück, wenn der Operand zu <code>true</code> konvertiert werden kann. Andernfalls wird <code>true</code> zurückgegeben.</td>
  </tr>
 </tbody>
</table>

<p>Wenn ein Wert zu <code>true</code> konvertiert werden kann, wird er {{Glossary("truthy")}} genannt. Wenn ein Wert zu <code>false</code> konvertiert werden kann, wird er {{Glossary("falsy")}} genannt.</p>

<p>Beispiele für Ausdrücke, die zu <code>false</code> konvertiert werden können:</p>

<ul>
 <li><code>null</code></li>
 <li>NaN</li>
 <li><code>0</code></li>
 <li>leerer String (<code>""</code> oder <code>''</code>)</li>
 <li><code>undefined</code></li>
</ul>

<p>Auch wenn die Operatoren <code>&amp;&amp;</code> und <code>||</code> mit nichtbooleschen Operanden verwendet werden können, gehören sie trotzdem zur Gruppe der logischen Operatoren, da ihre Rückgabewerte immer zu booleschen Werten konvertiert werden können.</p>

<h3 id="Kurschlussauswertung_(Short-Circuit_Evaluation)">Kurschlussauswertung (Short-Circuit Evaluation)</h3>

<p>Logische Ausdrücke werden von links nach rechts ausgewertet und hierbei wird anhand der folgenden Regeln getestet, ob Kurzschlussauswertungen möglich sind:</p>

<ul>
 <li><code>false &amp;&amp; (<em>irgendwas)</em></code> wird kurzerhand zu false.</li>
 <li><code>true || (<em>irgendwas)</em></code> wird kurzerhand zu true.</li>
</ul>

<p>Die Regeln der Logik garantieren, dass diese Auswertungen immer korrekt sind. Zu beachten ist, dass der <em><code>irgendwas</code></em> Teil nicht ausgewertet wird, so dass keine Seiteneffekte die von diesem Teil ausgehen ausgeführt werden. Zu beachten ist zudem, dass der <em><code>irgendwas</code></em> Teil ein einzelner Ausdruck ist (wie die Klammern anzeigen).</p>

<p>Beispielhaft betrachten wir die folgenden äquivalenten Funktionen:</p>

<pre class="brush: js">function shortCircuitEvaluation() {
  // Logisches ODER (||)
  doSomething() || doSomethingElse();

  // Logisches UND (&amp;&amp;)
  doSomething() &amp;&amp; doSomethingElse();
}

function equivalentEvaluation() {

  // Logisches ODER (||)
  var orFlag = doSomething();
  if (!orFlag) {
    doSomethingElse();
  }

  // Logisches UND (&amp;&amp;)
  var andFlag = doSomething();
  if (andFlag) {
    doSomethingElse();
  }
}
</pre>

<p>Die folgenden Ausdrücke sind aufgrund der <a href="/de/docs/Web/JavaScript/Reference/Operators/Operator_Precedence">Operatorrangfolgen</a> nicht äquivalent und betont, wie wichtig es ist, dass der rechte Operand ein einzelner Ausdruck ist (gruppiert, falls in Klammern erforderlich).</p>

<pre class="brush: js">false &amp;&amp;  true || true      // wird zu true
false &amp;&amp; (true || true)     // wird zu false</pre>

<h3 id="Logisches_UND_()"><a id="Logical_AND" name="Logical_AND">Logisches UND (<code>&amp;&amp;</code>)</a></h3>

<p>Im Folgenden sind Beispiele des <code>&amp;&amp;</code> (logisches UND) Operators zu sehen.</p>

<pre class="brush: js">a1 = true  &amp;&amp; true      // t &amp;&amp; t wird zu true
a2 = true  &amp;&amp; false     // t &amp;&amp; f wird zu false
a3 = false &amp;&amp; true      // f &amp;&amp; t wird zu false
a4 = false &amp;&amp; (3 == 4)  // f &amp;&amp; f wird zu false
a5 = 'Cat' &amp;&amp; 'Dog'     // t &amp;&amp; t wird zu "Dog"
a6 = false &amp;&amp; 'Cat'     // f &amp;&amp; t wird zu false
a7 = 'Cat' &amp;&amp; false     // t &amp;&amp; f wird zu false
a8 = ''    &amp;&amp; false     // f &amp;&amp; f wird zu ""
a9 = false &amp;&amp; ''        // f &amp;&amp; f wird zu false
</pre>

<h3 id="Logisches_ODER_()"><a name="Logical_OR">Logisches ODER (<code>||</code>)</a></h3>

<p>Im Folgenden sind Beispiele des <code>||</code> (logisches ODER) Operators zu sehen.</p>

<pre class="brush: js">o1 = true  || true       // t || t wird zu true
o2 = false || true       // f || t wird zu true
o3 = true  || false      // t || f wird zu true
o4 = false || (3 == 4)   // f || f wird zu false
o5 = 'Cat' || 'Dog'      // t || t wird zu "Cat"
o6 = false || 'Cat'      // f || t wird zu "Cat"
o7 = 'Cat' || false      // t || f wird zu "Cat"
o8 = ''    || false      // f || f wird zu false
o9 = false || ''         // f || f wird zu ""
</pre>

<h3 id="Logisches_NICHT_(!)"><a name="Logical_NOT">Logisches NICHT (<code>!</code>)</a></h3>

<p>Im Folgenden sind Beispiele des <code>!</code> (logisches NICHT) Operators zu sehen.</p>

<pre class="brush: js">n1 = !true              // !t wird zu false
n2 = !false             // !f wird zu true
n3 = !"Cat"             // !t wird zu false
</pre>

<h3 id="Konvertierungsregeln">Konvertierungsregeln</h3>

<h4 id="Konvertierung_von_UND_zu_ODER">Konvertierung von UND zu ODER</h4>

<p>Die folgende Operation nutzt Booleane:</p>

<pre class="brush: js">bCondition1 &amp;&amp; bCondition2</pre>

<p>ist äquivalent zum folgenden Ausdruck:</p>

<pre class="brush: js">!(!bCondition1 || !bCondition2)</pre>

<h4 id="Konvertierung_von_ODER_zu_UND">Konvertierung von ODER zu UND</h4>

<p>Die folgende Operation nutzt Booleane:</p>

<pre class="brush: js">bCondition1 || bCondition2</pre>

<p>ist äquivalent zu folgendem Ausdruck:</p>

<pre class="brush: js">!(!bCondition1 &amp;&amp; !bCondition2)</pre>

<h4 id="Negierung_des_logischen_NICHT">Negierung des logischen NICHT</h4>

<p>Die folgende Operation nutzt Booleane:</p>

<pre class="brush: js">!!bCondition</pre>

<p>ist äquivalent mit:</p>

<pre class="brush: js">bCondition</pre>

<h3 id="Klammern_in_logischen_Ausdrücken_auflösen">Klammern in logischen Ausdrücken auflösen</h3>

<p>Ein logischer Ausdruck wird von links nach rechts ausgewertet. Es ist immer möglich runde Klammern von einem komplexen Ausdruck zu entfernen, wenn einige Regeln beachtet werden.</p>

<h4 id="Geschachteltes_AND_entfernen">Geschachteltes AND entfernen</h4>

<p>Die folgende Operation nutzt Booleane:</p>

<pre class="brush: js">bCondition1 || (bCondition2 &amp;&amp; bCondition3)</pre>

<p>ist äquivalent mit:</p>

<pre class="brush: js">bCondition1 || bCondition2 &amp;&amp; bCondition3</pre>

<h4 id="Geschachteltes_OR_entfernen">Geschachteltes OR entfernen</h4>

<p>Die folgende Operation nutzt Booleane:</p>

<pre class="brush: js">bCondition1 &amp;&amp; (bCondition2 || bCondition3)</pre>

<p>ist äquivalent mit:</p>

<pre class="brush: js">!(!bCondition1 || !bCondition2 &amp;&amp; !bCondition3)</pre>

<h2 id="Spezifikationen">Spezifikationen</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Spezifikation</th>
   <th scope="col">Status</th>
   <th scope="col">Kommentar</th>
  </tr>
  <tr>
   <td>{{SpecName('ES1')}}</td>
   <td>{{Spec2('ES1')}}</td>
   <td>Initiale Definition.</td>
  </tr>
  <tr>
   <td>{{SpecName('ES5.1', '#sec-11.11')}}</td>
   <td>{{Spec2('ES5.1')}}</td>
   <td>Definiert in mehreren Kapiteln der Spezifikation: <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.4.9">Logical NOT Operator</a>, <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.11">Binary Logical Operators</a></td>
  </tr>
  <tr>
   <td>{{SpecName('ES6', '#sec-binary-logical-operators')}}</td>
   <td>{{Spec2('ES6')}}</td>
   <td>Definiert in mehreren Kapiteln der Spezifikation: <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-logical-not-operator">Logical NOT Operator</a>, <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-binary-logical-operators">Binary Logical Operators</a></td>
  </tr>
  <tr>
   <td>{{SpecName('ESDraft', '#sec-binary-logical-operators')}}</td>
   <td>{{Spec2('ESDraft')}}</td>
   <td>Definiert in mehreren Kapiteln der Spezifikation: <a href="http://tc39.github.io/ecma262/#sec-logical-not-operator">Logical NOT Operator</a>, <a href="http://tc39.github.io/ecma262/#sec-binary-logical-operators">Binary Logical Operators</a></td>
  </tr>
 </tbody>
</table>

<h2 id="Browserkompatibilität">Browserkompatibilität</h2>



<p>{{Compat("javascript.operators.logical")}}</p>

<h2 id="Siehe_auch">Siehe auch</h2>

<ul>
 <li>{{jsxref("Operators/Bitwise_Operators", "Bitweise Operatoren")}}</li>
 <li>{{jsxref("Boolean")}}</li>
</ul>