# Geored - JS Tests
## Interviewer:
- **Prepare meeting:** Schedule a date/call with developer
- **Prepare test:** Register an account in https://hackmd.io/
- **Prepare test:** Create a new markdown file in hackmd using this markdown as template
- **Prepare test:** Remove answers, score and this section.
- **Prepare test:** Click on share and set rights to Everyone/Everyone or give access to developer email (Recommended).
- **Meeting:** Share the online document.
- **Meeting:** (Optional) Briefly explain the test and how it works.
- **Meeting:** Ask developer to submit the test by email (no time limit)
- **Meeting:** (Optional) Stay in the meeting for one hour and help developer with some/any technical questions be keeping the challenge.
- **Review:** After one hour, copy the source code into a new file (To keep a snapshoot of results after one hour)
- **Review:** After final results are received, create a new file (To keep a snapshoot of final results) from the original test or from the document sent by developer.
- **Review:** Review both the results from 1 hour and the final results.
- **Review:** A good score should be at least 50/100 in 1 hour.
- **Review:** A final result above 80/100 is also good.
- **Review:** A bunch of reference links is positive
- **Review:** Empty answers are negative
- **Review:** Comments are positive
- **Review:** Multiple responses, even if wrong, are positive.
## How it works?
Below you will find a serie of taks per subject that you will need to resolve in each Response section (Edit markdown).
## Subject: Promises / Async/Wait
### Promise Delayed Resolve (Score: 10)
**Task:** Create a JavaScript function called delayedResolve that returns a promise. The promise should resolve with the string 'Task completed' after a delay of 5 seconds.
**Example:**
```js
delayedResolve().then(console.log) //After 5 seconds: 'Task completed'
```
**Response:**
```js
//Write here
```
### Concurrent JSON Fetch (Score: 10)
**Task:** Given an array of URLs that return JSON, create a JavaScript function called fetchAll that fetch data from all the URLs concurrently. The function should return a promise that resolves with an array of the response data from each URL in the same order as the input URLs.
**Example:**
```js
const responses = fetchAll(['https://jsonplaceholder.typicode.com/todos/1',
'https://jsonplaceholder.typicode.com/todos/2'])
console.log(responses) //[{id:1},{id:2}]
```
**Response:**
```js
//Write here
```
### Sequential Fetch with Callbacks (Score: 15)
**Task:** Write a JavaScript function 'fetchSequentially' to fetch from an array of URLs sequentially using async/await. The function should also accept a callback function as parameter that is called each time a fetch request is resolved. The function should resolve with an array containing all responses.
**Example:**
```js
function callbackHandler(response, index){
console.log(`Res ${index}: `, response)
}
fetchSquentially(['https://jsonplaceholder.typicode.com/todos/1',
'https://jsonplaceholder.typicode.com/todos/2'], callbackHandler)
.then(responses => {
console.log({responses})
})
//Output:
//Res: {id:1}
//Res: {id:2}
//[{id:1},{id:2}]
```
**Response:**
```js
//Write here
```
## Subject: Scope/Enclousure
### Persistent Counter (Score: 10)
**Example:**
```js
const counter = createCounter();
console.log(counter()); // Output: 1
console.log(counter()); // Output: 2
console.log(counter()); // Output: 3
```
**Response:**
```js
//Write here
```
### Encapsulated Name Manipulation with Closure (Score: 15)
**Task:** Create a function called createPerson that takes a name parameter and returns an object with two methods: getName and setName. The getName method should return the person's name, and the setName method should set the person's name. However, the name variable should be private and inaccessible from outside the createPerson function.
**Example:**
const person = createPerson('John Doe');
console.log(person.getName()); // Output: John Doe
person.setName('Jane Doe');
console.log(person.getName()); // Output: Jane Doe
**Response:**
```js
//Write here
```
## Subject: Design Patterns
**Task:** Name the most commonly used design pattern for a full JS app (Vue/React/Angular): Singleton, Factory, Observer, Decorator, and Module. **(Score: 5)**
**Response:**
```txt
//Write here
```
## Subject: Auth
Task: Name three possible ways of storing a JWT (JSON Web Token) in the client-side.
**(Score: 5)**
**Response:**
```txt
//Write here
```
## Subject: Vue State
Task: Name 4 different ways of sharing state between components.
**(Score: 10)**
**Response:**
```txt
//Write here
```
## Subject: Client-side cache
### SessionStorage Memoization for Expensive Function Calls (Score: 20)
**Task:** Implement a memoization function with sessionStorage caching
**Description:** Create a memoization function that caches the results of expensive function calls in the sessionStorage and returns the cached result when the same inputs are provided again.
**Requirements:**
The memoization function should cache the results in the sessionStorage so that the cached data persists across page reloads.
The function should store the cached results using a unique key based on the provided function and the input parameters.
If the same function is called with the same input parameters, the memoization function should return the cached result from sessionStorage instead of recomputing it.
**Example:**
```js
const sum = (arr) => {
console.log('Performing expensive computation...');
return arr.reduce((total, num) => total + num, 0);
};
const memoizedSum = memoizeWithSessionStorage(sum);
const array1 = [1, 2, 3, 4, 5];
const result1 = memoizedSum(array1); // Perform computation and cache the result in sessionStorage
console.log(result1); // Output: Performing expensive computation... 15
const result2 = memoizedSum(array1); // Return cached result from sessionStorage without computation
console.log(result2); // Output: 15
const array2 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const result3 = memoizedSum(array2); // Perform computation for a different input and cache the result
console.log(result3); // Output: Performing expensive computation... 55
const result4 = memoizedSum(array2); // Return cached result from sessionStorage without computation
console.log(result4); // Output: 55
```
**Note:** The memoizeWithSessionStorage function is responsible for implementing the memoization with sessionStorage caching. The sum function is an example of an expensive computation, and the memoized version ensures that the computation is performed only once for the same input and retrieves the cached result from sessionStorage on subsequent calls.
**Response:**
```js
//Write here
```
**Answer:**
```js
function memoizeWithSessionStorage(expensiveFunction) {
return function (...args) {
const cacheKey = getCacheKey(expensiveFunction, args);
// Check if the result is already cached in sessionStorage
if (sessionStorage.getItem(cacheKey)) {
return JSON.parse(sessionStorage.getItem(cacheKey));
}
// Call the expensive function and store the result in sessionStorage
const result = expensiveFunction.apply(null, args);
sessionStorage.setItem(cacheKey, JSON.stringify(result));
return result;
};
}
function getCacheKey(func, args) {
const serializedArgs = JSON.stringify(args);
return `${func.name}_${serializedArgs}`;
}
```
## References
Paste here any link that help you to complete the test (if any)