Scribd
Upload
16 views3 pages

Js Question

Uploaded by

Preston Osoro
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
16 views3 pages

Js Question

Uploaded by

Preston Osoro
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

Programming Concepts and Techniques: Event Delegation, Pass by Value and Reference,

NgRx, Bug Fixing, and Array Flattening

TEST 1: Event Delegation and Vanilla JS Example


Event delegation is a technique in web development where a single event listener is attached to a
parent element to handle events for all its child elements. This approach is useful because it
reduces the number of event listeners needed, making the code more efficient and easier to
maintain.

Here is an example of event delegation using vanilla JavaScript:

<ul id="list">
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
<li>Item 5</li>
</ul>

const list = document.getElementById('list');


list.addEventListener('click', function(event) {
if (event.target.tagName === 'LI') {
console.log('You clicked on:', event.target.textContent);
}
});

In this example, a single event listener is attached to the

element. When any child


element is clicked, the event listener is triggered, and it checks if the target of the event is a
element. If it is, it logs the text content of the clicked
element to the console.

TEST 2: Pass by Value and Pass by Reference in JS


In JavaScript, there are two ways to pass variables to functions: pass by value and pass by
reference.

Pass by Value
Pass by value means that a copy of the variable is passed to the function. The function can
modify the copy, but the original variable remains unchanged.

function modifyValue(x) {
x = 10;
}

let originalValue = 5;
modifyValue(originalValue);
console.log(originalValue); // Output: 5

Pass by Reference
Pass by reference means that the function receives a reference to the original variable. The
function can modify the original variable directly.
function modifyReference(arr) {
arr[0] = 10;
}

let originalArray = [5, 2, 3];


modifyReference(originalArray);
console.log(originalArray); // Output: [10, 2, 3]

TEST 3: Core Components of NgRx


NgRx is a state management library for Angular applications. The core components of NgRx
are:

Store: The Store is the central hub for managing application state. It holds the application
state and provides methods for updating and retrieving the state.

Actions: Actions are objects that describe an event that has occurred in the application. They
are used to update the state of the application.

Reducers: Reducers are pure functions that take the current state and an action as
arguments and return a new state.

Effects: Effects are functions that handle side effects such as network requests or local
storage. They are used to update the state of the application.

Selectors: Selectors are pure functions that select a part of the state. They are used to
retrieve specific parts of the state.

TEST 4: Bug in IIFE and setTimeout Implementation


The bug in the given code is that the setTimeout function is called multiple times with the
same value of i, which is the last value of the loop. This is because the setTimeout function
is called after the loop has finished, so i has already been incremented to 5.

To fix this, you can use a closure to capture the current value of i at each iteration:

for (var i = 0; i < 5; i++) {


(function(index) {
setTimeout(function() {
console.log("Index:", index);
}, Math.random() * 1000);
})(i);
}

TEST 5: Function to Flatten a Multi-Dimensional Array


Here is a function that takes a multi-dimensional array of unknown depth and returns a
single-dimensional array:

function flattenArray(arr) {
let result = [];
for (let i = 0; i < arr.length; i++) {
if (Array.isArray(arr[i])) {
result = result.concat(flattenArray(arr[i]));
} else {
result.push(arr[i]);
}
}
return result;
}

// Example Usage
const multiDimensionalArray = [
[1, 2, 3],
[4, 5, [6, 7], 8],
[9, 10, [11, 12]],
[13, 14, [15, 16]],
];

console.log(flattenArray(multiDimensionalArray));
// Output: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16]

This function works by iterating over each element in the array. If the element is an array
itself, it recursively calls itself with that element and concatenates the result to the main
result array. If the element is not an array, it simply adds it to the result array.

Here's my github profile: Preston

You might also like