Understanding JavaScript Built-in Functions and Events day-2

🌟 What Are Built-in Functions in JavaScript?

Built-in functions are predefined functions provided by the JavaScript language itself. You don’t have to write these from scratch — they’re available right out of the box.

✨ Common Built-in Functions

Here are some you’ll use all the time:

✅ alert()
Displays a popup message to the user.

alert("Hello, world!");

✅ prompt()
Asks the user to input something.

let name = prompt("What’s your name?");

✅ parseInt() and parseFloat()
Convert strings to numbers.

let num = parseInt("42");
let price = parseFloat("99.99");

✅ isNaN()
Checks if a value is Not a Number.

isNaN("hello"); // true
isNaN(123);     // false

✅ Math functions
Provides mathematical operations.

Math.round(4.7); // 5
Math.random(); // random number between 0 and 1
Math.max(3, 9, 1); // 9

✅ Date object functions
Work with dates and times.

let now = new Date();
now.getFullYear(); // e.g., 2025

These are just a few — JavaScript offers many built-in functions, which help reduce the amount of code you need to write.

🖱️ What Are Events in JavaScript?

An event is something that happens in the browser — like a button click, a key press, or when a page finishes loading. JavaScript can listen for these events and then run some code in response.

✨ Common Events

✅ Click events

document.getElementById("myBtn").addEventListener("click", function() {
  alert("Button was clicked!");
});

✅ Mouse events (mouseover, mouseout)

document.getElementById("myDiv").addEventListener("mouseover", function() {
  console.log("Mouse is over the div!");
});

✅ Keyboard events (keydown, keyup)

document.addEventListener("keydown", function(event) {
  console.log("Key pressed: " + event.key);
});

✅ Form events (submit, change)

document.getElementById("myForm").addEventListener("submit", function(event) {
  event.preventDefault();  // stop form from submitting
  console.log("Form submitted!");
});

✅ Window events (load, resize)

window.addEventListener("load", function() {
  console.log("Page fully loaded!");
});

🛠️ How Do Built-in Functions and Events Work Together?

You often combine these concepts — for example, you can use a click event to trigger an alert:

document.getElementById("greetBtn").addEventListener("click", function() {
  alert("Welcome to my website!");
});

Here, the built-in function alert() is called when the click event happens on the button.

💡 Why Should You Learn These?

• Save time: No need to reinvent the wheel.
• Write cleaner code: Use tested, reliable functions.
• Create interactive pages: Events let you respond to users’ actions.