parent
041facdc61
commit
1b639c433c
6 changed files with 119 additions and 0 deletions
@ -0,0 +1,18 @@ |
|||||||
|
A closure is a function that has access to its outer function scope even after the outer function has returned. This means a closure can remember and access variables and arguments of its outer function even after the function has finished. |
||||||
|
|
||||||
|
```js |
||||||
|
function outer() { |
||||||
|
const name = 'Roadmap'; |
||||||
|
|
||||||
|
function inner() { |
||||||
|
console.log(name); |
||||||
|
} |
||||||
|
|
||||||
|
return inner; |
||||||
|
} |
||||||
|
|
||||||
|
const closure = outer(); |
||||||
|
closure(); // Roadmap |
||||||
|
``` |
||||||
|
|
||||||
|
In the above example, the `inner` function has access to the `name` variable of the `outer` function even after the `outer` function has returned. Therefore, the `inner` function forms a closure. |
@ -0,0 +1,33 @@ |
|||||||
|
You can use the `CustomEvent` constructor to create a custom event. The `CustomEvent` constructor accepts two arguments: the event name and an optional object that specifies the event options. And you can use the `dispatchEvent` method to dispatch the custom event on the target element/document. |
||||||
|
|
||||||
|
## Creating Custom Events |
||||||
|
|
||||||
|
```js |
||||||
|
const event = new CustomEvent('roadmap-updated', { |
||||||
|
detail: { name: 'JavaScript' }, |
||||||
|
}); |
||||||
|
element.dispatchEvent(event); |
||||||
|
``` |
||||||
|
|
||||||
|
## Listening for Custom Events |
||||||
|
|
||||||
|
You can listen for custom events using the `addEventListener` method. The `addEventListener` method accepts the event name and a callback function that is called when the event is dispatched. |
||||||
|
|
||||||
|
```js |
||||||
|
element.addEventListener('roadmap-updated', (event) => { |
||||||
|
console.log(event.detail); // { name: 'JavaScript' } |
||||||
|
}); |
||||||
|
``` |
||||||
|
|
||||||
|
## Removing Event Listeners |
||||||
|
|
||||||
|
You can remove event listeners using the `removeEventListener` method. The `removeEventListener` method accepts the event name and the callback function that was used to add the event listener. |
||||||
|
|
||||||
|
```js |
||||||
|
function handleEvent(event) { |
||||||
|
console.log(event.detail); // { name: 'JavaScript' } |
||||||
|
} |
||||||
|
|
||||||
|
element.addEventListener('roadmap-updated', handleEvent); |
||||||
|
element.removeEventListener('roadmap-updated', handleEvent); |
||||||
|
``` |
@ -0,0 +1,12 @@ |
|||||||
|
You can use the `filter()` method to filter an array based on a condition. The `filter()` method creates a new array with all elements that pass the test implemented by the provided function. |
||||||
|
|
||||||
|
```js |
||||||
|
const numbers = [1, 2, 3, 4, 5, 6]; |
||||||
|
|
||||||
|
const evenNumbers = numbers.filter((number) => { |
||||||
|
return number % 2 === 0; |
||||||
|
}); |
||||||
|
|
||||||
|
console.log(numbers); // [1, 2, 3, 4, 5, 6] |
||||||
|
console.log(evenNumbers); // [2, 4, 6] |
||||||
|
``` |
@ -0,0 +1,9 @@ |
|||||||
|
No, the `forEach()` method does not return a new array. It simply calls a provided function on each element in the array. |
||||||
|
|
||||||
|
```js |
||||||
|
const roadmaps = ['JavaScript', 'React', 'Node.js']; |
||||||
|
|
||||||
|
roadmaps.forEach((roadmap) => { |
||||||
|
console.log(roadmap); |
||||||
|
}); |
||||||
|
``` |
@ -0,0 +1,12 @@ |
|||||||
|
No, the `map()` method does not mutate the original array. It returns a new array with the results of calling a provided function on every element in the calling array. |
||||||
|
|
||||||
|
```js |
||||||
|
const roadmaps = ['JavaScript', 'React', 'Node.js']; |
||||||
|
|
||||||
|
const renamedRoadmaps = roadmaps.map((roadmap) => { |
||||||
|
return `${roadmap} Roadmap`; |
||||||
|
}); |
||||||
|
|
||||||
|
console.log(roadmaps); // ['JavaScript', 'React', 'Node.js'] |
||||||
|
console.log(renamedRoadmaps); // ['JavaScript Roadmap', 'React Roadmap', 'Node.js Roadmap'] |
||||||
|
``` |
Loading…
Reference in new issue