JavaScript Σφαιρικές Λειτουργίες

Οι συναρτήσεις κλειδιού εισήχθησαν στην ES6.

Οι συναρτήσεις κλειδιού μας επιτρέπουν να γράψουμε πιο σύντομες συναρτήσεις:

Γλώσσα:

let myFunction = (a, b) => a * b;

Δοκιμάστε το προσωπικά

Πριν:

hello = function() {
  return "Hello World!";
}

Δοκιμάστε το προσωπικά

Μετά τη χρήση των συναρτήσεων κλειδιού:

hello = () => {
  return "Hello World!";
}

Δοκιμάστε το προσωπικά

Πραγματικά γίνεται πιο σύντομη! Αν η συνάρτηση έχει μόνο μια εντολή και αυτή επιστρέφει μια τιμή, μπορείτε να αφαιρέσετε τα κουτί και return Κλειδί:

Προεπιλεγμένη επιστροφή της συνάρτησης κλειδιού:

hello = () => "Hello World!";

Δοκιμάστε το προσωπικά

Σημείωση:Αυτό ισχύει μόνο όταν η συνάρτηση έχει μόνο μια εντολή.

Αν έχετε παραμέτρους, τις μεταφέρετε μέσα στο κουτί:

Συναρτήσεις κλειδιού με παράμετρο:

hello = (val) => "Hello " + val;

Δοκιμάστε το προσωπικά

Επιτέλους, αν υπάρχει μόνο ένας παράμετρος, μπορείτε επίσης να παραλείψετε τα κουτί:

Συναρτήσεις κλειδιού χωρίς κουτί:

hello = val => "Hello " + val;

Δοκιμάστε το προσωπικά

αυτό Τι να κάνουμε;

Στις συναρτήσεις κλειδιού, αυτό υποχρεώσεις επίσης.

Συνοψίζοντας, η χρήση των συναρτήσεων κλειδιού δεν έχει επηρεάσει τη αυτό είναι δεσμευμένο.

Στις κοινές συναρτήσεις, το κλειδί αυτό το αντικείμενο που καλεί τη συνάρτηση, μπορεί να είναι το παράθυρο, το έγγραφο, το κουμπί ή οποιοδήποτε άλλο.

Για τις συναρτήσεις κλειδιού,αυτό Το κλειδί είναι πάντα το αντικείμενο που ορίζει τη συνάρτηση κλειδιού.

Ας δούμε δύο παραδείγματα για να κατανοήσουμε τις διαφορές.

Αυτές οι δύο παραδείγματα καλέστηκαν δύο φορές, πρώτη φορά κατά την φόρτωση της σελίδας, δεύτερη φορά όταν ο χρήστης κάνει κλικ στο κουμπί.

Η πρώτη παράδειγμα χρησιμοποιεί κοινές συναρτήσεις, η δεύτερη παράδειγμα χρησιμοποιεί συναρτήσεις κλειδιού.

Το αποτέλεσμα δείχνει ότι η πρώτη παράδειγμα επιστρέφει δύο διαφορετικά αντικείμενα (window και button), η δεύτερη παράδειγμα επιστρέφει δύο φορές το window αντικείμενο, επειδή το window αντικείμενο είναι ο 'ιδιοκτήτης' της συνάρτησης.

παράδειγμα

Για τις κοινές συναρτήσεις, το this δείχνει το αντικείμενο που καλεί τη συνάρτηση:

// Κοινές συναρτήσεις:
hello = function() {
  document.getElementById("demo").innerHTML += this;
}
// Καλέστε τη συνάρτηση από το αντικείμενο window:
window.addEventListener("load", hello);
// Καλέστε τη συνάρτηση από το αντικείμενο button:
document.getElementById("btn").addEventListener("click", hello);

Δοκιμάστε το προσωπικά

παράδειγμα

χρησιμοποιώντας τις συναρτήσεις κλειδιού αυτό Παρουσιάζει τον ιδιοκτήτη της συνάρτησης:

// Δείκτης συνάρτησης:
hello = () => {
  document.getElementById("demo").innerHTML += this;
}
// Καλέστε τη συνάρτηση από το αντικείμενο window:
window.addEventListener("load", hello);
// Καλέστε τη συνάρτηση από το αντικείμενο button:
document.getElementById("btn").addEventListener("click", hello);

Δοκιμάστε το προσωπικά

Μπορείτε να θυμάστε αυτές τις διαφορές όταν χρησιμοποιείτε συναρτήσεις. Συνήθως, η συμπεριφορά της κανονικής συνάρτησης είναι ακριβώς αυτό που θέλετε, αν δεν είναι, χρησιμοποιήστε τις δείκτες συνάρτησης.

Υποστήριξη προγράμματος περιήγησης

Η παρακάτω τραπεζοθήκη αναφέρει την πρώτη έκδοση του προγράμματος περιήγησης που υποστηρίζει πλήρως τις δείκτες JavaScript:

Chrome IE Firefox Safari Opera
Chrome 45 Edge 12 Firefox 22 Safari 10 Opera 32
Σεπτέμβριος 2015 Ιούλιος 2015 Μάιος 2013 Σεπτέμβριος 2016 Σεπτέμβριος 2015