- [Conventions use in 30DaysOfJavaScript](#conventions-use-in-30daysofjavascript)
- [Variables](#variables)
- [Arrays](#arrays)
- [Functions](#functions)
- [Loops](#loops)
- [Objects](#objects)
- [Conditional](#conditional)
- [Classes](#classes)
# Day 20
## Writing clean code
### JavaScript Style Guide
A JavaScript style guide is a set of standards that tells how JavaScript code should be written and organized. In this section, we will talk about JavaScript guides and how to write a clean code.
JavaScript is a programming language and like human language it has syntax. The syntax of JavaScript has to be written following a certain style guideline for sake of convince and simplicity.
### Why we need style guide
You have been coding alone for so long but now it seems to work in a team. It does not matter in anyway you write you code as long as it running, however when you work in team of 10 or 20 or more developer on one project and on the same code base, the code will be messy and hard to manage if there is no any guidelines to follow.
You can develop your own guidelines and conventions or you can also adapt well developed guidelines. Let us the most common know guidelines.
Most common JavaScript Style Guides
- Airbnb JavaScript Style Guide
- JavaScript Standard Style Guide
- Google JavaScript Style Guide
#### Airbnb JavaScript Style Guide
Airbnb has one of the most popular JavaScript style guides on the internet. It covers nearly every aspect of JavaScript as well and it is adopted by many developer and companies. You may checkout the [Airbnb style guide](https://github.com/airbnb/javascript). I would also recommend to try it. Their style is very easy to use and simple to understand.
#### Standard JavaScript Style Guide
This is guideline is not as popular as Airbnb but it worth to look at it. They removed the semicolon in their [style guide](https://standardjs.com/).
#### Google JavaScript Style Guide
I do not say much about Googles guideline and I did not use rather I would suggest you to have a look from this [link](https://google.github.io/styleguide/jsguide.html).
### JavaScript Coding Conventions
In this challenge also we used the general JavaScript coding writing conventions and guides. Coding conventions are style guidelines for programming which are developed by an individual, a team or a company.
Coding conventions helps:
- to write clean code
- to improve code readability
- to improve code re-useability and maintainability
Coding conventions includes
- Naming and declaration rules for variables
- Naming and declaration rules for functions
- Rules for the use of white space, indentation, and comments
- Programming practices and principles
#### Conventions use in 30DaysOfJavaScript
In this challenge we follow the regular JavaScript convention but I added also my preference of writing.
- We used camelCase for variables and functions.
- All variable names start with a letter.
- We chose to use *const* for constants, arrays, objects and functions. In stead of double quote, we chose to use single quote or backtick. Single quote is becoming trendy.
- We also removed semicolons from our code but it is a matter of personal preference.
- Space around arithmetic operators, assignment operators and after comma
- Arrow function instead of function declaration
- Explicit return instead of implicit return if the function is one liner
- No trailing comma in the last value of an object
- We prefer this +=, -=, *= /=, **= instead of the longer version
- When we use console.log() it is good to print with a tag string to identify from where the console is coming
By now you are very familiar function declaration, expression function, arrow function and anonymous function. In this challenge we tend to use array function instead of other functions. Arrow function is not a replacement for other functions. In addition, arrow functions and function declarations are not exactly the same. So you should know when to use and when not. I will cover the difference in detail in other sections. We will use explicit return instead of implicit return if the function is one liner
We say if, if else, if else if else, switch and ternary operators in previous challenges.
```js
// syntax
if (condition) {
// this part of code run for truthy condition
} else {
// this part of code run for false condition
}
```
```js
// if else
let num = 3
if (num > 0) {
console.log(`${num} is a positive number`)
} else {
console.log(`${num} is a negative number`)
}
// 3 is a positive number
```
```js
// if else if else if else
let a = 0
if (a > 0) {
console.log(`${a} is a positive number`)
} else if (a <0){
console.log(`${a} is a negative number`)
} else if (a == 0) {
console.log(`${a} is zero`)
} else {
console.log(`${a} is not a number`)
}
```
```js
// Switch More Examples
let dayUserInput = prompt('What day is today ?')
let day = dayUserInput.toLowerCase()
switch (day) {
case 'monday':
console.log('Today is Monday')
break
case 'tuesday':
console.log('Today is Tuesday')
break
case 'wednesday':
console.log('Today is Wednesday')
break
case 'thursday':
console.log('Today is Thursday')
break
case 'friday':
console.log('Today is Friday')
break
case 'saturday':
console.log('Today is Saturday')
break
case 'sunday':
console.log('Today is Sunday')
break
default:
console.log('It is not a week day.')
}
```
```js
// ternary
let isRaining = true
isRaining
? console.log('You need a rain coat.')
: console.log('No need for a rain coat.')
```
#### Classes
We declare class with CamelCase which starts with capital letter.
```js
// syntax
class ClassName {
// code goes here
}
```
```js
// defining class
class Person {
constructor(firstName, lastName) {
console.log(this) // Check the output from here
this.firstName = firstName
this.lastName = lastName
}
}
```
Whatever style guide you follow be consistent. Follow some programming paradigms and design patterns. Remember, if you do not write you code in certain order or fashion it will be hard to read your code. So, do a favor for yourself or for someone who is going to read your code by writing readable code.
🌕 You are tidy. Now, you knew how to write clean code, so anyone who know the English language can understand your code. You are always progressing and you are a head of 20 steps to your way to greatness.