{"id":892,"date":"2022-07-11T16:22:33","date_gmt":"2022-07-11T16:22:33","guid":{"rendered":"https:\/\/gyanipandit.com\/programming\/?p=892"},"modified":"2023-04-23T13:16:57","modified_gmt":"2023-04-23T13:16:57","slug":"ternary-operator-javascript","status":"publish","type":"post","link":"https:\/\/gyanipandit.com\/programming\/ternary-operator-javascript\/","title":{"rendered":"Ternary Operator in JavaScript"},"content":{"rendered":"<p style=\"text-align: center;\"><strong>Ternary Operator JavaScript<\/strong><\/p>\n<p>The conditional operator in <a href=\"https:\/\/gyanipandit.com\/programming\/javascript\/\">JavaScript<\/a> or the ternary operator in <a href=\"https:\/\/www.youtube.com\/playlist?list=PLSvOEh55hdXVt5Jht4mjDJNTAuHKfPMAT\">JavaScript<\/a> is kind of a short code for the if-else. You can use this instead of the if-else in some situations.<\/p>\n<h2 style=\"text-align: center;\">Ternary Operator JavaScript<\/h2>\n<p><iframe loading=\"lazy\" title=\"Javascript Ternary Operator | Lecture 27 | JavaScript for Beginners\" width=\"696\" height=\"392\" src=\"https:\/\/www.youtube.com\/embed\/G0w1_ckbjmY?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe><\/p>\n<p>Let&#8217;s have a look at the syntax first so that we can get a brief idea about what the ternary operator is &#8211;<\/p>\n<p style=\"text-align: center;\">condition ? exp1 : exp2;<\/p>\n<p>Well, that&#8217;s it. This is the syntax of the ternary operator. There is some condition (similar to what we give in the if statement) here, followed by a question mark. Then, we have an expression exp1, which executes if the condition is true. Then we have a colon, and then the expression exp2, which executes if the condition is false.<\/p>\n<p>First, let&#8217;s see something with the simple if-else statements, and then we will try to do the same thing with the help of a ternary operator.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-893 size-full\" src=\"https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/Ternary-operator-in-JavaScript.jpg\" alt=\"\" width=\"823\" height=\"158\" srcset=\"https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/Ternary-operator-in-JavaScript.jpg 823w, https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/Ternary-operator-in-JavaScript-300x58.jpg 300w, https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/Ternary-operator-in-JavaScript-768x147.jpg 768w\" sizes=\"auto, (max-width: 823px) 100vw, 823px\" \/><\/p>\n<p>So, if you try to run the above program, the output that we are going to have is \u2013 Number is even!<\/p>\n<p>You can try changing the values and see the changes. Now, this is one way, but we have another way as well. That is, using the ternary operator. Let&#8217;s now have an example, so that we can understand the working of the ternary operator.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-894 size-full\" src=\"https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/Ternary-operator-in-JavaScript-1.jpg\" alt=\"\" width=\"824\" height=\"97\" srcset=\"https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/Ternary-operator-in-JavaScript-1.jpg 824w, https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/Ternary-operator-in-JavaScript-1-300x35.jpg 300w, https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/Ternary-operator-in-JavaScript-1-768x90.jpg 768w\" sizes=\"auto, (max-width: 824px) 100vw, 824px\" \/><\/p>\n<p>If now we run to the console to see the output, we are going to see something like this &#8211;<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-895 size-full\" src=\"https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/Ternary-operator-in-JavaScript-3.jpg\" alt=\"\" width=\"1023\" height=\"180\" srcset=\"https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/Ternary-operator-in-JavaScript-3.jpg 1023w, https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/Ternary-operator-in-JavaScript-3-300x53.jpg 300w, https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/Ternary-operator-in-JavaScript-3-768x135.jpg 768w\" sizes=\"auto, (max-width: 1023px) 100vw, 1023px\" \/><\/p>\n<p>As you can see, this was pretty similar to the if-else thing. We can use this as and when required. It is frequently used in place of the simple if-else. But if there is the nesting of if-else, or there is some complication, we should avoid using the ternary operator, since it may create some sort of confusion. Otherwise, the ternary or conditional operator is very useful.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Ternary Operator JavaScript The conditional operator in JavaScript or the ternary operator in JavaScript is kind of a short code for the if-else. You can use this instead of the if-else in some situations. Ternary Operator JavaScript Let&#8217;s have a look at the syntax first so that we can get a brief idea about what [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[7],"tags":[14,15],"class_list":{"0":"post-892","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-javascript-tutorial","7":"tag-javascript","8":"tag-javascript-tutorial"},"_links":{"self":[{"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/posts\/892","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/comments?post=892"}],"version-history":[{"count":4,"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/posts\/892\/revisions"}],"predecessor-version":[{"id":6055,"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/posts\/892\/revisions\/6055"}],"wp:attachment":[{"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/media?parent=892"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/categories?post=892"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/tags?post=892"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}