Data Structure in JavaScript
Tags: webdev, javascript, programming, tutorial
Published: 2023-02-11 18:21:02

###The focus will be on using the Object, Array, Map, and Set data structures in JavaScript.


##Working with arrays in JavaScript
In JavaScript, there are a few different ways to declare and initialize array
1.Array Literal:
```javascript
const numbers = [1, 2, 3, 4, 5];
const fruits = ['apple', 'banana', 'orange'];
```
2.Array Constructor:
You can also use the Array constructor to create an array. You can pass in elements as arguments to the constructor or specify the array length.
```javascript
const numbers = new Array(1, 2, 3, 4, 5);
const fruits = new Array('apple', 'banana', 'orange');

```
3.Using Array.from():
The Array.from() method creates a new array from an array-like or iterable object. You can also pass a mapping function to transform elements.
```javascript
const numbers = Array.from([1, 2, 3, 4, 5]);
const doubled = Array.from(numbers, num => num * 2);

```
4.Using fill():
The fill() method sets all elements in an array to a static value. You can then create an array of a specific length and fill it with the desired value.
```javascript
const zeros = new Array(5).fill(0);  // Creates [0, 0, 0, 0, 0]

```
Some array methods are:

- forEach
- map
- filter

1. The `forEach()` method

```javascript
const fruits = ['kiwi','mango','apple','pear'];
function appendIndex(fruit, index) {
    console.log(`${index}. ${fruit}`)
}
fruits.forEach(appendIndex);
});

output :
0. kiwi
1. mango
2. apple
3. pear
```
The forEach() method accepts a function that will operate on each element of the array. The first parameter of that method is the actual current array item, and the second is an optional parameter called the index.

2.The `map()` method
This method is used to map each array item over to another array's item, based on whatever work is performed inside the function that is passed-in to the map as a parameter(similar to forEach).

```javascript
const arr=[1,2,3,4,5];

function double(x)
{
  return x*2;  
}
const output=arr.map(double);
console.log(arr);//[1,2,3,4,5]
console.log(output);//[2,4,6,8,10]
```
_**Ps: forEach() is suitable for modifying an array in place, while map() is useful when you want to create a new array with transformed values without altering the original array.**_

3.The `filter()` method 
The filter() method on the array is yet another extremely helpful approach. Your arrays are filtered using a particular test. Returned are the array elements that pass the test.
```javaScript
const arr=[1,2,3,4,5]

function isOdd(x)
{
   return x%2; 
}
const output=arr.filter(isOdd);

console.log(arr);//[1,2,3,4,5]
console.log(output);//[1,3,5]
```
You can read more about `map()`,`filter()`,`reduce()` array method in my blog, where I have explained it with examples :[Blog](https://dev.to/srishtikprasad/mapfilterreduce-with-important-interview-questions-1ae5)

##Working with Objects in JavaScript
There are three methods which we can apply on object
`Object.keys()`,`Object.values()`,`Object.entries()`
```javaScript
let user = {
  name: "John",
  age: 30
};

Object.keys(user) = ["name", "age"]
Object.values(user) = ["John", 30]
Object.entries(user) = [ ["name", "John"], ["age",30] ]

```
Also, we can iterate over object using `Object.keys()`,example:-
 
```javascript
const result = [];
const drone = {
    speed: 100,
    color: 'yellow'
}
const droneKeys = Object.keys(drone);
droneKeys.forEach( function(key) {
    result.push(key, drone[key])
})
console.log(result)
```
##Working with Maps data structure  in JavaScript
To make a new Map, you can use the Map constructor:
`new Map();`
A map can resemble a JS object quite closely.
It does not, however, have inheritance. No models! As a result, it serves as an effective data storage.
For example,

```javascript
let bestBoxers = new Map();
bestBoxers.set(1, "The Champion");
bestBoxers.set(2, "The Runner-up");
bestBoxers.set(3, "The third place");

console.log(bestBoxers);
```
Output:
`Map(3) {1 => 'The Champion', 2 => 'The Runner-up', 3 => 'The third place'}`
To get a specific value, you need to use the get() method. For example:  

```javascript
bestBoxers.get(1); // 'The Champion'
```

##Working with Sets in JavaScript
A set is a collection of unique values.
To build a new set, we can use the Set constructor:
`new Set();`

It can therefore be used to efficiently filter an array for unique members.

```javascript
const repetitiveFruits = ['apple','pear','apple','pear','plum', 'apple'];
const uniqueFruits = new Set(repetitiveFruits);
console.log(uniqueFruits);
```
output:-
`{'apple', 'pear', 'plum'}`

###Other data structures in JavaScript
These data structures come built-in natively in some other programming languages  or even those other programming languages don't support them natively.
Some more advanced data structures that have not been covered you can read about here -->[Other Data Structure](https://data-flair.training/blogs/javascript-data-structures/)

If you have any query let me know in the comment section. I'll try my best to answer them.
If you find this blog helpful, please ❤️ like it.
You can follow me if you wish to learn such amazing stuffs.
In the coming blogs I'll be covering all fundamental concepts of JavaScript.