TO each || !TO each
Tags: javascript, beginners, intro, todayilearned
Published: 2018-10-22 02:28:21

---
title: TO each || !TO each
published: true
description: Intro to UnderScoreJS
tags: #javascript, #beginner, #intro, #til
cover_image: https://fee.org/media/24298/shakespeare_skull_mini.jpg?center=0.381294964028777,0.60333333333333339&mode=crop&height=190&widthratio=1.8631578947368421052631578947&rnd=131497055280000000
---

Hello there, if I've sucked you in with my catchy title it's for a good reason! I want to tell you about Underscore. Underscore is a library full of useful functional programming helpers. I will go through `.forEach` as an example. If you have not heard of Underscore, I would like to introduce it to you right now!

"Underscore helps you write code that clearly expresses your intention"


##How do you mean?
Lets take our example of `arr.forEach`, which executes a provided function once `.forEach` array element. 

*forEach Example*
```javascript
const arr = [1,2,3];
arr.forEach(e => console.log(e));
//1, 2, 3
```

Wouldn't it be awesome if we could write it just like we said it? Let's take a look at the `_.each` example below. For each element in the array execute logger function.

```javascript
//_.each(element, index, list)
const arr = [1,2,3];

function logger(ele){
  console.log(ele)
}
_.each(arr,logger)
//1,2,3 [1,2,3]
```

##What about objects?
Great question! Well in the example below (spoiler alert), Underscore handles objects the same way it would an array. WOAH! 

```javascript
//.each(element, index, list)

const objList = { pie1: 'Apple', pie2: 'Blueberry', pie3: 'Peach'}

function logger(ele){
  console.log(ele)
}
_.each(objList, logger)
//Apple, Blueberry, Peach { pie1: 'Apple', pie2: 'Blueberry', pie3: 'Peach'}

```
##How Sway?
Let's dive into how this is even possible. Normally we would have to use a for loop and get the value of each key in the object(see below). 

```javascript
const objList = { pie1: 'Apple', pie2: 'Blueberry', pie3: 'Peach'}

for(let key in objList){
  console.log(objList[key]);
}
//Apple, Blueberry, Peach
```

So... when we pop the hood and take a look at the engine, we find nothing more than, an if statement that checks to see if what you're passing in is an Array or Object. Followed by the appropriate for loop and a `callback`. See the example below. The _ object works exactly like $ object in jQuery.

```javascript
const _ = {  
  each(list, callback){
    if(Array.isArray(list)){
      for(let i = 0; i < list.length; i++){
        callback(list[i], i, list);
      }
    } else {
      for(let key in list){
        callback(list[key], key, list)
      }
    }
  }
```

#Conclusion
This is a very small part of a very vast/helpful library. In fact it's all still really new to me, as i'm not an expert JS developer. I love to write code, I love to learn new libraries, but more importantly understand whats going on underneath it all. I hope my attempt to introduce you to underscore has helped, even if its just one person. Also, you can test underscore from google chrome dev tools by, opening chrome dev tools from the [Underscore.JS](https://underscorejs.org) website.

Drop a comment let me know what you think about underscore.
*also let me know if you find corrections Thanks*