Šioje pamokoje su pavyzdžių pagalba sužinosite apie „JavaScript ES6“.
„JavaScript ES6“ (taip pat žinomas kaip „ ECMAScript 2015“ arba „ ECMAScript 6“ ) yra naujesnė „JavaScript“ versija, kuri buvo pristatyta 2015 m.
„ECMAScript“ yra standartas, kurį naudoja „JavaScript“ programavimo kalba. ECMAScript pateikia specifikaciją, kaip turėtų veikti „JavaScript“ programavimo kalba.
Šioje pamokoje pateikiama trumpa dažniausiai naudojamų ES6 funkcijų santrauka, kad galėtumėte greitai pradėti naudoti ES6.
„JavaScript“ leido
letKintamiesiems deklaruoti naudojama „ JavaScript“ . Anksčiau kintamieji buvo deklaruojami naudojant varraktinį žodį.
Norėdami sužinoti daugiau apie skirtumą tarp letir var, apsilankykite Javaskriptą tegul vs var.
Kintamieji, deklaruojami naudojant, letyra blokuojami . Tai reiškia, kad jie pasiekiami tik tam tikrame kvartale. Pavyzdžiui,
// 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
constTeiginys naudojamas deklaruoti konstantas JavaScript. Pavyzdžiui,
// name declared with const cannot be changed const name = 'Sara';
Deklaravus, jūs negalite pakeisti constkintamojo vertės .
„JavaScript“ rodyklės funkcija
Į ES6 versiją, galite naudoti rodyklių funkcijas sukurti funkcinius išraiškas. Pavyzdžiui,
Ši funkcija
// function expression let x = function(x, y) ( return x * y; )
galima rašyti kaip
// function expression using arrow function let x = (x, y) => x * y;
Norėdami sužinoti daugiau apie rodyklių funkcijas, apsilankykite „JavaScript“ rodyklių funkcija.
„JavaScript“ klasės
Objektui sukurti naudojama „JavaScript“ klasė. Klasė yra panaši į konstruktoriaus funkciją. Pavyzdžiui,
class Person ( constructor(name) ( this.name = name; ) )
Raktažodis classnaudojamas kuriant klasę. Savybės priskiriamos konstruktoriaus funkcijai.
Dabar galite sukurti objektą. Pavyzdžiui,
class Person ( constructor(name) ( this.name = name; ) ) const person1 = new Person('John'); console.log(person1.name); // John
Norėdami sužinoti daugiau apie klases, apsilankykite „JavaScript“ klasės.
Numatytosios parametrų vertės
ES6 versijoje galite perduoti numatytąsias reikšmes funkcijų parametruose. Pavyzdžiui,
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
Ankstesniame pavyzdyje, jei nepateiksite parametro y, pagal numatytuosius nustatymus reikės 5 .
Norėdami sužinoti daugiau apie numatytuosius parametrus, apsilankykite „JavaScript Function Default Parameters“.
„JavaScript“ šablonų literalai
Šablonas literalas palengvino kintamųjų įtraukimą į eilutę. Pavyzdžiui, prieš tai atlikdami:
const first_name = "Jack"; const last_name = "Sparrow"; console.log('Hello ' + first_name + ' ' + last_name);
Tai galima pasiekti naudojant šabloną literal:
const first_name = "Jack"; const last_name = "Sparrow"; console.log(`Hello $(first_name) $(last_name)`);
Norėdami sužinoti daugiau apie šablonų literalus, apsilankykite „JavaScript Template Literal“.
„JavaScript“ pertvarkymas
Suardžius sintaksę, lengviau priskirti reikšmes naujam kintamajam. Pavyzdžiui,
// 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
Naudojant ES6 pertvarkymo sintaksę, aukščiau pateiktą kodą galima parašyti taip:
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
Norėdami sužinoti daugiau apie pertvarkymą, apsilankykite „JavaScript“ pertvarkymas.
„JavaScript“ importas ir eksportas
Galite eksportuoti funkciją ar programą ir naudoti ją kitoje programoje, ją importuodami. Tai padeda pagaminti daugkartinius komponentus. Pvz., Jei turite du „JavaScript“ failus, pavadintus contact.js ir home.js.
Be contact.js failą, galite eksportuoti į contact()funkciją:
// export export default function contact(name, age) ( console.log(`The name is $(name). And age is $(age).`); )
Tada, kai norite naudoti contact()funkciją kitame faile, galite tiesiog importuoti funkciją. Pavyzdžiui, faile home.js:
import contact from './contact.js'; contact('Sara', 25); // The name is Sara. And age is 25
„JavaScript“ pažadai
Pažadai naudojami asinchroninėms užduotims tvarkyti. Pavyzdžiui,
// 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 ), )
Norėdami sužinoti daugiau apie pažadus, apsilankykite „JavaScript Promises“.
„JavaScript“ poilsio parametrų ir sklaidos operatorius
Parametrą „rest“ galite naudoti neapibrėžtam argumentų skaičiui pateikti kaip masyvą. Pavyzdžiui,
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')
Likusius argumentus perduodate naudodamas … sintaksę. Vadinasi, vardo poilsio parametras .
Norėdami nukopijuoti elementus į vieną masyvą, naudojate išplitimo sintaksę … . Pavyzdžiui,
let arr1 = ('one', 'two'); let arr2 = (… arr1, 'three', 'four', 'five'); console.log(arr2); // ("one", "two", "three", "four", "five")
Tiek likusiame parametre, tiek sklaidos operatoriuje naudojama ta pati sintaksė. Tačiau sklaidos operatorius naudojamas su masyvais (iteruojamos vertės).
Norėdami sužinoti daugiau apie paskleidimo operatorių, apsilankykite „JavaScript Spread Operator“.
