Improve your JS skills with those tips #2
Tags: javascript, node, webdev, codenewbie
Published: 2021-09-24 09:46:23

In this article I will share with you some news tips about JS that can improve your skills!

### Don't use `delete` to remove property

`delete` is very bad to remove a property from an object (bad performance), moreover it will create a lot of **side effects**.

But what you should do if you need to remove a property?

You need to use **Functional approach** and create a new object without this property. You can manage to do this with a function like this 👇

```javascript
const removeProperty = (target, propertyToRemove) => {
    // We split the property to remove from the target in another object
    const { [propertyToRemove]: _, ...newTarget } = target
    return newTarget
}

const toto = { a: 55, b: 66 }
const totoWithoutB = removeProperty(toto, 'b') // { a: 55 }
```
A very simple snippet that will help you a lot!

### Add a property to an object only if it exists

Sometimes we need to add a property to an object if this property is defined. We can make something like this 👇


```javascript
const toto = { name: 'toto' }
const other = { other: 'other' }
// The condition is not important
const condition = true

if (condition) {
   other.name = toto.name 
}
```

❌ It's not very good code anyway...

✅ You can use something more elegant!👇

```javascript
// The condition is not important
const condition = true

const other = {
   other: 'other',
   ...condition && { name: 'toto' }
}
```
*For more explication about spread operator on boolean: https://dev.to/codeoz/comment/1ib4g*

If the condition is true, you add the property to your object (it work thanks to the `&&` operator)

I could also make this 👇

```javascript
// The condition is not important
const condition = true
const toto = { name: 'toto' }

const other = {
   other: 'other',
   ...condition && toto
}
```

### Use template literal string

When we learn strings in javascript and we need to concat them with variable we code something like 👇

```javascript
const toto = 'toto'
const message = 'hello from ' + toto + '!' // hello from toto!
```

❌ It can become garbage if you add other variables and string!

You can use template literal string

You just need to replace simple or double quotes by back-tick. 

And wrap all variables by `${variable}`

```javascript
const toto = 'toto'
const message = `hello from ${toto}!` // hello from toto!
```

### Short-circuits conditionals

If you have to execute a function just if a condition is true, like 👇

```javascript
if(condition){
    toto()
}
```

You can use a **short-circuit** just like 👇

```javascript
condition && toto()
```

Thanks to the `&&` (AND) operator, if the condition is true, it will execute *toto* function

### Set default value for variable

If you need to set a default value to a variable

```javascript
let toto

console.log(toto) //undefined

toto = toto ?? 'default value'

console.log(toto) //default value

toto = toto ?? 'new value'

console.log(toto) //default value
```

Thanks to the `??` (Nullish coalescing) operator, if the first value is undefined or null, it will assign the default value after the (`??`)!

### Use console timer

If you need to know the execution time of a function for example you can **console timer**. It will give you back the time before and after the execution of your function very fastly!

```javascript
console.time()
for (i = 0; i < 100000; i++) {
  // some code
}
console.timeEnd() // x ms
```

---

I hope you like this reading!

🎁 You can get my new book `Underrated skills in javascript, make the difference` for FREE if you follow me on [Twitter](https://twitter.com/code__oz) and MP me 😁

Or get it [HERE](https://codeoz.gumroad.com/l/RXLYp)

🇫🇷🥖 For french developper you can check my [YoutubeChannel](https://www.youtube.com/channel/UCC675U1ZUPFASsK9-FjawtA)

🎁 [MY NEWSLETTER](https://www.getrevue.co/profile/code__oz)

☕️ You can [SUPPORT MY WORKS](https://www.buymeacoffee.com/CodeoZ) 🙏

🏃‍♂️ You can follow me on 👇

🕊 Twitter : [https://twitter.com/code__oz](https://twitter.com/code__oz)

👨‍💻 Github: https://github.com/Code-Oz

And you can mark 🔖 this article!