Wrtitting clean code facilitates working and making changes for you and others, improves readability and also makes the code reusable.
Good comments provides clear insights about the code and it's a great way of code documentation.
Bad Comments, on the other hand, are not meaningful, confuses other programmers and don't provide the expected informatiom about the code.
An array is a special variable, which can hold more than one value and can be defined as a list of values.
Arrays are uselful to store large quantities of single values like names, numbers or items.
arrayName[indexOfElement]
arrayName[indexOfElement] = "New Value";
arrayName.length, arrayName[index]
arrayName.push("newElement"), arrayName.sort(), arrayName.slice()
Loops are useful for iterating over elements to display of transform the information.
The break statement is used to exit a loop.
The continue statement will skpi to the next iteration of the loop.
The DOM, or Document Object Model, is the structure generated by the browser of an HTML Page.
document.querySelector, document.getElementsByClassName, document.getElementById
let newElement = document.createElement("div")
body.appendChild(newElement)
element.remove()
element.innerHTML or element.textContent
Depends on the case, but if the text is written by the user textContent should be used for safety.
The script tag should be included in the head of the page with the async attribute.
Listeners are methods that wait for Events, that are expected actions from the user or browser, to render the code inside the eventListener.
Events can be used inline on HTML elements, with addEventListener or within functions.
They provide a more complete way to dealing with events and because it contains the property event that allows the developer to get information about the node where the event occoured
Named Functions provides a more organized way to repeat actions on several event listeners and you can remove the event listener.
Use nodeGroup.forEach(node){node.addEventListener('click', function(){ //DO SOMETHING})
The querySelector returns a single HTML element, while the querySelectorAll returns a node list of all elements with a determined class.
Bubbling is the process of propagation from the closest element to the farthest away element, while "capture" is the process of propagation from the farthest away element to the closest.
Objects are unordered collections of key-value pairs, while arrays are variables that can hold more than one value.
object.prop