JavaScript అంటే ఏమిటి? | JavaScript Introduction in Telugu
మీరు ఎప్పుడైనా ఒక వెబ్సైట్లో ఒక బటన్ నొక్కగానే ఏదో మారడం గమనించారా? Instagram లో ఒక photo ని double tap చేయగానే heart వచ్చేస్తుంది. Amazon లో cart లో ఒక item add చేయగానే పైన number పెరుగుతుంది. Google Maps లో మీరు drag చేస్తే map కదులుతుంది. ఇవన్నీ page ని refresh చేయకుండానే జరుగుతాయి కదా?
ఈ మాయ వెనుక ఉన్నది JavaScript. ఈ chapter లో JavaScript అంటే ఏమిటో, అది ఎందుకు ఇంత ముఖ్యమో, మరియు మీ మొదటి JavaScript program ఎలా రాయాలో చాలా సులభంగా నేర్చుకుందాం. ఇంతకు ముందు ఎప్పుడూ programming చేయకపోయినా పర్వాలేదు, మనం మొదటి నుంచే మొదలుపెడదాం.
- JavaScript అంటే ఏమిటి, అది ఎందుకు వాడతారు
- JavaScript ఎలా పుట్టింది
- HTML, CSS, JavaScript మధ్య తేడా ఏమిటి
- JavaScript ని ఎక్కడెక్కడ ఉపయోగిస్తారు
- Java మరియు JavaScript ఒకటి కాదు అని ఎందుకు చెబుతారు
- మీ మొదటి JavaScript program రాసి run చేయడం
JavaScript ఒక programming language. Programming language అంటే కంప్యూటర్తో మాట్లాడటానికి మనం వాడే భాష. మనం తెలుగులో ఒక వ్యక్తికి "నీళ్లు తీసుకురా" అని చెబుతాం కదా, అలాగే కంప్యూటర్కి "ఈ పని చెయ్యి" అని చెప్పడానికి programming language వాడతాం.
JavaScript ని ముఖ్యంగా వెబ్సైట్లను సజీవంగా (interactive) మార్చడానికి వాడతారు. ఒక వెబ్సైట్ లో కేవలం text, images ఉంటే అది ఒక పుస్తకంలో పేజీ లాగా ఉంటుంది, మనం చూడగలం కానీ దానితో ఏమీ చేయలేం. అదే వెబ్సైట్లో JavaScript ఉంటే:
- బటన్ నొక్కితే ఏదైనా జరుగుతుంది
- Form లో తప్పు email రాస్తే వెంటనే "సరైన email ఇవ్వండి" అని చెబుతుంది
- Menu open అవుతుంది, close అవుతుంది
- Dark mode, light mode మార్చుకోవచ్చు
- Server నుంచి కొత్త data వచ్చి page లో కనిపిస్తుంది
అంటే JavaScript అనేది వెబ్సైట్కి ప్రాణం పోస్తుంది అని చెప్పొచ్చు.
ఇది చాలా ఆసక్తికరమైన కథ. 1995 లో Netscape అనే company, తమ browser లో వెబ్సైట్లు కొంచెం interactive గా ఉండేలా చేయడానికి ఒక చిన్న language కావాలనుకుంది. ఆ పని Brendan Eich అనే engineer కి అప్పగించారు. ఆయన ఈ language ని కేవలం 10 రోజుల్లో మొదటి version గా తయారు చేశారని చెబుతారు.
మొదట దీనికి వేరే పేర్లు ఉండేవి. తర్వాత "JavaScript" అనే పేరు పెట్టారు. ఈరోజు ఇది ప్రపంచంలో అత్యధికంగా వాడే programming languages లో ఒకటి. ఒక చిన్న ప్రయోగంగా మొదలైన language, ఇప్పుడు దాదాపు ప్రతి వెబ్సైట్లో ఉంది.
వెబ్సైట్ తయారీలో మూడు ముఖ్యమైన భాగాలు ఉంటాయి. వీటిని ఒక ఇల్లు తో పోల్చి చూద్దాం.
| భాగం | ఇంట్లో దేనికి సమానం | వెబ్సైట్లో ఏం చేస్తుంది |
|---|---|---|
| HTML | గోడలు, తలుపులు, కిటికీలు (ఇంటి నిర్మాణం) | Page లో ఏమేం ఉండాలో చెబుతుంది: heading, paragraph, image, button |
| CSS | రంగులు, పెయింటింగ్, ఫర్నిచర్ అమరిక (అందం) | Page ఎలా కనిపించాలో చెబుతుంది: colors, fonts, spacing |
| JavaScript | కరెంట్, స్విచ్లు, ఫ్యాన్, లైట్ (పని చేసే విధానం) | Page ఎలా ప్రవర్తించాలో చెబుతుంది: click చేస్తే ఏం జరగాలి |
గోడలు కట్టి, రంగు వేసినా, కరెంట్ లేకపోతే ఇల్లు ఉపయోగపడదు కదా? స్విచ్ నొక్కితే లైట్ వెలగడం లాంటిదే JavaScript పని. అందుకే ఈ మూడూ కలిస్తేనే ఒక పూర్తి వెబ్సైట్ తయారవుతుంది.
ఒకప్పుడు JavaScript కేవలం browser లోనే పని చేసేది. ఇప్పుడు పరిస్థితి మారింది. JavaScript తో మీరు చాలా రకాల పనులు చేయొచ్చు:
- Websites మరియు Web Apps: Gmail, YouTube, Facebook లాంటి వెబ్సైట్ల interactive భాగాలు JavaScript తో నడుస్తాయి.
- Server-side programming: Node.js అనే technology వల్ల, browser బయట కూడా, అంటే server మీద కూడా JavaScript run చేయొచ్చు. అంటే ఒకే language తో front-end మరియు back-end రెండూ రాయొచ్చు.
- Mobile Apps: React Native లాంటి tools తో Android మరియు iPhone apps తయారు చేయొచ్చు.
- Games: Browser లో ఆడుకునే చిన్న games JavaScript తో తయారవుతాయి.
- Desktop Apps: VS Code editor కూడా JavaScript technologies తో తయారైనదే.
అందుకే JavaScript నేర్చుకుంటే ఉద్యోగ అవకాశాలు చాలా ఎక్కువ. Web developer, Full-stack developer, App developer ఇలా చాలా రోల్స్కి ఇది అవసరం.
ఇది చాలా మంది beginners చేసే పెద్ద పొరపాటు. పేరులో "Java" ఉంది కాబట్టి రెండూ ఒకటే అనుకుంటారు. కానీ రెండూ పూర్తిగా వేరు వేరు languages.
దీన్ని ఇలా గుర్తుపెట్టుకోండి: Java కి JavaScript కి ఉన్న సంబంధం, కారు (Car) కి కార్పెట్ (Carpet) కి ఉన్న సంబంధం లాంటిది. రెండు పేర్లలో "Car" ఉంది, కానీ రెండూ ఒకటి కావు కదా!
| Java | JavaScript |
|---|---|
| ముఖ్యంగా Android apps, enterprise software కోసం | ముఖ్యంగా వెబ్సైట్లు, web apps కోసం |
| Code ని ముందు compile చేయాలి | Browser నేరుగా code ని run చేస్తుంది |
| రాయడానికి ఎక్కువ code అవసరం | తక్కువ code తో పని పూర్తవుతుంది |
ఆ కాలంలో Java చాలా ప్రాచుర్యంలో ఉండటంతో, marketing కోసం ఈ పేరు పెట్టారని చెబుతారు. అంతే, వేరే సంబంధం ఏమీ లేదు.
ఇప్పుడు అసలు విషయానికి వద్దాం. ప్రతి programmer తన మొదటి program లో "Hello, World!" అని print చేస్తారు. ఇది ఒక సంప్రదాయం. మనం కూడా అదే చేద్దాం.
console.log("Hello, World!");
Output:
Hello, World!
Code ని లైన్ బై లైన్ అర్థం చేసుకుందాం
console.log()అనేది ఒక command. ఇది మనం ఇచ్చిన దాన్ని screen మీద (console లో) చూపిస్తుంది.- కుండలీకరణాల (
()) లోపల మనం చూపించాలనుకున్న విషయాన్ని ఇస్తాం. "Hello, World!"అనేది ఒక text (string). Text ని ఎప్పుడూ quotation marks (" ") మధ్యలో రాయాలి.- చివరిలో ఉన్న
;(semicolon) ఒక statement ముగిసిందని సూచిస్తుంది.
ఇదే మీ మొదటి JavaScript program. అభినందనలు, మీరు ఇప్పుడు ఒక JavaScript programmer అయ్యారు!
మీ పేరు print చేద్దాం
console.log("నా పేరు రవి");
console.log("నేను JavaScript నేర్చుకుంటున్నాను");
Output:
నా పేరు రవి నేను JavaScript నేర్చుకుంటున్నాను
ప్రతి console.log() ఒక కొత్త లైన్ లో output ఇస్తుంది. మీ పేరు రాసి మీరూ try చేయండి.
Browser లో ఒక popup message చూపించడానికి alert() వాడతాం.
alert("స్వాగతం! JavaScript నేర్చుకుందాం");
ఇది browser లో run చేస్తే ఒక చిన్న popup box వచ్చి ఆ message చూపిస్తుంది.
alert() browser లో మాత్రమే పని చేస్తుంది. కొన్ని online compilers లో ఇది పని చేయదు. అందుకే మనం ఎక్కువగా console.log() నే వాడతాం.
JavaScript అసలు శక్తి వెబ్సైట్లో కనిపిస్తుంది. ఈ చిన్న ఉదాహరణ చూడండి:
<!DOCTYPE html>
<html>
<body>
<h2 id="msg">నమస్కారం!</h2>
<button onclick="changeText()">ఇక్కడ నొక్కండి</button>
<script>
function changeText() {
document.getElementById("msg").innerText = "JavaScript పని చేస్తోంది!";
}
</script>
</body>
</html>
ఇది ఏం చేస్తుంది: పేజీలో "నమస్కారం!" అనే heading మరియు ఒక బటన్ కనిపిస్తాయి. బటన్ నొక్కగానే heading "JavaScript పని చేస్తోంది!" గా మారుతుంది, page refresh అవ్వకుండానే.
ఇప్పుడు ఈ code పూర్తిగా అర్థం కాకపోయినా భయపడకండి. function, document లాంటివి ముందు chapters లో వివరంగా నేర్చుకుంటాం. ఇప్పుడు మీరు గుర్తుపెట్టుకోవాల్సింది ఒక్కటే: బటన్ నొక్కినప్పుడు page లో ఏదో మార్చగలగడమే JavaScript శక్తి.
1. Java మరియు JavaScript ని ఒకటే అనుకోవడం.
రెండూ వేరు వేరు. Java నేర్చుకున్నంత మాత్రాన JavaScript రాదు, JavaScript నేర్చుకున్నంత మాత్రాన Java రాదు.
2. Quotation marks మర్చిపోవడం.
తప్పు:
console.log(Hello);ఇది error ఇస్తుంది (Hello is not defined), ఎందుకంటే text ని quotes లో రాయలేదు.
సరైనది:
console.log("Hello");3. అక్షరాల పొరపాట్లు (Case sensitivity).
JavaScript లో పెద్ద అక్షరం, చిన్న అక్షరం తేడా ఉంటుంది. console.log సరైనది, కానీ Console.Log లేదా console.Log రాస్తే error వస్తుంది.
4. కుండలీకరణాలు (brackets) మూసివేయకపోవడం.console.log("Hi" అని రాసి ) మర్చిపోతే error వస్తుంది. ప్రతి ( కి ఒక ) ఉండాలి.
- మీ పేరు print చేసే ఒక program రాయండి.
- మూడు వేర్వేరు లైన్లలో మీ పేరు, మీ ఊరు, మీకు ఇష్టమైన ఆట print చేయండి.
- HTML, CSS, JavaScript లలో ప్రతిదాని పని ఒక్క వాక్యంలో రాయండి.
- ఈ code లో తప్పు ఏమిటో కనుక్కోండి:
console.log("Welcome) Console.log("Hi");run చేస్తే ఏం జరుగుతుంది? ఎందుకు?
సమాధానాలు చూడండి
1.console.log("రవి కుమార్");
2.console.log("నా పేరు సీత");console.log("నా ఊరు హైదరాబాద్");console.log("నాకు ఇష్టమైన ఆట క్రికెట్");
3. HTML page నిర్మాణాన్ని (structure) ఇస్తుంది, CSS దానికి అందాన్ని (design) ఇస్తుంది, JavaScript దానికి పని చేసే గుణాన్ని (behaviour) ఇస్తుంది.
4. Closing quotation mark (") లేదు. సరైనది: console.log("Welcome");
5. Error వస్తుంది (Console is not defined). JavaScript case-sensitive, కాబట్టి console చిన్న అక్షరాలతో రాయాలి.
పైన నేర్చుకున్న console.log("Hello, World!"); ని మన compiler లో ఇప్పుడే run చేసి చూడండి. మీ పేరు మార్చి రాసి, output ఎలా మారుతుందో గమనించండి.
- JavaScript ఒక programming language, వెబ్సైట్లను interactive గా చేయడానికి వాడతారు.
- HTML నిర్మాణం, CSS అందం, JavaScript పని చేసే విధానం.
- JavaScript ని websites, servers (Node.js), mobile apps, games లో వాడతారు.
- Java మరియు JavaScript వేరు వేరు languages.
console.log()తో మనం screen మీద output చూపిస్తాం.- JavaScript case-sensitive, text ఎప్పుడూ quotes లో రాయాలి.