I denna handledning lär du dig om JavaScript ES6 med hjälp av exempel.
JavaScript ES6 (även känt som ECMAScript 2015 eller ECMAScript 6 ) är den nyare versionen av JavaScript som introducerades 2015.
ECMAScript är standarden som JavaScript-programmeringsspråk använder. ECMAScript innehåller specifikationer för hur JavaScript-programmeringsspråk ska fungera.
Denna handledning ger en kort sammanfattning av vanliga funktioner i ES6 så att du snabbt kan börja i ES6.
JavaScript låta
JavaScript letanvänds för att deklarera variabler. Tidigare deklarerades variabler med hjälp av varnyckelordet.
För att lära dig mer om skillnaden mellan letoch var, besök JavaScript let vs var.
Variablerna som deklareras med letär blockomfattade . Detta betyder att de bara är tillgängliga inom ett visst block. Till exempel,
// 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
Det constuttalandet används för att deklarera konstanter i JavaScript. Till exempel,
// name declared with const cannot be changed const name = 'Sara';
När du har deklarerat kan du inte ändra värdet på en constvariabel.
JavaScript-pilfunktion
I ES6- versionen kan du använda pilfunktioner för att skapa funktionsuttryck. Till exempel
Denna funktion
// function expression let x = function(x, y) ( return x * y; )
kan skrivas som
// function expression using arrow function let x = (x, y) => x * y;
För att lära dig mer om pilfunktioner, besök JavaScript-pilfunktionen.
JavaScript-klasser
JavaScript-klass används för att skapa ett objekt. Klassen liknar en konstruktörsfunktion. Till exempel,
class Person ( constructor(name) ( this.name = name; ) )
Nyckelord classanvänds för att skapa en klass. Egenskaperna tilldelas i en konstruktionsfunktion.
Nu kan du skapa ett objekt. Till exempel,
class Person ( constructor(name) ( this.name = name; ) ) const person1 = new Person('John'); console.log(person1.name); // John
Om du vill lära dig mer om klasser besöker du JavaScript-klasser.
Standardparametervärden
I ES6-versionen kan du skicka standardvärden i funktionsparametrarna. Till exempel,
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
I exemplet ovan, om du inte skickar parametern för y, tar det 5 som standard.
Om du vill lära dig mer om standardparametrar, besök JavaScript-funktionens standardparametrar.
JavaScript-malllitteratur
Mallen bokstavligt har gjort det lättare att inkludera variabler i en sträng. Till exempel innan du var tvungen att göra:
const first_name = "Jack"; const last_name = "Sparrow"; console.log('Hello ' + first_name + ' ' + last_name);
Detta kan uppnås genom att använda bokstavlig mall genom att:
const first_name = "Jack"; const last_name = "Sparrow"; console.log(`Hello $(first_name) $(last_name)`);
Om du vill lära dig mer om mallbokstäver besöker du JavaScript Template Literal.
JavaScript-förstörelse
Destruktureringssyntaxen gör det lättare att tilldela värden till en ny variabel. Till exempel,
// 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
Med hjälp av ES6 Destructuring-syntax kan ovanstående kod skrivas som:
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
För att lära dig mer om destruktion, besök JavaScript Destructuring.
JavaScript-import och export
Du kan exportera en funktion eller ett program och använda den i ett annat program genom att importera den. Detta hjälper till att göra återanvändbara komponenter. Till exempel om du har två JavaScript-filer med namnet contact.js och home.js.
I contact.js fil kan du exportera den contact()funktion:
// export export default function contact(name, age) ( console.log(`The name is $(name). And age is $(age).`); )
När du sedan vill använda contact()funktionen i en annan fil kan du helt enkelt importera funktionen. Till exempel i filen home.js:
import contact from './contact.js'; contact('Sara', 25); // The name is Sara. And age is 25
JavaScript lovar
Löften används för att hantera asynkrona uppgifter. Till exempel,
// 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 ), )
För att lära dig mer om löften, besök JavaScript Promises.
JavaScript Rest Parameter and Spread Operator
Du kan använda restparametern för att representera ett obestämt antal argument som en matris. Till exempel,
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')
Du skickar de återstående argumenten med … syntax. Därför namnet resten parameter .
Du använder spridningssyntaxen för … att kopiera objekten till en enda matris. Till exempel,
let arr1 = ('one', 'two'); let arr2 = (… arr1, 'three', 'four', 'five'); console.log(arr2); // ("one", "two", "three", "four", "five")
Både resten-parametern och spridningsoperatören använder samma syntax. Emellertid används spridningsoperatören med matriser (iterabla värden).
För att lära dig mer om spridningsoperatören, besök JavaScript Spread Operator.
