Σε αυτό το σεμινάριο, θα μάθετε για το JavaScript ES6 με τη βοήθεια παραδειγμάτων.
Το JavaScript ES6 (επίσης γνωστό ως ECMAScript 2015 ή ECMAScript 6 ) είναι η νεότερη έκδοση του JavaScript που παρουσιάστηκε το 2015.
Το ECMAScript είναι το πρότυπο που χρησιμοποιεί η γλώσσα προγραμματισμού JavaScript. Το ECMAScript παρέχει τις προδιαγραφές σχετικά με τον τρόπο λειτουργίας της γλώσσας προγραμματισμού JavaScript.
Αυτό το σεμινάριο παρέχει μια σύντομη περίληψη των κοινά χρησιμοποιούμενων λειτουργιών του ES6, ώστε να μπορείτε να ξεκινήσετε γρήγορα στο ES6
Αφήστε το JavaScript
Το JavaScript let
χρησιμοποιείται για να δηλώσει μεταβλητές. Προηγουμένως, οι μεταβλητές είχαν δηλωθεί χρησιμοποιώντας τη var
λέξη-κλειδί.
Για να μάθετε περισσότερα σχετικά με τη διαφορά μεταξύ let
και var
, επισκεφθείτε το JavaScript let vs var.
Οι μεταβλητές που δηλώνονται με χρήση let
είναι αποκλεισμένες . Αυτό σημαίνει ότι είναι προσβάσιμα μόνο σε ένα συγκεκριμένο μπλοκ. Για παράδειγμα,
// variable declared using let let name = 'Sara'; ( // can be accessed only inside let name = 'Peter'; console.log(name); // Peter ) console.log(name); // Sara
Συν. JavaScript
Η const
δήλωση χρησιμοποιείται για να δηλώσει σταθερές σε JavaScript. Για παράδειγμα,
// name declared with const cannot be changed const name = 'Sara';
Μόλις δηλωθεί, δεν μπορείτε να αλλάξετε την τιμή μιας const
μεταβλητής.
Λειτουργία βέλους JavaScript
Στην έκδοση ES6 , μπορείτε να χρησιμοποιήσετε τις λειτουργίες βέλους για να δημιουργήσετε εκφράσεις συναρτήσεων. Για παράδειγμα,
Αυτή η λειτουργία
// function expression let x = function(x, y) ( return x * y; )
μπορεί να γραφτεί ως
// function expression using arrow function let x = (x, y) => x * y;
Για να μάθετε περισσότερα σχετικά με τις λειτουργίες βέλους, επισκεφθείτε τη λειτουργία JavaScript Arrow Function.
Μαθήματα JavaScript
Η κλάση JavaScript χρησιμοποιείται για τη δημιουργία ενός αντικειμένου. Η τάξη είναι παρόμοια με μια συνάρτηση κατασκευαστή. Για παράδειγμα,
class Person ( constructor(name) ( this.name = name; ) )
Η λέξη-κλειδί class
χρησιμοποιείται για τη δημιουργία τάξης. Οι ιδιότητες εκχωρούνται σε συνάρτηση κατασκευαστή.
Τώρα μπορείτε να δημιουργήσετε ένα αντικείμενο. Για παράδειγμα,
class Person ( constructor(name) ( this.name = name; ) ) const person1 = new Person('John'); console.log(person1.name); // John
Για να μάθετε περισσότερα σχετικά με τα μαθήματα, επισκεφθείτε τα μαθήματα JavaScript.
Προεπιλεγμένες τιμές παραμέτρων
Στην έκδοση ES6, μπορείτε να μεταβιβάσετε τις προεπιλεγμένες τιμές στις παραμέτρους της συνάρτησης. Για παράδειγμα,
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
Στο παραπάνω παράδειγμα, εάν δεν περάσετε την παράμετρο για y
, θα χρειαστούν 5 από προεπιλογή.
Για να μάθετε περισσότερα σχετικά με τις προεπιλεγμένες παραμέτρους, επισκεφθείτε τις Προεπιλεγμένες παράμετροι της Λειτουργίας JavaScript.
Λογοτεχνία προτύπων JavaScript
Το πρότυπο literal διευκόλυνε τη συμπερίληψη μεταβλητών μέσα σε μια συμβολοσειρά. Για παράδειγμα, πριν να κάνετε:
const first_name = "Jack"; const last_name = "Sparrow"; console.log('Hello ' + first_name + ' ' + last_name);
Αυτό μπορεί να επιτευχθεί χρησιμοποιώντας το πρότυπο κυριολεκτικά με:
const first_name = "Jack"; const last_name = "Sparrow"; console.log(`Hello $(first_name) $(last_name)`);
Για να μάθετε περισσότερα σχετικά με τις κυριολεκτικές προτάσεις, επισκεφτείτε το Πρότυπο βιβλιογραφίας JavaScript
Καταστροφή JavaScript
Η σύνταξη καταστροφής διευκολύνει την εκχώρηση τιμών σε μια νέα μεταβλητή. Για παράδειγμα,
// 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
Χρησιμοποιώντας τη σύνταξη ES6 Destructuring, ο παραπάνω κώδικας μπορεί να γραφτεί ως:
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
Για να μάθετε περισσότερα σχετικά με την καταστροφή, επισκεφθείτε το JavaScript Destructuring.
Εισαγωγή και εξαγωγή JavaScript
Θα μπορούσατε να εξαγάγετε μια συνάρτηση ή ένα πρόγραμμα και να το χρησιμοποιήσετε σε άλλο πρόγραμμα εισάγοντάς το. Αυτό βοηθά στην κατασκευή επαναχρησιμοποιήσιμων εξαρτημάτων. Για παράδειγμα, εάν έχετε δύο αρχεία JavaScript που ονομάζονται contact.js και home.js.
Στο αρχείο contact.js, μπορείτε να εξαγάγετε τη contact()
συνάρτηση:
// export export default function contact(name, age) ( console.log(`The name is $(name). And age is $(age).`); )
Στη συνέχεια, όταν θέλετε να χρησιμοποιήσετε τη contact()
συνάρτηση σε άλλο αρχείο, μπορείτε απλά να εισαγάγετε τη συνάρτηση. Για παράδειγμα, στο αρχείο home.js:
import contact from './contact.js'; contact('Sara', 25); // The name is Sara. And age is 25
Υποσχέσεις JavaScript
Οι υποσχέσεις χρησιμοποιούνται για τον χειρισμό ασύγχρονων εργασιών. Για παράδειγμα,
// 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 ), )
Για να μάθετε περισσότερα σχετικά με τις υποσχέσεις, επισκεφθείτε το JavaScript Promises
Παράμετρος ανάπαυσης JavaScript και Spread Operator
Μπορείτε να χρησιμοποιήσετε την παράμετρο υπόλοιπο για να αντιπροσωπεύσετε έναν αόριστο αριθμό ορισμάτων ως πίνακας. Για παράδειγμα,
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')
Περνάτε τα υπόλοιπα ορίσματα χρησιμοποιώντας …
σύνταξη. Ως εκ τούτου, η παράμετρος υπόλοιπου ονόματος .
Χρησιμοποιείτε τη σύνταξη spread …
για να αντιγράψετε τα στοιχεία σε έναν μόνο πίνακα. Για παράδειγμα,
let arr1 = ('one', 'two'); let arr2 = (… arr1, 'three', 'four', 'five'); console.log(arr2); // ("one", "two", "three", "four", "five")
Τόσο η παράμετρος υπολοίπου όσο και ο τελεστής spread χρησιμοποιούν την ίδια σύνταξη. Ωστόσο, ο τελεστής spread χρησιμοποιείται με συστοιχίες (επαναλαμβανόμενες τιμές).
Για να μάθετε περισσότερα σχετικά με το χειριστή spread, επισκεφθείτε το JavaScript Spread Operator.