ReasonJun

set In JavaScript, a Set is a built-in data structure that allows you to store unique values of any type. It provides a way to store a collection of values without any duplicates. The values in a Set can be of any type, including primitives like numbers and strings, as well as objects and other sets. const mySet = new Set(); // creating a new Set const mySet = new Set([1, 2, 3, 3, 4, 5, 5]); // ..

mouse pointer event // Mouse & Pointer Events // click // dbclick : double click // mousedown : press the button // mouseup : release the button // mouseenter : When the pointer goes over an element // mouseleave : when the pointer goes out of the element // mousemove : when the pointer moves // contextmenu : when right-clicked // wheel :When the wheel button rotates const parentEl = document.qu..

handler once / passive // Handler run only once const parentEl = document.querySelector('.parent'); parentEl.addEventListener( 'click', (event) => { console.log('parent'); }, { once: true, } ); // Separation of default behavior and handler execution // The execution itself may be slow because there are many actions on the webpage, but the user's manipulation of the webpage proceeds smoothly. par..

event obj // The event object contains event information that has occurred in the target. const parentEl = document.querySelector('.parent'); parentEl.addEventListener('click', (event) => { console.log(event.target, event.currentTarget); // The target of the (selected) event, the target where the event is registered console.log(event); // You can get information about an event that has occurred...

delegation // event delegation // If you need to handle events on multiple elements in a similar pattern, // You can use the event delegation pattern, controlled by a single ancestor element. const parentEl = document.querySelector('.parent'); const childEls = document.querySelectorAll('.child'); // Event registration for all targets! childEls.forEach((el) => { el.addEventListener('click', (even..

add / remove //? .addEventListener() // Registers to listen for events on the target. // When an event specified in the target occurs, the specified function is called. const parentEl = document.querySelector('.parent'); const childEl = document.querySelector('.child'); parentEl.addEventListener('cilck', () => { console.log('Parent'); }); childEl.addEventListener('cilck', () => { console.log('Ch..

toReserved / toSorted / toSpliced (copy, no mutate) const x = [1, 2, 3]; const y = x.toReversed(); y.push(0) const arr = [1,3,2]; const sorted = arr.toSorted(); console.log(arr); // [1, 3, 2] console.log(sorted); // [1, 2, 3] const a = [ "a", "b", "c", "d"] const newArray = a.toSpliced(1,2) // ['a', 'b'] with const x = ["a", "b", "c", "x"] x[3] = "d" console.log(x) // ["a", "b", "c", "d"] const ..

In JavaScript, there are several array methods that do not mutate the original array. Instead of modifying the array in place, they return a new array with the desired modifications. Here are some commonly used array methods that have non-mutating behavior: concat: The concat() method is used to merge two or more arrays and returns a new array without modifying the existing arrays. const array1 ..

In JavaScript, there are several array methods that can mutate the original array, meaning they modify the array directly instead of creating a new array. These methods allow you to add, remove, or modify elements within an array. Here are some commonly used array methods that have mutating behavior: 1. push: The push() method adds one or more elements to the end of an array and returns the new ..

In JavaScript, the Timer API provides functions and methods to schedule and manage timers. Timers allow you to execute code at specified intervals or after a certain delay. The Timer API consists of two main functions: setTimeout and setInterval, along with their corresponding methods to clear or cancel the timers: clearTimeout and clearInterval. Here's an overview of the Timer API in JavaScript..