ES6 అంటే ఏమిటి మరియు జావాస్క్రిప్ట్ ప్రోగ్రామర్లు తెలుసుకోవలసినది

ES6 అంటే ఏమిటి మరియు జావాస్క్రిప్ట్ ప్రోగ్రామర్లు తెలుసుకోవలసినది

ES6 అనేది ECMA స్క్రిప్ట్ ప్రోగ్రామింగ్ లాంగ్వేజ్ యొక్క వెర్షన్ 6 ని సూచిస్తుంది. ECMA స్క్రిప్ట్ అనేది జావాస్క్రిప్ట్‌కు ప్రామాణికమైన పేరు, మరియు వెర్షన్ 6 అనేది వెర్షన్ 5 తర్వాత తదుపరి వెర్షన్, ఇది 2011 లో విడుదలైంది. ఇది జావాస్క్రిప్ట్ లాంగ్వేజ్‌కు పెద్ద మెరుగుదల, మరియు పెద్ద-స్థాయి సాఫ్ట్‌వేర్ డెవలప్‌మెంట్‌ను సులభతరం చేయడానికి ఉద్దేశించిన అనేక ఫీచర్‌లను జోడిస్తుంది .





ECMAScript, లేదా ES6, జూన్ 2015 లో ప్రచురించబడింది. దాని తరువాత ECMAScript 2015 గా పేరు మార్చబడింది. ప్రధాన భాగాలకు మద్దతు ఉన్నప్పటికీ పూర్తి భాష కోసం వెబ్ బ్రౌజర్ మద్దతు ఇంకా పూర్తి కాలేదు. ప్రధాన వెబ్ బ్రౌజర్‌లు ES6 యొక్క కొన్ని ఫీచర్‌లకు మద్దతు ఇస్తాయి. అయితే, a అని పిలువబడే సాఫ్ట్‌వేర్‌ను ఉపయోగించడం సాధ్యమవుతుంది ఆటగాడు ES6 కోడ్‌ని ES5 గా మార్చడానికి, ఇది చాలా బ్రౌజర్‌లలో బాగా మద్దతు ఇస్తుంది.





జావాస్క్రిప్ట్‌కు ES6 తీసుకువచ్చే కొన్ని ప్రధాన మార్పులను ఇప్పుడు చూద్దాం.





1. స్థిరాంకాలు

చివరగా స్థిరాంకాల భావన జావాస్క్రిప్ట్‌గా మారింది! స్థిరాంకాలు ఒక్కసారి మాత్రమే నిర్వచించబడే విలువలు (ఒక్కో స్కోప్, స్కోప్ క్రింద వివరించబడింది). అదే పరిధిలోని రీ-డెఫినిషన్ లోపాన్ని ప్రేరేపిస్తుంది.

const JOE = 4.0
JOE= 3.5
// results in: Uncaught TypeError: Assignment to constant variable.

మీరు వేరియబుల్‌ను ఉపయోగించగలిగే చోట మీరు స్థిరాంకాన్ని ఉపయోగించవచ్చు ( ఎక్కడ ).



console.log('Value is: ' + joe * 2)
// prints: 8

2. బ్లాక్-స్కోప్డ్ వేరియబుల్స్ మరియు ఫంక్షన్లు

21 వ శతాబ్దానికి స్వాగతం, జావాస్క్రిప్ట్! ES6 తో, వేరియబుల్స్ ఉపయోగించి ప్రకటించబడ్డాయి వీలు (మరియు పైన పేర్కొన్న స్థిరాంకాలు) జావా, సి ++ మొదలైన వాటిలాగే బ్లాక్ స్కోపింగ్ నియమాలను అనుసరించండి (మరింత తెలుసుకోవడానికి, జావాస్క్రిప్ట్‌లో వేరియబుల్స్ ఎలా డిక్లేర్ చేయాలో చూడండి.)

ఈ నవీకరణకు ముందు, జావాస్క్రిప్ట్‌లోని వేరియబుల్స్ ఫంక్షన్ స్కోప్ చేయబడ్డాయి. అంటే, వేరియబుల్ కోసం మీకు కొత్త స్కోప్ అవసరమైనప్పుడు, మీరు దానిని ఫంక్షన్‌లో ప్రకటించాల్సి ఉంటుంది.





వేరియబుల్స్ బ్లాక్ ముగింపు వరకు విలువను కలిగి ఉంటాయి. బ్లాక్ తర్వాత, బాహ్య బ్లాక్‌లోని విలువ (ఏదైనా ఉంటే) పునరుద్ధరించబడుతుంది.

ల్యాప్‌టాప్ బాహ్య హార్డ్ డ్రైవ్‌ను గుర్తించదు
{
let x = 'hello';
{
let x = 'world';
console.log('inner block, x = ' + x);
}
console.log('outer block, x = ' + x);
}
// prints
inner block, x = world
outer block, x = hello

అటువంటి బ్లాక్‌లలో మీరు స్థిరాంకాలను కూడా పునర్నిర్వచించవచ్చు.





{
let x = 'hello';
{
const x = 4.0;
console.log('inner block, x = ' + x);
try {
x = 3.5
} catch(err) {
console.error('inner block: ' + err);
}
}
x = 'world';
console.log('outer block, x = ' + x);
}
// prints
inner block, x = 4
inner block: TypeError: Assignment to constant variable.
outer block, x = world

3. బాణం విధులు

ES6 పరిచయం బాణం విధులు జావాస్క్రిప్ట్‌కు. (ఇవి సాంప్రదాయక విధులను పోలి ఉంటాయి, కానీ సరళమైన వాక్యనిర్మాణాన్ని కలిగి ఉంటాయి.) కింది ఉదాహరణలో, x అనే పరామితిని అంగీకరించే ఫంక్షన్ కు , మరియు దాని ఇంక్రిమెంట్‌ను అందిస్తుంది:

var x = a => a + 1;
x(4) // returns 5

ఈ వాక్యనిర్మాణాన్ని ఉపయోగించి, మీరు ఫంక్షన్లలో వాదనలను సులభంగా నిర్వచించవచ్చు మరియు పాస్ చేయవచ్చు.

A తో ఉపయోగించడం ప్రతి() :

[1, 2, 3, 4].forEach(a => console.log(a + ' => ' + a*a))
// prints
1 => 1
2 => 4
3 => 9
4 => 16

బహుళ వాదనలను కుండలీకరణాలలో జత చేయడం ద్వారా వాటిని ఆమోదించే విధులను నిర్వచించండి:

[22, 98, 3, 44, 67].sort((a, b) => a - b)
// returns
[3, 22, 44, 67, 98]

4. డిఫాల్ట్ ఫంక్షన్ పారామీటర్లు

ఫంక్షన్ పారామితులను ఇప్పుడు డిఫాల్ట్ విలువలతో ప్రకటించవచ్చు. ఈ దిగువ, x రెండు పారామితులతో కూడిన ఫంక్షన్ కు మరియు బి . రెండవ పరామితి బి యొక్క డిఫాల్ట్ విలువ ఇవ్వబడింది 1 .

var x = (a, b = 1) => a * b
x(2)
// returns 2
x(2, 2)
// returns 4

C ++ లేదా పైథాన్ వంటి ఇతర భాషల వలె కాకుండా, డిఫాల్ట్ విలువలు ఉన్న పారామితులు డిఫాల్ట్‌లు లేని వాటి ముందు కనిపించవచ్చు. ఈ ఫంక్షన్ ఒక బ్లాక్‌గా నిర్వచించబడిందని గమనించండి తిరిగి ఉదాహరణ ద్వారా విలువ.

var x = (a = 2, b) => { return a * b }

అయితే వాదనలు ఎడమ నుండి కుడికి సరిపోతాయి. దిగువ మొదటి ఆహ్వానంలో, బి కలిగి ఉంది నిర్వచించబడలేదు అయినప్పటికీ విలువ కు డిఫాల్ట్ విలువతో ప్రకటించబడింది. ఆమోదించిన వాదనతో సరిపోలబడింది కు దానికన్నా బి . ఫంక్షన్ తిరిగి వస్తుంది NaN .

x(2)
// returns NaN
x(1, 3)
// returns 3

మీరు స్పష్టంగా ప్రవేశించినప్పుడు నిర్వచించబడలేదు వాదనగా, డిఫాల్ట్ విలువ ఒకటి ఉంటే ఉపయోగించబడుతుంది.

x(undefined, 3)
// returns 6

5. రెస్ట్ ఫంక్షన్ పారామీటర్లు

ఒక ఫంక్షన్‌ను ప్రారంభించినప్పుడు, కొన్నిసార్లు ఏకపక్ష సంఖ్యలో వాదనలు పాస్ చేయాల్సిన అవసరం ఏర్పడుతుంది మరియు ఈ వాదనలను ఫంక్షన్‌లో ప్రాసెస్ చేయాలి. ఈ అవసరం నిర్వహించబడుతుంది మిగిలిన ఫంక్షన్ పారామితులు వాక్యనిర్మాణం. దిగువ చూపిన వాక్యనిర్మాణాన్ని ఉపయోగించి నిర్వచించిన వాదనల తర్వాత మిగిలిన వాదనలను సంగ్రహించడానికి ఇది ఒక మార్గాన్ని అందిస్తుంది. ఈ అదనపు వాదనలు శ్రేణిలో సంగ్రహించబడ్డాయి.

var x = function(a, b, ...args) { console.log('a = ' + a + ', b = ' + b + ', ' + args.length + ' args left'); }
x(2, 3)
// prints
a = 2, b = 3, 0 args left
x(2, 3, 4, 5)
// prints
a = 2, b = 3, 2 args left

6. స్ట్రింగ్ టెంప్లేటింగ్

స్ట్రింగ్ టెంప్లేటింగ్ అనేది పెర్ల్ లేదా షెల్ వంటి వాక్యనిర్మాణాన్ని ఉపయోగించి స్ట్రింగ్స్‌లోకి వేరియబుల్స్ మరియు ఎక్స్‌ప్రెషన్‌లను ఇంటర్‌పోలేట్ చేయడాన్ని సూచిస్తుంది. స్ట్రింగ్ టెంప్లేట్ బ్యాక్-టిక్ అక్షరాలతో జతచేయబడింది ( ' ). దీనికి విరుద్ధంగా సింగిల్ కోట్స్ ( ' ) లేదా డబుల్ కోట్స్ ( ' ) సాధారణ తీగలను సూచించండి. టెంప్లేట్ లోపల వ్యక్తీకరణలు మధ్య గుర్తించబడ్డాయి $ { మరియు } . ఇక్కడ ఒక ఉదాహరణ:

var name = 'joe';
var x = `hello ${name}`
// returns 'hello joe'

వాస్తవానికి, మూల్యాంకనం కోసం మీరు ఏకపక్ష వ్యక్తీకరణను ఉపయోగించవచ్చు.

// define an arrow function
var f = a => a * 4
// set a parameter value
var v = 5
// and evaluate the function within the string template
var x = `hello ${f(v)}`
// returns 'hello 20'

తీగలను నిర్వచించడానికి ఈ వాక్యనిర్మాణం బహుళ-లైన్ తీగలను నిర్వచించడానికి కూడా ఉపయోగించవచ్చు.

var x = `hello world
next line`
// returns
hello world
next line

7. వస్తువు లక్షణాలు

ES6 సరళీకృత వస్తువు సృష్టి వాక్యనిర్మాణాన్ని తెస్తుంది. దిగువ ఉదాహరణను పరిశీలించండి:

var x = 'hello world', y = 25
var a = { x, y }
// is equivalent to the ES5:
{x: x, y: y}

కంప్యూటెడ్ ఆస్తి పేర్లు కూడా చాలా నిఫ్టీగా ఉన్నాయి. ES5 మరియు అంతకు ముందు, ఆబ్జెక్ట్ ప్రాపర్టీని కంప్యూటెడ్ పేరుతో సెట్ చేయడానికి, మీరు దీన్ని చేయాలి:

var x = 'hello world', y = 25
var a = {x: x, y: y}
a['joe' + y] = 4
// a is now:
{x: 'hello world', y: 25, joe25: 4}

ఇప్పుడు మీరు ఇవన్నీ ఒకే నిర్వచనంలో చేయవచ్చు:

var a = {x, y, ['joe' + y]: 4}
// returns
{x: 'hello world', y: 25, joe25: 4}

వాస్తవానికి, పద్ధతులను నిర్వచించడానికి, మీరు దానిని పేరుతో నిర్వచించవచ్చు:

var a = {x, y, ['joe' + y]: 4, foo(v) { return v + 4 }}
a.foo(2)
// returns
6

8. ఫార్మల్ క్లాస్ డెఫినిషన్ సింటాక్స్

తరగతి నిర్వచనం

చివరగా, జావాస్క్రిప్ట్ అధికారిక క్లాస్ డెఫినిషన్ వాక్యనిర్మాణాన్ని పొందుతుంది. ఇది ఇప్పటికే అందుబాటులో ఉన్న ప్రోటైప్-ఆధారిత తరగతుల కంటే కేవలం వాక్యనిర్మాణ చక్కెర అయితే, ఇది కోడ్ స్పష్టతను పెంచడానికి ఉపయోగపడుతుంది. అంటే ఇది చేస్తుంది కాదు కొత్త ఆబ్జెక్ట్ మోడల్‌ను జోడించండి లేదా అలాంటి ఫాన్సీ ఏదైనా జోడించండి.

class Circle {
constructor(radius) {
this.radius = radius
}
}
// use it
var c = new Circle(4)
// returns: Circle {radius: 4}

డిక్లరింగ్ మెథడ్స్

ఒక పద్ధతిని నిర్వచించడం కూడా చాలా సులభం. అక్కడ ఆశ్చర్యాలు లేవు.

class Circle {
constructor(radius) {
this.radius = radius
}
computeArea() { return Math.PI * this.radius * this.radius }
}
var c = new Circle(4)
c.computeArea()
// returns: 50.26548245743669

గెట్టర్లు మరియు సెట్టర్లు

వాక్యనిర్మాణానికి సరళమైన అప్‌డేట్‌తో ఇప్పుడు మనకు గెట్టర్లు మరియు సెట్టర్లు కూడా ఉన్నాయి. యొక్క పునర్నిర్వచించుకుందాం వృత్తం ఒక తో తరగతి ప్రాంతం ఆస్తి.

class Circle {
constructor(radius) {
this.radius = radius
}
get area() { return Math.PI * this.radius * this.radius }
}
var c = new Circle(4)
// returns: Circle {radius: 4}
c.area
// returns: 50.26548245743669

ఇప్పుడు ఒక సెట్టర్‌ను చేర్చుదాం. నిర్వచించగలగడం వ్యాసార్థం స్థిరపరచదగిన ఆస్తిగా, మేము వాస్తవ క్షేత్రాన్ని పునర్నిర్వచించాలి _ రేడియస్ లేదా సెట్టర్‌తో ఘర్షణ పడనిది. లేకపోతే మేము స్టాక్ ఓవర్‌ఫ్లో ఎర్రర్‌ను ఎదుర్కొంటాము.

ఇక్కడ పునర్నిర్వచించబడిన తరగతి ఉంది:

class Circle {
constructor(radius) {
this._radius = radius
}
get area() { return Math.PI * this._radius * this._radius }
set radius(r) { this._radius = r }
}
var c = new Circle(4)
// returns: Circle {_radius: 4}
c.area
// returns: 50.26548245743669
c.radius = 6
c.area
// returns: 113.09733552923255

మొత్తం మీద, ఇది ఆబ్జెక్ట్-ఓరియెంటెడ్ జావాస్క్రిప్ట్‌కు చక్కని చేర్పు.

వారసత్వం

ఉపయోగించి క్లాసులను నిర్వచించడంతో పాటు తరగతి కీవర్డ్, మీరు కూడా ఉపయోగించవచ్చు విస్తరిస్తుంది సూపర్ క్లాసుల నుండి వారసత్వంగా పొందడానికి కీవర్డ్. ఉదాహరణతో ఇది ఎలా పనిచేస్తుందో చూద్దాం.

class Ellipse {
constructor(width, height) {
this._width = width;
this._height = height;
}
get area() { return Math.PI * this._width * this._height; }
set width(w) { this._width = w; }
set height(h) { this._height = h; }
}
class Circle extends Ellipse {
constructor(radius) {
super(radius, radius);
}
set radius(r) { super.width = r; super.height = r; }
}
// create a circle
var c = new Circle(4)
// returns: Circle {_width: 4, _height: 4}
c.radius = 2
// c is now: Circle {_width: 2, _height: 2}
c.area
// returns: 12.566370614359172
c.radius = 5
c.area
// returns: 78.53981633974483

మరియు అది జావాస్క్రిప్ట్ ES6 యొక్క కొన్ని లక్షణాలకు సంక్షిప్త పరిచయం.

తదుపరి: పరిచయం కావడం కొన్ని ముఖ్యమైన జావాస్క్రిప్ట్ శ్రేణి పద్ధతులు మరియు ఒక వాయిస్ సెన్సిటివ్ రోబోట్ యానిమేషన్ స్క్రిప్ట్! అలాగే, Vue అనే గొప్ప ఫ్రంట్-ఎండ్ ఫ్రేమ్‌వర్క్ గురించి తెలుసుకోండి.

చిత్ర క్రెడిట్: మైక్రోలోజియా/ డిపాజిట్‌ఫోటోలు

షేర్ చేయండి షేర్ చేయండి ట్వీట్ ఇమెయిల్ కానన్ వర్సెస్ నికాన్: ఏ కెమెరా బ్రాండ్ మంచిది?

కెనన్ మరియు నికాన్ కెమెరా పరిశ్రమలో రెండు అతిపెద్ద పేర్లు. అయితే ఏ బ్రాండ్ కెమెరాలు మరియు లెన్స్‌ల మెరుగైన శ్రేణిని అందిస్తుంది?

కోరిందకాయ పై 3 బి వర్సెస్ బి+
తదుపరి చదవండి సంబంధిత అంశాలు
  • ప్రోగ్రామింగ్
  • జావాస్క్రిప్ట్
రచయిత గురుంచి జై శ్రీధర్(17 కథనాలు ప్రచురించబడ్డాయి) జే శ్రీధర్ నుండి మరిన్ని

మా వార్తాలేఖకు సభ్యత్వాన్ని పొందండి

టెక్ చిట్కాలు, సమీక్షలు, ఉచిత ఈబుక్‌లు మరియు ప్రత్యేకమైన డీల్స్ కోసం మా వార్తాలేఖలో చేరండి!

సభ్యత్వం పొందడానికి ఇక్కడ క్లిక్ చేయండి