1. Function అంటే ఏమిటి?
Function అనేది ఒక logic లేదా code block, మనం repeatedly ఉపయోగించడానికి రాసుకునే దానిని function అంటారు.
ఇది basically:
- Code repetition తగ్గిస్తుంది
- Reusability పెరుగుతుంది
- Clean & maintainable code
✅ 2. Function ని ఎలా తయారుచేయాలి? (Function Declaration)
JavaScript
function greetUser() {
console.log("Hello, welcome to JavaScript!");
}
👉 ఇది ఒక simple function. ఇది ఎప్పుడు call చేస్తే, "Hello, welcome to JavaScript!" అనే message console లో కనిపిస్తుంది.
Call చేయడం:
JavaScript
greetUser(); // Output: Hello, welcome to JavaScript!
✅ 3. Parameters మరియు Arguments in Functions
Function కి input values ఇచ్చే వాటిని parameters/arguments అంటారు.
JavaScript
function greetUser(name) {
console.log("Hello, " + name + "!");
}
greetUser("Ravi"); // Output: Hello, Ravi!
greetUser("Anu"); // Output: Hello, Anu!✅ 4. Function Return Value
Function నుంచి మనం output తిరిగి పొందాలంటే return keyword ఉపయోగిస్తాం.
JavaScript
function add(a, b) {
return a + b;
}
let result = add(5, 10);
console.log(result); // Output: 15✅ 5. Function Expression (Anonymous Function)
Function కి పేరు లేకపోయినా assign చేయవచ్చు (Function Expression).
JavaScript
let greet = function(name) {
return "Hello, " + name;
};
console.log(greet("Vijay")); // Output: Hello, Vijay✅ 6. Arrow Functions (ES6 లో కొత్తది)
Arrow functions అంటే concise & short syntax లో function expression.
JavaScript
let add = (a, b) => a + b;
console.log(add(10, 20)); // Output: 30వేరే ఉదాహరణ:
JavaScript
let greet = name => "Hi, " + name;
console.log(greet("Sita")); // Output: Hi, Sita✅ 7. Default Parameters
Parameter ఇవ్వకపోయినా default value ఇవ్వొచ్చు.
JavaScript
function greet(name = "Guest") {
console.log("Hello, " + name);
}
greet(); // Output: Hello, Guest
greet("Kiran"); // Output: Hello, Kiran✅ 8. Function Scope
Function లో declare అయిన variables, function లోనే దొరుకుతాయి. దాన్ని local scope అంటారు.
JavaScript
function testScope() {
let msg = "Inside Function";
console.log(msg);
}
testScope(); // Output: Inside Function
// console.log(msg); ❌ Error - msg is not defined outside the function✅ 9. Nested Functions
Function లో function ని define చేయవచ్చు.
JavaScript
function outer() {
let message = "Hello from outer!";
function inner() {
console.log(message);
}
inner();
}
outer(); // Output: Hello from outer!✅ 10. Real-time Small Project Using Functions in javascript
Project Goal:
User నుండి Name మరియు Age తీసుకుని, వాళ్లు vote చేయడానికి eligible (age >= 18) అన్నది చెక్ చేయాలి.
🧰 Step 1: Folder Structure Setup
- Create a folder on your desktop — example:
VoterEligibilityProject - Inside that folder, create one file:
index.html– for HTML (structure)- You can optionally create
script.jsfor JavaScript (logic) — we’ll keep it simple and use inline<script>for now
Step 2: HTML Code (index.html)
JavaScript
<!DOCTYPE html>
<html>
<head>
<title>Voter Eligibility Checker</title>
</head>
<body>
<h2>Voter Eligibility Checker</h2>
<label for="username">Enter your name:</label>
<input type="text" id="username" placeholder="Name"><br><br>
<label for="age">Enter your age:</label>
<input type="number" id="age" placeholder="Age"><br><br>
<button onclick="checkEligibility()">Check Eligibility</button>
<p id="result" style="font-weight:bold; color: green;"></p>
<script>
// Step 1: This function triggers when button is clicked
function checkEligibility() {
// Step 2: Getting values from input fields
let name = document.getElementById("username").value;
let age = parseInt(document.getElementById("age").value);
// Step 3: Calling another function to get eligibility result
let message = getEligibilityMessage(name, age);
// Step 4: Showing result on the page
document.getElementById("result").innerText = message;
}
// This function returns message based on age
function getEligibilityMessage(name, age) {
if (name = = = "" || isNaN(age)) {
return "Please enter valid name and age.";
}
if (age >= 18) {
return `Hi ${name}, you are eligible to vote.`;
} else {
return `Sorry ${name}, you must be at least 18 years old to vote.`;
}
}
</script>
</body>
</html>
Step-by-Step Explanation in Telugu
✅ HTML Part:
<input type="text" id="username">— user name type చేయడానికి.<input type="number" id="age">— user age type చేయడానికి.<button onclick="checkEligibility()">— click చేస్తే function call అవుతుంది.<p id="result">— result చూపించడానికి.
✅ JavaScript Part:
- checkEligibility() Function
- User ఎంటర్ చేసిన name & age తీసుకుంటుంది.
getEligibilityMessage()అనే function call చేసి result తీసుకుంటుంది.- ఆ result ని
<p>tag లో చూపిస్తుంది.
- getEligibilityMessage(name, age) Function
- If age >= 18 అయితే => Eligible message చూపిస్తుంది.
- Age < 18 అయితే => Not eligible message.
- Input ఖాళీగా ఉంటే => “Please enter valid…” message.
