Skip to main content

Conditional statement in javascript| Alternative of Conditional Statements






Conditional statements control behavior in JavaScript and determine whether or not pieces of code can run. ... “If” statements: where if a condition is true it is used to specify execution for a block of code. “Else” statements: where if the same condition is false it specifies the execution for a block of code.


How to use Conditional Statements

Conditional statements are used to decide the flow of execution based on different conditions. If a condition is true, you can perform one action and if the condition is false, you can perform another action.


Different Types of Conditional Statements

There are mainly three types of conditional statements in JavaScript.

  1. If statement
  2. If…Else statement
  3. If…Else If…Else statement

1) If statement

Syntax:

if (condition)


{


lines of code to be executed if condition is true


}


You can use If statement if you want to check only a specific condition.

Try this yourself:

<html>

<head>

<title>IF Statments!!!</title>

<script type="text/javascript">

var result_percentage = 200

if(result_percentage <=100)

document.write("Congrts <br />");

if(result_percentage >100)

document.write("RESULT Error <br />");

</script>

</head>

<body>

</body>

</html>


2) If…Else statement

Syntax:

if (condition)


{


lines of code to be executed if the condition is true


}


else


{


lines of code to be executed if the condition is false


}


You can use If….Else statement if you have to check two conditions and execute a different set of codes.

Try this yourself:


<html>

<head>

<title>If...Else Statments!!!</title>

<script type="text/javascript">

// Get the current hours

var hours = new Date().getHours();

if(hours<12)

document.write("Good Morning!!!<br />");

else

document.write("Good Afternoon!!!<br />");

</script>

</head>

<body>

</body>

</html>

3) If…Else If…Else statement

Syntax:

if (condition1)


{


lines of code to be executed if condition1 is true


}


else if(condition2)


{


lines of code to be executed if condition2 is true


}


else


{


lines of code to be executed if condition1 is false and condition2 is false


}


You can use If….Else If….Else statement if you want to check more than two conditions.

Try this yourself:


<html>

<head>

<script type="text/javascript">

var one = 10

var two = 20

one = parseInt(one);

two = parseInt(two);

if (one == two)

document.write(one + " is equal to " + two + ".");

else if (one<two)

document.write(one + " is less than " + two + ".");

else

document.write(one + " is greater than " + two + ".");

</script>

</head>

<body>

</body>

</html>


Alternative of Conditional Statements:

Conditional (ternary) operator

The conditional (ternary) operator is the only JavaScript operator that takes three operands: a condition followed by a question mark (?), then an expression to execute if the condition is truthy followed by a colon (:), and finally, the expression to execute if the condition is falsy. This operator is frequently used as a shortcut for the if statement.

Syntax:-

condition ? exprIfTrue : exprIfFalse


Parameters

condition
An expression whose value is used as a condition.
exprIfTrue
An expression which is evaluated if the condition evaluates to a truthy value (one which equals or can be converted to true).
exprIfFalse
An expression which is executed if the condition is falsy (that is, has a value which can be converted to false).

Description

Besides false, possible falsy expressions are: nullNaN0, the empty string (""), and undefined. If condition is any of these, the result of the conditional expression will be the result of executing the expression exprIfFalse.

Examples

A simple example

var age = 26;
var beverage = (age >= 21) ? "Beer" : "Juice";
console.log(beverage); // "Beer"

function getFee(isMember) {

  return (isMember ? '$2.00' : '$10.00');

}

console.log(getFee(true));

// expected output: "$2.00"

console.log(getFee(false));

// expected output: "$10.00"

console.log(getFee(null));

// expected output: "$10.00"


Comments

Popular posts from this blog

Top 10 topics to make YouTube video in angular

  Here are ten topic suggestions for making YouTube videos on Angular: Getting Started with Angular: An Introduction to the Angular Framework Components in Angular: Understanding and Creating Angular Components Directives in Angular: Understanding and Using Angular Directives Angular Routing: Setting up Routes and Navigation in Angular Applications Forms in Angular: Creating and Validating Forms with Angular Reactive Forms Pipes in Angular: Understanding and Using Angular Pipes to Transform Data Services in Angular: Creating and Using Angular Services for Data Management Angular Animations: Adding Animations to Angular Applications Angular Material: Implementing Material Design in Angular Applications Advanced Angular Topics: Exploring Advanced Angular Topics like Lazy Loading, AOT Compilation, and Dynamic Components.

Top 5 javascript frameworks

  Here are the top 5 JavaScript frameworks : React: Developed and maintained by Facebook, React is a popular JavaScript library for building user interfaces. Angular: Developed and maintained by Google, Angular is a complete framework for building dynamic web applications. Vue.js: A relatively new JavaScript framework, Vue.js has gained a lot of popularity in recent years for its simplicity and performance. Ember.js: Ember.js is a JavaScript framework that emphasizes conventions over configuration, making it a good choice for complex web applications. Backbone.js: Backbone.js is a lightweight JavaScript framework that provides structure for web applications, particularly those that need to work with a lot of data. It's worth noting that the popularity of these frameworks can change over time, and different frameworks may be better suited for different types of projects and use cases.