జావాస్క్రిప్ట్ ES5
- పూర్వ పేజీ JS వెర్షన్
- తరువాత పేజీ JS 2015 (ES6)
ఇక్మాస్క్రిప్ట్ 5 ఏమిటి?
ECMAScript 5 కూడా ES5 మరియు ECMAScript 2009 అని పిలుస్తారు.
ఈ పరిచయంలో ES5 యొక్క అత్యంత ముఖ్యమైన సంకేతాలను పరిచయం చేస్తుంది.
ECMAScript 5 సంకేతాలు
ఈ క్రింది నూతన సంకేతాలు 2009 లో విడుదల అయ్యాయి:
- "use strict" సూచన
- String.trim()
- Array.isArray()
- Array.forEach()
- Array.map()
- Array.filter()
- Array.reduce()
- Array.reduceRight()
- అరెయ్.ఇవరీ
- అరెయ్.సోమ్
- అరెయ్.ఇండెక్స్ ఆఫ్ అరెయ్
- అరెయ్.లాస్ట్ఆఫ్ స్థానం
- JSON.parse()
- JSON.stringify()
- Date.now()
- గెట్టర్ మరియు సెట్టర్ అంశాలు
- కొత్త ఆపరేటర్ అంశాలు మరియు మాధ్యమాలు
ECMAScript 5 సంకేతాలు
- స్ట్రింగ్ యాచ్చర్లలో ప్రతిపాదించబడిన సంకేతాలను ఉపయోగించడం
- అర్రే మరియు ఆబ్జెక్ట్ లోకి తిరిగి కొనసాగే కాండా కొనసాగే కాండా ప్రక్రియలు
- బహుళ పద్ధతి స్ట్రింగ్ లోకి వాక్యం
- అంతర్భాగ పేరుల అనుమతించబడిన పదాలు
"use strict" సూచన
"use strict
" జావాస్క్రిప్ట్ కోడ్ ను "స్ట్రింగెంట్ మోడ్" లో అమలు చేయడానికి నిర్వచిస్తుంది.
ఉదాహరణకు, స్ట్రింగెంట్ మోడ్ ఉపయోగించినప్పుడు అనుమానించిన విశ్లేషణను ఉపయోగించలేరు.
అన్ని ప్రోగ్రామ్లలో స్ట్రింగెంట్ మోడ్ ఉపయోగించవచ్చు. ఇది మీరు స్పష్టమైన కోడ్ రాయడానికి సహాయపడుతుంది, ఉదాహరణకు మీరు అనుమానించిన విశ్లేషణను నిరోధిస్తుంది.
"use strict
” ఇది ఒక సాధారణ స్ట్రింగ్ ప్రకటన మాత్రమే. పాత బ్రౌజర్లు అవి అర్థం చేసుకోలేకపోతే తప్పులు చేకూరవు.
దరఖాస్తు చేయండి JS స్ట్రింగ్ పద్ధతి మరింత వివరాలకు ఈ లింక్ లో చూడండి.
String.trim()
String.trim()
సంఖ్యల ప్రక్కన ఖాళీ అక్షరాలను తొలగిస్తుంది.
ఇన్స్టాన్స్
var str = " Hello World! "; alert(str.trim());
దయచేసి ఈ పేజీలో చూడండి: JS స్ట్రింగ్ పద్ధతులు మరింత వివరాలకు ఈ లింక్ లో చూడండి.
Array.isArray()
isArray()
ఫంక్షన్ విశ్లేషిస్తుంది ఆబ్జెక్ట్ సంఖ్యలు అర్రే అని లేదా కాదు.
ఇన్స్టాన్స్
function myFunction() { వార్ ఫ్రూట్స్ = ["బానానా", "ఓరాంజ్", "అప్పల్", "మాంగో"]; var x = document.getElementById("demo"); x.innerHTML = Array.isArray(fruits); }
దయచేసి ఈ పేజీలో చూడండి: JS సంఖ్యల పేరు మరింత వివరాలకు ఈ లింక్ లో చూడండి.
Array.forEach()
forEach()
ప్రతి సంఖ్యల పైన ఒక్కసారి ఫంక్షన్ అనువర్తిస్తుంది.
ఇన్స్టాన్స్
var txt = ""; వార్ నంబర్స్ = [45, 4, 9, 16, 25]; numbers.forEach(myFunction); ఫంక్షన్ మైఫంక్షన్ వాల్యూ) { txt = txt + value + "<br>"; }
దయచేసి ఈ పేజీలో చూడండి: జెఐఎస్ అరెయ్ ఇటరేషన్ మెథడ్స్ మరింత వివరాలు నేర్చుకోండి.
Array.map()
ఈ ఉదాహరణలో ప్రతి సంఖ్యను 2 రెట్లు చేస్తుంది:
ఇన్స్టాన్స్
వార్ నంబర్స్1 = [45, 4, 9, 16, 25]; var numbers2 = numbers1.map(myFunction); ఫంక్షన్ మైఫంక్షన్ వాల్యూ) { return value * 2; }
దయచేసి ఈ పేజీలో చూడండి: జెఐఎస్ అరెయ్ ఇటరేషన్ మెథడ్స్ మరింత వివరాలు నేర్చుకోండి.
Array.filter()
ఈ ఉదాహరణలో 18 కంటే ఎక్కువ విలువల కలిగిన నూతన సంఖ్యల పేరు సిద్ధం చేస్తుంది:
ఇన్స్టాన్స్
వార్ నంబర్స్ = [45, 4, 9, 16, 25]; var over18 = numbers.filter(myFunction); ఫంక్షన్ మైఫంక్షన్ వాల్యూ) { రిటర్న్ వాల్యూ > 18; }
దయచేసి ఈ పేజీలో చూడండి: జెఐఎస్ అరెయ్ ఇటరేషన్ మెథడ్స్ మరింత వివరాలు నేర్చుకోండి.
Array.reduce()
ఈ ఉదాహరణ ప్రకారం సంఖ్యల మొత్తం నిర్ణయిస్తుంది:
ఇన్స్టాన్స్
వార్ నంబర్స్1 = [45, 4, 9, 16, 25]; var sum = numbers1.reduce(myFunction); ఫంక్షన్ మైఫంక్షన్ (టోటల్, వాల్యూ) { రిటర్న్ టోటల్ + వాల్యూ; }
దయచేసి ఈ పేజీలో చూడండి: జెఐఎస్ అరెయ్ ఇటరేషన్ మెథడ్స్ మరింత వివరాలు నేర్చుకోండి.
Array.reduceRight()
ఈ ఉదాహరణలో అరెయ్ లో అన్ని సంఖ్యల మొత్తాన్ని నిర్ణయించడం అని పరిశీలిస్తుంది:
ఇన్స్టాన్స్
వార్ నంబర్స్1 = [45, 4, 9, 16, 25]; వార్ సమ్ = నంబర్స్1.రీడ్క్లూజ్ మైఫంక్షన్); ఫంక్షన్ మైఫంక్షన్ (టోటల్, వాల్యూ) { రిటర్న్ టోటల్ + వాల్యూ; }
దయచేసి ఈ పేజీలో చూడండి: జెఐఎస్ అరెయ్ ఇటరేషన్ మెథడ్స్ మరింత వివరాలు నేర్చుకోండి.
అరెయ్.ఇవరీ
ఈ ఉదాహరణలో అన్ని విలువలు 18 కంటే ఎక్కువగా ఉన్నాయి అని పరిశీలిస్తుంది:
ఇన్స్టాన్స్
వార్ నంబర్స్ = [45, 4, 9, 16, 25]; వార్ ఆల్ఆవర్ ఓవర్ ఏట్టిన్ = నంబర్స్.ఇవరీ ఫంక్షన్); ఫంక్షన్ మైఫంక్షన్ వాల్యూ) { రిటర్న్ వాల్యూ > 18; }
దయచేసి ఈ పేజీలో చూడండి: జెఐఎస్ అరెయ్ ఇటరేషన్ మెథడ్స్ మరింత వివరాలు నేర్చుకోండి.
అరెయ్.సోమ్
ఈ ఉదాహరణలో కొన్ని విలువలు 18 కంటే ఎక్కువగా ఉన్నాయి అని పరిశీలిస్తుంది:
ఇన్స్టాన్స్
వార్ నంబర్స్ = [45, 4, 9, 16, 25]; వార్ ఆల్ఆవర్ ఓవర్ ఏట్టిన్ = నంబర్స్.సోమ్(మైఫంక్షన్); ఫంక్షన్ మైఫంక్షన్ వాల్యూ) { రిటర్న్ వాల్యూ > 18; }
దయచేసి ఈ పేజీలో చూడండి: జెఐఎస్ అరెయ్ ఇటరేషన్ మెథడ్స్ మరింత వివరాలు నేర్చుకోండి.
అరెయ్.ఇండెక్స్ ఆఫ్ అరెయ్
అరెయ్ లో కొన్ని అంశాన్ని శోధించి దాని స్థానాన్ని తిరిగి అందిస్తుంది:
ఇన్స్టాన్స్
వార్ ఫ్రూట్స్ = ["బానానా", "ఓరాంజ్", "అప్పల్", "మాంగో"]; వార్ ఎ = ఫ్రూట్స్.ఇండెక్స్("అప్పల్");
దయచేసి ఈ పేజీలో చూడండి: జెఐఎస్ అరెయ్ ఇటరేషన్ మెథడ్స్మరింత వివరాలు నేర్చుకోండి.
అరెయ్.లాస్ట్ఆఫ్ స్థానం
అరెయ్.లాస్ట్ఆఫ్ స్థానం
మరియు అరెయ్.ఇండెక్స్ ఆఫ్ అరెయ్
అలాగే, కానీ అరెయ్ ముగింపు నుండి తిరిగి శోధిస్తుంది.
ఇన్స్టాన్స్
వార్ ఫ్రూట్స్ = ["బానానా", "ఓరాంజ్", "అప్పల్", "మాంగో"]; వార్ ఎ = ఫ్రూట్స్.లాస్ట్ఆఫ్ఫ్ స్థానం("అప్పల్");
దయచేసి ఈ పేజీలో చూడండి: జెఐఎస్ అరెయ్ ఇటరేషన్ మెథడ్స్ మరింత వివరాలు నేర్చుకోండి.
JSON.parse()
జెఐఎస్ యొక్క ఒక సాధారణ ఉపయోగం వేబ్ సర్వర్ నుండి డాటా అందుకోవడం.
పరిష్కారంగా, మీరు వేబ్ సర్వర్ నుండి ఈ టెక్స్ట్ స్ట్రింగ్ అందుకున్నారు:
'{"name":"బిల్", "age":62, "city":"సియట్ల్"}'
జావాస్క్రిప్ట్ ఫంక్షన్ JSON.parse()
టెక్స్ట్ ను జావాస్క్రిప్ట్ ఆఫ్ఫ్ ప్రాపర్టీగా మార్చడానికి ఉపయోగించబడుతుంది:
వార్ ఆబ్జ్ = జెఐఎస్.పార్స్('{"name":"బిల్", "age":62, "city":"సియట్ల్"}');
మా పాఠ్యక్రమాలలో మరింత తెలుసుకోండి. JSON పాఠ్యక్రమం మరింత వివరాలు నేర్చుకోండి.
JSON.stringify()
జెఐఎస్ యొక్క ఒక సాధారణ ఉపయోగం వేబ్ సర్వర్ కు డాటా పంపడం.
వేబ్ సర్వర్ కు డాటా పంపడం వద్ద, డాటా స్ట్రింగ్ లో ఉండాలి.
పరిష్కారంగా, మేము జావాస్క్రిప్ట్ లో ఈ ఆఫ్ఫ్ ప్రాపర్టీ కలిగి ఉన్నాము:
var obj = {"name":"Bill", "age":62, "city":"Seatle"};
దానిని స్ట్రింగ్ లో మార్చడానికి జావాస్క్రిప్ట్ ఫంక్షన్ JSON.stringify() ని వాడండి.
var myJSON = JSON.stringify(obj);
ఫలితం జెఐఎస్ రూపంలో ఉండే స్ట్రింగ్ అవుతుంది.
మైజూన్ ప్రస్తుతం ఒక స్ట్రింగ్ గా ఉంది, ఇది సర్వర్ కు పంపడానికి సిద్ధమైంది:
ఇన్స్టాన్స్
var obj = {"name":"Bill", "age":62, "city":"Seatle"}; var myJSON = JSON.stringify(obj); document.getElementById("demo").innerHTML = myJSON;
మా పాఠ్యక్రమాలలో మరింత తెలుసుకోండి. JSON పాఠ్యక్రమం మరింత వివరాలు నేర్చుకోండి.
Date.now()
Date.now() అమలు చేసిన నిమిషాలు నిర్వచిస్తుంది దానికి నాలుగు రకాలు ఉన్నాయి.
ఇన్స్టాన్స్
var timInMSs = Date.now();
Date.now()
డేట్ ఆపరేటర్ పై getTime() అమలు చేసిన ఫలితం తో సమానంగా తిరిగి వస్తుంది.
దయచేసి ఈ పేజీలో చూడండి: JS తేదీ మరింత తెలుసుకోండి.
గెట్టర్ మరియు సెట్టర్ అంశాలు
ES5 ఆపరేటర్లను ఉపయోగించి పొందించడానికి మరియు సెట్ చేయడానికి వర్గాలను నిర్వచించవచ్చు.
ఈ ఉదాహరణలో నామము అంశానికి ఒక getter:
ఇన్స్టాన్స్
// అన్ని విధానాలను సృష్టించండి var person = { firstName: "Bill", lastName : "Gates", get fullName() { return this.firstName + " " + this.lastName; } }); // గెట్టర్ ఉపయోగించి ఆపరేటర్ నుండి డాటా చూపించండి: document.getElementById("demo").innerHTML = person.fullName;
ఈ ఉదాహరణలో భాష అంశానికి ఒక setter మరియు getter:
ఇన్స్టాన్స్
var person = { firstName: "Bill", lastName : "Gates", language : "NO", get lang() { return this.language; }, set lang(value) { this.language = value; } }); // సెట్టర్ ఉపయోగించి ఆపరేటర్ అంశాన్ని సెట్ చేయండి: person.lang = "en"; // గెట్టర్ ఉపయోగించి ఆపరేటర్ నుండి డాటా చూపించండి: document.getElementById("demo").innerHTML = person.lang;
ఈ ఉదాహరణలో setter ఉపయోగించబడింది దానికి భాష విలువను పెద్ద అక్షరాలలో నిర్వచించడానికి నిర్ధారించబడింది:
ఇన్స్టాన్స్
var person = { firstName: "Bill", lastName : "Gates", language : "NO", set lang(value) { this.language = value.toUpperCase(); } }); // సెట్టర్ ఉపయోగించి ఆపరేటర్ అంశాన్ని సెట్ చేయండి: person.lang = "en"; // ఆపరేటర్ నుండి డాటా చూపించండి: document.getElementById("demo").innerHTML = person.language;
దయచేసి ఈ పేజీలో చూడండి: JS ఆపరేటర్లు గెట్టర్ మరియు సెట్టర్ గురించి మరింత తెలుసుకోండి.
కొత్త ఆపరేటర్ అంశాలు మరియు మాధ్యమాలు
Object.defineProperty()
ES5 లో కొత్త ఆపరేటర్ మాధ్యమం.
ఇది ఆపరేటర్ అంశాలను నిర్వచించడానికి మరియు / లేదా అంశాల విలువను మరియు / లేదా మెటాడాటా మార్చడానికి అనుమతిస్తుంది。
ఇన్స్టాన్స్
// అన్ని విధానాలను సృష్టించండి var person = { firstName: "Bill", lastName : "Gates", language : "NO", }); // గుణాన్ని మార్చండి Object.defineProperty(person, "language", { value: "EN", writable : true, enumerable : true, configurable : true }); // గుణాలను పరిగణించండి var txt = ""; for (var x in person) { txt += person[x] + "<br>"; } document.getElementById("demo").innerHTML = txt;
మరొక ఉదాహరణ ఇదే కోడు ఉంది, కానీ అనుకూలించబడినదానిలో భాష గుణాన్ని దాచి ఉంది:
ఇన్స్టాన్స్
// అన్ని విధానాలను సృష్టించండి var person = { firstName: "Bill", lastName : "Gates", language : "NO", }); // గుణాన్ని మార్చండి Object.defineProperty(person, "language", { value: "EN", writable : true, enumerable : false, configurable : true }); // గుణాలను పరిగణించండి var txt = ""; for (var x in person) { txt += person[x] + "<br>"; } document.getElementById("demo").innerHTML = txt;
// ఈ ఉదాహరణలో భాషను పెద్ద అక్షరాలకు మార్చడానికి setter మరియు getter ను సృష్టించడం జరుగుతుంది:
ఇన్స్టాన్స్
// అన్ని విధానాలను సృష్టించండి var person = { firstName: "Bill", lastName : "Gates", language : "NO" }); // గుణాన్ని మార్చండి Object.defineProperty(person, "language", { get : function() { return language }, set : function(value) { language = value.toUpperCase()} }); // భాషను మార్చండి person.language = "en"; // భాషను చూపించండి document.getElementById("demo").innerHTML = person.language;
ES5 కొత్త అన్ని విధానాలు
ECMAScript 5 జావాస్క్రిప్ట్కు అనేక కొత్త అన్ని విధానాలను జోడించింది:
// అన్ని గుణాలను జోడించండి లేదా మార్చండి Object.defineProperty(object, property, descriptor) // అనేక అన్ని గుణాలను జోడించండి లేదా మార్చండి Object.defineProperties(object, descriptors) // గుణాన్ని పొందండి Object.getOwnPropertyDescriptor(object, property) // అన్ని గుణాలను అంకురంగా వారు తిరిగి ఇవ్వండి Object.getOwnPropertyNames(object) // అనుకూలించబడిన గుణాలను అంకురంగా వారు తిరిగి ఇవ్వండి Object.keys(object) // ప్రాతిపదికను పొందండి Object.getPrototypeOf(object) // 防止向对象添加属性 // ఆకెంబలానికి అనునది జోడించకూడదు // ఆకెంబలానికి అనునది జోడించవచ్చు ఉండి true తిరిగుతుంది Object.isExtensible(object) // ఆకెంబలం అనునది మార్చకూడదు (అనునది మార్చకూడదు కాదు) Object.seal(object) // ఆకెంబలం సీలు పడినప్పుడు true తిరిగుతుంది Object.isSealed(object) // ఆకెంబలం జింకరుకి పడించడం నిషేధిస్తుంది // ఆకెంబలాన్ని మార్చకూడదు // ఆకెంబలం జింకరుకి పడినప్పుడు true తిరిగుతుంది Object.isFrozen(object)
దయచేసి ఈ పేజీలో చూడండి: ఆకెంబలం ECMAScript5 మరింత వివరాలు నేర్చుకోండి.
ఆకెంబలం యాత్రాబట్టు అనునది
charAt()
పద్ధతి స్ట్రింగ్ లో నిర్దిష్ట సూచికను తిరిగి పొందుతుంది:
ఇన్స్టాన్స్
var str = "HELLO WORLD"; str.charAt(0); // రాబట్టు H
ECMAScript 5 ఆకెంబలంలో స్ట్రింగ్ యాత్రాబట్టు అనుమతిస్తుంది:
ఇన్స్టాన్స్
var str = "HELLO WORLD"; str[0]; // రాబట్టు H
స్ట్రింగ్ యాత్రాబట్టు అనునది కొనిసాగించబడదు ఉండవచ్చు.
దయచేసి ఈ పేజీలో చూడండి: JS స్ట్రింగ్ పద్ధతులు మరింత వివరాలు నేర్చుకోండి.
తుది కాండక్షన్ (Trailing Commas)
ECMAScript 5 ఆకెంబలం మరియు పేరుగణం నిర్వచనలో తుది కాండక్షన్ ఉపయోగించడానికి అనుమతిస్తుంది:
ఆకెంబలం ఉదాహరణ
person = { firstName: "Bill", lastName: " Gates", age: 62, }
పేరుగణం ఉదాహరణ
points = [ 1, 5, 10, 25, 40, 100, ];
అపాయం !!
Internet Explorer 8 కొట్టుకుపడుతుంది.
JSON తుది కాండక్షన్ ఉపయోగించకుండా ఉండాలి.
JSON ఆకెంబలం:
// అనుమతించబడింది: var person = '{"firstName":"Bill", "lastName":"Gates", "age":62}' JSON.parse(person) // నిషేధించబడింది: var person = '{"firstName":"Bill", "lastName":"Gates", "age":62,}' JSON.parse(person)
JSON పేరుగణం:
// అనుమతించబడింది: points = [40, 100, 1, 5, 25, 10] // నిషేధించబడింది: points = [40, 100, 1, 5, 25, 10,]
多行字符串
如果使用反斜杠转义,ECMAScript 5 允许多行的字符串文字(字面量):
ఇన్స్టాన్స్
"Hello \ Kitty!";
\ 方法可能没有得到普遍的支持。
较旧的浏览器可能会以不同的方式处理反斜杠周围的空格。
一些旧的浏览器不允许 \ 字符后面的空格。
పదబంధాన్ని విడిచివేయడంలో సురక్షితమైన మరొక పద్ధతి పదాల జోడింపు ఉపయోగించడం ఉంది:
ఇన్స్టాన్స్
"Hello " + "Kitty!";
ప్రత్యామ్నాయ పదాలను అంశాల పేరుగా ఉపయోగించడం
ECMAScript 5 ప్రత్యామ్నాయ పదాలను అంశాల పేరుగా ఉపయోగించవచ్చు:
ఆబ్జెక్ట్ ఇన్స్టాన్స్
var obj = {name: "Bill", new: "yes"}
ES5 (ECMAScript 5) బ్రౌజర్ మద్దతు
చ్రోమ్ 23, IE 10 మరియు సఫారీ 6 మొదటి సంచికలుగా ECMAScript 5 పూర్తిగా మద్దతు ఇస్తాయి:
చ్రోమ్ 23 | IE10 / ఎండ్జె | ఫైర్ఫాక్స్ 21 | సఫారీ 6 | ఓపెరా 15 |
2012 సెప్టెంబర్ | 2012 సెప్టెంబర్ | 2013 జూలై | 2012 ఏప్రిల్ | 2013 ఏప్రిల్ |
- పూర్వ పేజీ JS వెర్షన్
- తరువాత పేజీ JS 2015 (ES6)