diff options
Diffstat (limited to 'files/id/web/javascript/reference/operators/conditional_operator')
| -rw-r--r-- | files/id/web/javascript/reference/operators/conditional_operator/index.html | 167 |
1 files changed, 0 insertions, 167 deletions
diff --git a/files/id/web/javascript/reference/operators/conditional_operator/index.html b/files/id/web/javascript/reference/operators/conditional_operator/index.html deleted file mode 100644 index 1a64158acb..0000000000 --- a/files/id/web/javascript/reference/operators/conditional_operator/index.html +++ /dev/null @@ -1,167 +0,0 @@ ---- -title: Operasional Kondisi (ternary) -slug: Web/JavaScript/Reference/Operators/Conditional_Operator -translation_of: Web/JavaScript/Reference/Operators/Conditional_Operator ---- -<div>{{jsSidebar("Operators")}}</div> - -<p><strong>Operasianal kondisional (ternary)</strong> adalah satu-satunya operator yang hanya membutuhkan tiga operator. Operator ini sering digunakan sebagai jalan pintas untuk `if` statement.</p> - -<h2 id="Syntax">Syntax</h2> - -<pre class="syntaxbox"><em>condition</em> ? <em>expr1</em> : <em>expr2</em> </pre> - -<h3 id="Parameters">Parameters</h3> - -<dl> - <dt><code>condition (atau conditions)</code></dt> - <dd>Sebuah ekspresi akan menguji apakah menghasilkan <code>true</code> atau <code>false</code>.</dd> -</dl> - -<dl> - <dt><code>expr1</code>, <code>expr2</code></dt> - <dd>Ekspresi yang akan dilakukan setelah kondisi terpenuhi.</dd> -</dl> - -<h2 id="Description">Description</h2> - -<p>Jika <code>condition</code> menghasilkan <code>true</code>, maka operator ini akan menghasilkan/mengembalikan nilai dari <code>expr1</code>; dan jika sebaliknya, ini akan menghasilkan/mengembalikan nilai dari <code>expr2</code>. Sebagai contoh, untuk menampilkan pesan yang berbeda berdasarkan nilai dari variabel <code>isMember</code>, anda bisa menggunakan contoh kode berikut:</p> - -<pre class="brush: js">var isMember = true; -'The fee is ' + (isMember ? '$2.00' : '$10.00'); //$2.00 -</pre> - -<p>Anda juga dapat mendefinisikan sebuah variabel secara langsung:</p> - -<pre class="brush: js">var elvisLives = Math.PI > 4 ? 'Yep' : 'Nope';</pre> - -<p>Anda juga bisa menggunakan operator ternary secara jamak (catatan: conditional operator adalah associative yang lebih baik):</p> - -<pre class="syntaxbox">var firstCheck = false, secondCheck = false, access = firstCheck ? 'Access denied' : secondCheck ? 'Access denied' : 'Access granted'; -console.log(access); // logs "Access granted"</pre> - -<p>Anda juga dapat menggunakan pengondisian jamak seperti pengondisian jamak pada statement IF pada umumnya:</p> - -<pre class="syntaxbox">var condition1 = true, - condition2 = false, - access = condition1 ? (condition2 ? "true true": "true false") : (condition2 ? "false true" : "false false"); - -console.log(access); // logs "true false" -</pre> - -<p> </p> - -<p>Note: The parentheses are not required, and do not affect the functionality. They are there to help visualize how the outcome is processed.</p> - -<p>You can also use ternary evaluations in free space in order to do different operations:</p> - -<pre class="brush: js">var stop = false, age = 16; - -age > 18 ? location.assign('continue.html') : stop = true; -</pre> - -<p>You can also do more than one single operation per case, separating them with a comma, and enclosing them in parenthesis:</p> - -<pre class="brush: js">var stop = false, age = 23; - -age > 18 ? ( - alert('OK, you can go.'), - location.assign('continue.html') -) : ( - stop = true, - alert('Sorry, you are much too young!') -); -</pre> - -<p>You can also do more than one operation during the assignation of a value. In this case, <strong><em>the last comma-separated value of the parenthesis</em> will be the value to be assigned</strong>.</p> - -<pre class="brush: js">var age = 16; - -var url = age > 18 ? ( - alert('OK, you can go.'), - // alert returns "undefined", but it will be ignored because - // isn't the last comma-separated value of the parenthesis - 'continue.html' // the value to be assigned if age > 18 -) : ( - alert('You are much too young!'), - alert('Sorry :-('), - // etc. etc. - 'stop.html' // the value to be assigned if !(age > 18) -); - -location.assign(url); // "stop.html"</pre> - -<h3 id="Returning_Ternary_Statements">Returning Ternary Statements</h3> - -<p>The ternary operator lends itself well to function returns that would otherwise require an <code>if/else</code> statement.</p> - -<pre class="brush: js">var func1 = function( .. ) { - if (condition1) { return value1 } - else { return value2 } -} - -var func2 = function( .. ) { - return condition1 ? value1 : value2 -}</pre> - -<p>A good way to spot that the ternary will be a suitable replacement for an <code>if/else</code> statement is when the <code>return</code> keyword is used multiple times and is the only expression inside of the if block.</p> - -<p>By breaking the ternary onto multiple lines and making use of extra whitespace, the ternary operator can be used to very cleanly replace a lengthy series of <code>if/else</code> statements. This provides a syntactically light way of expressing the same logic:</p> - -<pre class="brush: js">var func1 = function( .. ) { - if (condition1) { return value1 } - else if (condition2) { return value2 } - else if (condition3) { return value3 } - else { return value4 } -} - -var func2 = function( .. ) { - return condition1 ? value1 - : condition2 ? value2 - : condition3 ? value3 - : value4 -}</pre> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-conditional-operator', 'Conditional Operator')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-conditional-operator', 'Conditional Operator')}}</td> - <td>{{Spec2('ES6')}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName('ES5.1', '#sec-11.12', 'The conditional operator')}}</td> - <td>{{Spec2('ES5.1')}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName('ES1', '#sec-11.12', 'The conditional operator')}}</td> - <td>{{Spec2('ES1')}}</td> - <td>Initial definition. Implemented in JavaScript 1.0.</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - - - -<p>{{Compat("javascript.operators.conditional")}}</p> - -<h2 id="See_also">See also</h2> - -<ul> - <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/if...else">if statement</a></li> -</ul> |