# Do you know these JS Hacks | Tricks


While developing application I feel that these are some hacks which we can add in our code to make it little smart with less number of…
* * *
### Do you know these JS Hacks | Tricks

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1720629577391/97d5d572-39a6-4180-a29e-b718d3583f0b.png)

[ES6 & ES7 Tips and Tricks || Hacks in Javascript  
_Hack with Javascript Array_medium.com](https://medium.com/tkssharma/es6-es7-tips-and-tricks-hacks-in-javascript-d7dc03cd1b71 "https://medium.com/tkssharma/es6-es7-tips-and-tricks-hacks-in-javascript-d7dc03cd1b71")[](https://medium.com/tkssharma/es6-es7-tips-and-tricks-hacks-in-javascript-d7dc03cd1b71)

[Immutability in Javascript | Array and Objects  
_In object-oriented and functional programming, an immutable object (unchangeable object) is an object whose state…_medium.com](https://medium.com/tkssharma/immutability-in-javascript-array-and-objects-a593e3479e8e "https://medium.com/tkssharma/immutability-in-javascript-array-and-objects-a593e3479e8e")[](https://medium.com/tkssharma/immutability-in-javascript-array-and-objects-a593e3479e8e)

While developing application I feel that these are some hacks which we can add in our code to make it little smart with less number of lines — some of these you might be using already

*   Use Promise Object. finally ()

When you use the `somePromise.then(x).catch(y).finally(z)` pattern, your business logic is generally happening in the `then` callback (`x`, above - what you want to do once `somePromise` has resolved) or in the `catch` callback (`y` above - returns what you want to pass along in case something goes horribly wrong). You might never have even used `finally` in your code - and that's fine.

According to the [MDN docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/finally#Description), a `finally` callback allows you to execute logic once your Promise has been settled - resolved or rejected - one way or the other.

```javascript
p.finally(onFinally);  
  
p.finally(function() {  
  // settled (fulfilled or rejected)  
   // reset loading state   
   // reset object or application state   
});
```
* Using Destructuring with Array.prototype Methods()

```javascript
const arr = [{ name : 'tks'}, {name : 'kumar'}]  
  
arr.map( ({name}, index) => {  
console.log(name, index);  
return name;  
})
const arr = [{ name : 'tks'}, {name : 'kumar'}]  
arr.filter( ({name}, index) => {  
   return true;    
})
```

* Removing a Property from Object using … operator

```javascript
const obj = {a :10, b:40, c:70}  
const {a,...finalObj} = obj;  
```

*   Deep Copy of Object (can we write Code for this ? )

```javascript
const obj = {a :10, b:40, c:70}  
```

object.assign -- Shallow Copy (not capable for deep copy of nested properties)  
JSON.parse and stringify just a workaround to create deep copy   
The spread syntax and `Object.assign()` allow us to make only   
shallow copies of objects in JavaScript. Deeply nested values are // in fact put there just as a reference to the source object.
return Promise.resolve and Promise.reject instead of creating new Promise(cbk)

```javascript
function getData(){  
return new Promise((resolve,reject) => {   
 return axios.get('').then(data => {  
      resolve(null)})  
 }) // else reject   
}
function getData(){  
return axios.get().then(data => Promise.resolve(data))  
}// else reject   
// Both functions are returning promise Object 
```
*   Become fully obsessed with destructuring {}

```javascript
function getAvengers() {  
  return ['Ironman', 'Captain America', 'Thor', 'Hulk']  
}  
const [ a, , , b ] = getAvengers();  
// Notice that I created two commas in the middle. This means that I'm skipping both Captain America and Thor  
console.log(a); // 'Ironman'  
console.log(b); // 'Hulk'

function CategoryBanner({ category }) {}  
function CategoryBanner({ data, id, ...rest }) {}
```
*   update object property using {…} better option then Object.assign

```javascript
const obj = {x :80};  
const anotherObj = {c :80}  
const newObj  = {...obj, x:700, y:600, ...anotherObj}  
// works same as Object.assign // sort and simple   
const veryNewObj = {  
...newObj,  
X:90  
}
```

*   Destructuring with spread operator, get what you need rest put in …rest

```javascript
function CategoryBanner({ data, id, ...rest }) {  
   console.log(data,id,rest)  
// rest will be {x:80, y :70}  
}
const newobj = {data : [], id :80, x:80, y:70}  
CategoryBanner(newobj)
```
*   Using length to delete/ empty in an array

```javascript
const array = [1,,3,4,56,7,8];  
array.length =  2;  
// Now array will have only two values rest all will be vanished .. 
```

*   values using || operator to get rid of null value errors

```javascript
const data = somemethod(data) || [];  
const env = process.env.NODE_ENV || 'DEV'
```

*   Strict null checks

```javascript
if(!data || !Array.isArray(data.list) || data.list.length === 0){  
   console.log('array is null or data is null')  
}

const data = {x :80}

if(data &&  data.x) {console.log('yes i do have value x in data')}
```