This content originally appeared on DEV Community and was authored by Abdulsamod
It's day 15 of the 100 days of Miva coding challenge which has flown by very quickly but has helped me improve massively in my HTML, CSS and JavaScript skills.
Today, I learned two concepts in JavaScript. Displaying object properties and JavaScript Events. They are very important in adding data and also keeping webpages responsive and interactive.
Displaying Object Properties
As i discussed previously, objects are used to create data blocks containing data of different data types related to each other or a particular subject; written in a key-value pair format.
Displaying these properties have different methods in which it can be achieved. Firstly, they can be displayed as strings where the properties are concantenated using the addition operator.
They can be displayed as a loop selecting each key and value pair until the object is exhausted.
They can also be displayed in an array format using the Object.values() method.
Finally, they can be displayed using the JSON.stringify() method which displays them using the JSON notation.
JavaScript Events
Events are actions that occur on a webpage due to the browser or user action or input. Actions such as a button clicked, a webpage loading, page sizing and so on are known as Events. JavaScript code can be used to cause certain reactions when these actions happen.
For example, on the click of a button, JavaScript code can be used to display the time and date in real time as compared to static display with HTML and CSS.
JavaScript code can also be used to change the content of a particular element when an action takes place on it.
Functions can also be called and executed in case of an event.
The concept of JavaScript Events is crucial to making webpages responsive and interactive as they can be used to induce real time reactions to actions on the webpages.
Day 15 was hugely productive and educative and I plan on exploring more on JavaScript Events tomorrow!😊
Source codes available here:
Object display: (https://github.com/Abdul-Samod/100daysofMiva/blob/74ad5573744c15d1955e8f8777053f0492d41fe9/javascript_prac2.html)
JavaScript Events: (https://github.com/Abdul-Samod/100daysofMiva/blob/74ad5573744c15d1955e8f8777053f0492d41fe9/javascript_prac3.html)
This content originally appeared on DEV Community and was authored by Abdulsamod
Abdulsamod | Sciencx (2024-09-03T21:24:07+00:00) 100 days of Miva: Day 15. Retrieved from https://www.scien.cx/2024/09/03/100-days-of-miva-day-15/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.