Home-theater-designers
ES6 odkazuje na verziu 6 programovacieho jazyka ECMA Script. ECMA Script je štandardizovaný názov pre JavaScript a verzia 6 je ďalšou verziou po verzii 5, ktorá bola vydaná v roku 2011. Je významným vylepšením jazyka JavaScript a pridáva mnoho ďalších funkcií, ktoré majú uľahčiť rozsiahly vývoj softvéru. .
ECMAScript alebo ES6 bol publikovaný v júni 2015. Následne bol premenovaný na ECMAScript 2015. Podpora webového prehliadača pre celý jazyk ešte nie je dokončená, aj keď sú podporované hlavné časti. Hlavné webové prehliadače podporujú niektoré funkcie ES6. Je však možné použiť softvér známy ako a hráč previesť kód ES6 na ES5, ktorý je lepšie podporovaný vo väčšine prehliadačov.
Pozrime sa teraz na niektoré hlavné zmeny, ktoré ES6 prináša v JavaScripte.
1. Konštanty
Nakoniec sa koncept konštánt dostal do JavaScriptu! Konštanty sú hodnoty, ktoré je možné definovať iba raz (pre rozsah, rozsah vysvetlený nižšie). Opätovná definícia v rámci rovnakého rozsahu vyvolá chybu.
const JOE = 4.0
JOE= 3.5
// results in: Uncaught TypeError: Assignment to constant variable.
Konštantu môžete použiť kdekoľvek, kde môžete použiť premennú ( kde ).
console.log('Value is: ' + joe * 2)
// prints: 8
2. Blokové premenné a funkcie
Vitajte v 21. storočí, JavaScript! Pri ES6 premenné deklarované pomocou nechaj (a konštanty popisujú vyššie) postupujte podľa pravidiel určovania rozsahu blokov rovnako ako v jazykoch Java, C ++ atď. (Ak sa chcete dozvedieť viac, prečítajte si, ako deklarovať premenné v JavaScripte.)
Pred touto aktualizáciou boli premenné v JavaScripte rozsahom funkcie. To znamená, že keď ste potrebovali nový rozsah pre premennú, museli ste ho deklarovať v rámci funkcie.
Premenné uchovávajú hodnotu až do konca bloku. Po bloku sa obnoví hodnota vo vonkajšom bloku (ak existuje).
ako odstrániť používateľov na ps4
{
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
V rámci týchto blokov môžete tiež predefinovať konštanty.
{
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. Šípkové funkcie
ES6 predstavuje šípkové funkcie do JavaScriptu. (Sú podobné tradičným funkciám, ale majú jednoduchšiu syntax.) V nasledujúcom príklade X je funkcia, ktorá prijíma parameter s názvom do , a vráti jeho prírastok:
var x = a => a + 1;
x(4) // returns 5
Pomocou tejto syntaxe môžete ľahko definovať a odovzdávať argumenty vo funkciách.
Použitie s a pre každý() :
[1, 2, 3, 4].forEach(a => console.log(a + ' => ' + a*a))
// prints
1 => 1
2 => 4
3 => 9
4 => 16
Definujte funkcie akceptujúce viacero argumentov tak, že ich uzatvoríte do zátvoriek:
[22, 98, 3, 44, 67].sort((a, b) => a - b)
// returns
[3, 22, 44, 67, 98]
4. Predvolené parametre funkcie
Parametre funkcie je teraz možné deklarovať s predvolenými hodnotami. V nasledujúcom, X je funkcia s dvoma parametrami do a b . Druhý parameter b má predvolenú hodnotu 1 .
var x = (a, b = 1) => a * b
x(2)
// returns 2
x(2, 2)
// returns 4
Na rozdiel od iných jazykov, ako je C ++ alebo python, parametre s predvolenými hodnotami sa môžu objaviť pred tými, ktoré nemajú predvolené hodnoty. Táto funkcia je definovaná ako blok s príponou vrátiť sa hodnota pre ilustráciu.
var x = (a = 2, b) => { return a * b }
Argumenty sa však zhodujú zľava doprava. Pri prvom vyvolaní nižšie b má nedefinované hodnotu napriek tomu do bol deklarovaný s predvolenou hodnotou. Argumentu odovzdania sa vyhovuje do radšej než b . Funkcia sa vráti NaN .
x(2)
// returns NaN
x(1, 3)
// returns 3
Keď výslovne zadáte nedefinované ako argument sa použije predvolená hodnota, ak existuje.
x(undefined, 3)
// returns 6
5. Parametre odpočinkovej funkcie
Pri vyvolávaní funkcie niekedy vyvstane potreba byť schopný odovzdať ľubovoľný počet argumentov a spracovať tieto argumenty vo funkcii. Túto potrebu rieši parametre pokojovej funkcie syntax. Poskytuje spôsob, ako zachytiť ostatné argumenty po definovaných argumentoch pomocou nižšie uvedenej syntaxe. Tieto dodatočné argumenty sú zachytené v poli.
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. Reťazcová šablóna
Reťazcová šablóna označuje interpoláciu premenných a výrazov do reťazcov pomocou syntaxe, ako je perl alebo shell. Šablóna reťazca je uzavretá znakmi so spätným zaškrtnutím ( “ ). Naopak jednoduché úvodzovky ( ' ) alebo dvojité úvodzovky ( ' ) označujú normálne reťazce. Výrazy vo vnútri šablóny sú vyznačené medzi $ { a } . Tu je príklad:
var name = 'joe';
var x = `hello ${name}`
// returns 'hello joe'
Na vyhodnotenie môžete samozrejme použiť ľubovoľný výraz.
// 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'
Túto syntax na definovanie reťazcov je možné použiť aj na definovanie viacriadkových reťazcov.
var x = `hello world
next line`
// returns
hello world
next line
7. Vlastnosti objektu
ES6 prináša zjednodušenú syntax vytvárania objektov. Pozrite sa na nasledujúci príklad:
var x = 'hello world', y = 25
var a = { x, y }
// is equivalent to the ES5:
{x: x, y: y}
Vypočítané názvy nehnuteľností sú tiež šikovné. V ES5 a staršom ste na nastavenie vlastnosti objektu s vypočítaným názvom museli urobiť toto:
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}
Teraz to môžete urobiť všetko v jednej definícii:
var a = {x, y, ['joe' + y]: 4}
// returns
{x: 'hello world', y: 25, joe25: 4}
A samozrejme, aby ste definovali metódy, stačí ich definovať pomocou názvu:
var a = {x, y, ['joe' + y]: 4, foo(v) { return v + 4 }}
a.foo(2)
// returns
6
8. Syntax definície formálnej triedy
Definícia triedy
A nakoniec, JavaScript dostane formálnu syntax definície triedy. Aj keď je to len syntaktický cukor v už dostupných triedach založených na prototypoch, slúži na zvýšenie zrozumiteľnosti kódu. To znamená, že áno nie pridajte nový objektový model alebo čokoľvek podobné.
class Circle {
constructor(radius) {
this.radius = radius
}
}
// use it
var c = new Circle(4)
// returns: Circle {radius: 4}
Deklaračné metódy
Definovanie metódy je tiež celkom jednoduché. Nie sú tam žiadne prekvapenia.
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
Getters and Setters
Teraz máme aj getry a nastavovače s jednoduchou aktualizáciou syntaxe. Predefinujme Kruh trieda s oblasť nehnuteľnosť.
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
Teraz pridáme nastavovač. Vedieť definovať polomer ako nastaviteľnú vlastnosť by sme mali predefinovať skutočné pole na _polomer alebo niečo, čo nie je v rozpore s nastavovačom. V opačnom prípade sa stretneme s chybou pretečenia zásobníka.
Tu je predefinovaná trieda:
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
Celkovo je to pekný doplnok k objektovo orientovanému JavaScriptu.
Dedičnosť
Okrem definovania tried pomocou trieda kľúčové slovo, môžete tiež použiť predlžuje kľúčové slovo dediť zo super tried. Pozrime sa, ako to funguje na príklade.
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
A to bol krátky úvod k niektorým funkciám JavaScriptu ES6.
Ďalej: zoznámenie sa s niekoľko dôležitých metód poľa JavaScript a skriptovanie hlasovo citlivej robotickej animácie! Zoznámte sa tiež s vynikajúcim rozhraním front-end s názvom Vue.
Obrazový kredit: micrologia/ Depositphotos
zdieľam zdieľam Tweet E -mail Canon vs. Nikon: Ktorá značka fotoaparátu je lepšia?Canon a Nikon sú dve najväčšie mená v kamerovom priemysle. Ale ktorá značka ponúka lepšiu radu fotoaparátov a objektívov?
tmavý režim prieskumníka súborov systému Windows 10Čítajte ďalej Súvisiace témy
- Programovanie
- JavaScript
prihlásiť sa ku odberu noviniek
Pripojte sa k nášmu bulletinu a získajte technické tipy, recenzie, bezplatné elektronické knihy a exkluzívne ponuky!
Kliknutím sem sa prihlásite na odber