Ebben az oktatóanyagban példák segítségével megismerheti a JavaScript ES6-ot.
A JavaScript ES6 (más néven ECMAScript 2015 vagy ECMAScript 6 ) a JavaScript újabb verziója, amelyet 2015-ben vezettek be.
Az ECMAScript az a szabvány, amelyet a JavaScript programozási nyelv használ. Az ECMAScript megadja a JavaScript programozási nyelv működésének specifikációját.
Ez az oktatóanyag röviden összefoglalja az ES6 általánosan használt szolgáltatásait, hogy gyorsan elindulhasson az ES6-ban.
JavaScript let
A JavaScriptet let
a változók deklarálásához használják. Korábban a változókat a var
kulcsszóval deklaráltuk .
Ha többet szeretne megtudni a let
és közötti különbségről var
, látogasson el a JavaScript let vs var oldalra.
A deklarált változók használatával let
a blokk hatókörrel . Ez azt jelenti, hogy csak egy adott blokkon belül érhetők el. Például,
// variable declared using let let name = 'Sara'; ( // can be accessed only inside let name = 'Peter'; console.log(name); // Peter ) console.log(name); // Sara
JavaScript konst
Az const
utasítás segítségével konstansokat deklarálhatunk JavaScript-ben. Például,
// name declared with const cannot be changed const name = 'Sara';
A deklarálás után nem változtathatja meg a const
változó értékét .
JavaScript nyíl funkció
Az ES6 verzióban nyílfüggvényekkel hozhat létre funkciókifejezéseket. Például:
Ez a funkció
// function expression let x = function(x, y) ( return x * y; )
úgy írható
// function expression using arrow function let x = (x, y) => x * y;
Ha többet szeretne megtudni a nyílfunkciókról, látogasson el a JavaScript nyílfüggvényre.
JavaScript osztályok
A JavaScript osztály egy objektum létrehozására szolgál. Az osztály hasonló a konstruktor függvényéhez. Például,
class Person ( constructor(name) ( this.name = name; ) )
A kulcsszó class
egy osztály létrehozására szolgál. A tulajdonságok egy konstruktor függvényben vannak hozzárendelve.
Most létrehozhat egy objektumot. Például,
class Person ( constructor(name) ( this.name = name; ) ) const person1 = new Person('John'); console.log(person1.name); // John
Ha többet szeretne megtudni az osztályokról, látogasson el a JavaScript osztályok oldalra.
Alapértelmezett paraméterértékek
Az ES6 verzióban átadhatja az alapértelmezett értékeket a függvényparaméterekben. Például,
function sum(x, y = 5) ( // take sum // the value of y is 5 if not passed console.log(x + y); ) sum(5); // 10 sum(5, 15); // 20
A fenti példában, ha nem adja át a paramétert a (z) számára y
, akkor alapértelmezés szerint 5 lesz .
Ha többet szeretne megtudni az alapértelmezett paraméterekről, látogasson el a JavaScript Function Default Parameters oldalára.
JavaScript Template Literals
A literal sablon megkönnyítette a változók belefoglalását egy karakterláncba. Például, mielőtt meg kellett tennie:
const first_name = "Jack"; const last_name = "Sparrow"; console.log('Hello ' + first_name + ' ' + last_name);
Ez a literal sablon használatával érhető el:
const first_name = "Jack"; const last_name = "Sparrow"; console.log(`Hello $(first_name) $(last_name)`);
Ha többet szeretne megtudni a sablon literálokról, látogasson el a JavaScript Template Literal oldalra.
JavaScript szerkezetátalakítása
A romboló szintaxis megkönnyíti az értékek hozzárendelését egy új változóhoz. Például,
// before you would do something like this const person = ( name: 'Sara', age: 25, gender: 'female' ) let name = person.name; let age = person.age; let gender = person.gender; console.log(name); // Sara console.log(age); // 25 console.log(gender); // female
Az ES6 Destructure szintaxisának használatával a fenti kód a következőképpen írható fel:
const person = ( name: 'Sara', age: 25, gender: 'female' ) let ( name, age, gender ) = person; console.log(name); // Sara console.log(age); // 25 console.log(gender); // female
Ha többet szeretne megtudni a szerkezetátalakításról, látogasson el a JavaScript-átalakítás oldalra.
JavaScript importálása és exportálása
Exportálhat egy függvényt vagy programot, és importálva használhatja azt egy másik programban. Ez segít újrafelhasználható alkatrészek előállításában. Például, ha két JavaScript-fájlja van, amelyek neve contact.js és home.js.
A contact.js fájlban exportálhatja a contact()
függvényt:
// export export default function contact(name, age) ( console.log(`The name is $(name). And age is $(age).`); )
Aztán amikor contact()
egy másik fájlban szeretné használni a függvényt, egyszerűen importálja a függvényt. Például a home.js fájlban:
import contact from './contact.js'; contact('Sara', 25); // The name is Sara. And age is 25
JavaScript ígéretek
Az ígéreteket aszinkron feladatok kezelésére használják. Például,
// returns a promise let countValue = new Promise(function (resolve, reject) ( reject('Promise rejected'); )); // executes when promise is resolved successfully countValue.then( function successValue(result) ( console.log(result); // Promise resolved ), )
Ha többet szeretne megtudni az ígéretekről, látogasson el a JavaScript ígéretek oldalára.
JavaScript Rest Parameter and Spread Operator
A többi paraméterrel határozatlan számú argumentumot lehet ábrázolni tömbként. Például,
function show(a, b,… args) ( console.log(a); // one console.log(b); // two console.log(args); // ("three", "four", "five", "six") ) show('one', 'two', 'three', 'four', 'five', 'six')
A fennmaradó argumentumokat …
szintaxissal adja át . Ezért a név rest paraméter .
Az elosztott szintaxist használja az …
elemek egyetlen tömbbe másolásához. Például,
let arr1 = ('one', 'two'); let arr2 = (… arr1, 'three', 'four', 'five'); console.log(arr2); // ("one", "two", "three", "four", "five")
A többi paraméter és a spread operátor is ugyanazt a szintaxist használja. A spread operátort azonban tömbökkel (iterálható értékek) használják.
Ha többet szeretne megtudni a spread operátorról, látogasson el a JavaScript Spread Operator oldalra.