#Day29 - From Python to JavaScript - The Basics Part 2

In yesterday's article, we discussed the following

• Why you should learn JavaScript
• How to Run JavaScript/Python and show output
• Variables
• Comments

Today, we will talk about the following

• Conditional Statements
• Blocks
• Comparison Operators
• Logical Operators
• Truthy and Falsy Values
• Ternary Operators
• Switch Cases

Conditional Statements

Python

Python supports the following

• if statements
• else statements
• elif statements Below is an example

num = 10

if num > 20:
  print("If statement")
elif num > 10:
  print("Elif statement")
else:
  print("Else statement")

Let's try writing the same code snippet in JavaScript

JavaScript

JavaScript supports the following

• if statements
• else statements
• else if statements - else if statements in JavaScript are similar to elif statements in Python

Unlike Python, in JavaScript, the conditions must be in parenthesis

let num  = 10

if (num > 20)
  console.log("If Statement")
else if (num > 10)
  console.log("Elif Statement")
else
  console.log("Else Statement")

Blocks

What if we want multiple statements inside if...else blocks?

Python

In Python, we use the colon operator and indentation to declare blocks

num = 10

if num > 20:
  print("If statement 1")
  print("If statement 2")
else:
  print("Else statement 1")
  print("Else statement 2")

JavaScript

In JavaScript, Indentation is not mandatory. It is just good practice to make your code more readable. We use { } to declare blocks

let num  = 10

if (num > 20){
  console.log("If Statement 1")
  console.log("If Statement 2")
}
else{
  console.log("Else Statement 1")
  console.log("Else Statement 2")
}

Comparison Operators

Python

Python has the following comparison operators

< , <=
> , >=
==, != 

JavaScript

JavaScript has all of the above operators along with a couple of additional operators

===
!==

So what's the difference between ==,!= and === and !== in JavaScript?

The == and the != only compare the value irrespective of their type. Consider the following code snippet

if (10 == "10")
  console.log("If statement is True")
else
  console.log("Else statement is True")

/*
OUTPUT
If statement is True
*/

The if condition is actually true when using the == operator. Although the data types are different, the values are the same.

In Python 10 == "10" is False. Python compares both the value and the type.

The following also evaluate to True in JavaScript

1 == [1]
'1' == [1]

On the other hand, the === and !== operators compare both the value and the data type. So basically === and !== in JavaScript is similar to == and != in Python

if (  10 === "10")
  console.log("If statement is True")
else
  console.log("Else statement is True")

/*
OUTPUT
Else statement is True
*/

Python doesn't have support for any operator which works the way == works in JavaScript. To achieve similar functionality, we could use typecasting and convert both sides of the condition to the same type

if str(10) == "10":
  print("If Statement is True")
else:
  print("Else Statement is True")

'''
OUTPUT
If Statement is True
'''

Logical Operators

Python

In python, we can use the following operators to combine expressions

• and
• or
• not

var1 = True
var2 = False
var3 = True
var4 = True

if var1 and var2 or var3 and not var4:
  print("It evaluates to True")
else:
  print("It evaluates to False")

JavaScript

JavaScript has the following logical operators

• && - and operator in Python
• || - or in operator Python
• ! - not operator in Python

let var1 = true
let var2 = false
let var3 = true
let var4 = true

if (var1 && var2 || var3 && !var4)
  console.log("It evaluates to True")
else
  console.log("It evaluates to False")

Truthy and Falsy Values

Truthy and Falsy values are values, not restricted to boolean values, that evaluates to either True or False

Python

In Python, the following evaluate to False

• Empty String - "" or ''
• None
• empty iterable
• 0
• 0.0
• False

JavaScript

In JavaScript, the following evaluate to False

• Empty String - "" or ''
• null
• undefined
• NaN
• 0
• 0.0
• false

In JavaScript, empty arrays(lists) [] and empty objects {} are truthy values, i.e. they evaluate to True.

Ternary Operators

Python

num = 10
num_type = "Even" if num%2 ==0 else "Odd"

JavaScript

In javascript, use the following syntax for ternary operators

let variableName = condition ? trueCase : falseCase

If we wanted to write the python code snippet with ternary operators in JavaScript

let num = 10
let num_type = num%2 ? "Even" : "Odd"

Switch Cases

Python

Switch Cases was not supported till Python 3.10. Unfortunately, a stable version of Python 3.10 is not available as of today.

JavaScript

Below is the general syntax for switch-case statements in JavaScript

switch (expression){
   case value1:
      // code
     break
   case value2:
     // code
    break
  .
  .
  .
  .
  default:
   // code
}

• If the value of the variable matches any of the cases, the specific case bloc is executed
• Remember to include a break statement in each case block, otherwise, even if a case is matched, the following cases will also be executed.
• The default block is like a wildcard, i.e if None of the cases are matched, the default block is executed

Below is the switch case in action

let cost = 10

switch (cost){
  case 5:
  console.log("It is greater than 5")
  case 8:
  console.log("It is greater than 8")
  case 10:
  console.log("It is greater than 10")
  default:
  console.log("Default")
}

/*
OUTPUT
It is greater than 10
Default
*/

We did not use break statements, as a result, both the last case along with the default block was executed.

let cost = 10

switch (cost){
  case 5:
  console.log("It is greater than 5")
  break
  case 8:
  console.log("It is greater than 8")
  break
  case 10:
  console.log("It is greater than 10")
  break
  default:
  console.log("Default")
}

/*
OUTPUT
It is greater than 10
*/

Since we have break statements in place in the above code-snippet, only the last case block was executed.