How to improve your code quality with ternary,AND,OR, nullish coalescing operators
Tags: javascript, beginners, productivity, programming
Published: 2022-02-22 10:23:13

If you are still using the or(||) and(&&) operators in just if statement you need to read this.

## Ternary operator

If you don't know what is ternary operator, is a simplified conditional operator like if / else.
it take 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.
```javascript
// With if else 
if(condition){
 expression1
}else{
 expression2
}

// With ternary operator
connditon ? expression1 : expression2 ;
```
Is really useful and make your code short and clean if you care about your code quality, here few tips on how you can improve your code quality with the ternary operator :
```javascript
let x;
5 > 0 ? (x = 'positive') : (x = 'negative');  //👎
x = 5 > 0 ? 'positive' : 'negative';  //👍


function myFunction(){
 //👎
 if(5>0){
  return true
 }else{
  return false
 }

 //👍
 return 5 > 0 ? true : false;
}
```
**when to avoid it** 🚫
 - nested: of course, we can use two or more ternary operators inside each other but not recommended, you won't be able to read your own code😅, so don't forget our goal to make the code clean and understandable.
 - long expression: if you have a lot of lines of code to execute, either make the whole code in a function and call it or use the if/else statement.

## AND operator(&&)
You may love using the ternary operator but what if you want to execute one expression if the condition is true "you can't do that!", here comes AND operator:
```JavaScript
// with if statement
if(condition){
 expression
}

// with and operator
condition && expression;
```
How it works🤔, well the **And operator** always check the truthiness of the first statement, if falsy is skip whatever next came after, and if truety he pass to next.
don't forget to use it with a small expressions. 

## OR operator


On the contrary, the OR operator check the truthiness of the first  statement if true he skipped the next one, so how we can use it?
For example, we expect an input value but we may get it or not, if we don't use backup our code will break.
```javascript
function check(e){
 const value = e.key ; //👎

 const value = e.key || "" ; //👍
 // here we say if e.key is falsy, value will be an empty string 

 console.log(value)
}
```

## Nullish coalescing operator

The problem with the **OR** operator is that returns the right value if the left value is falsy `0, "", false, null, undefined`.
But if you want to return the right value when the left value is _null_ or _undefined_ better use **nullish coalescing operator**, you may  not have heard about it before (I've also discovered it recently), he returns the right side if the left side is _Null_  or _undefined_
```javascript
// syntax 
const value = e.key ?? "";
// here we say if e.key is equal to null or undefined
// value will be an empty string 
```

### Thank you for reading 

These tips above really help me to improve my code quality, I'm sure if you start using these tips the right way, they gonna take your code to next level.