Für zukünftige Studenten des Kurses "JavaScript Developer. Basic" wurde eine Übersetzung von nützlichem Material vorbereitet.
Wir laden Sie auch zu einem offenen Webinar zum Thema „Welche Aufgaben testen Ihr JavaScript-Wissen?“ Ein : Nehmen Sie Testfragen aus verschiedenen Systemen entgegen und sehen Sie, worum es bei diesen Fragen geht, was sie testen und was Sie wissen müssen, um sie richtig zu beantworten .
In diesem Artikel möchte ich erklären, dass ein Softwareentwickler, der JavaScript zum Schreiben von Anwendungen verwendet, die Engines verstehen muss, damit der geschriebene Code ordnungsgemäß funktioniert.
Unten sehen Sie eine einzeilige Funktion, die eine Eigenschaft des lastName
übergebenen Arguments zurückgibt . Durch einfaches Hinzufügen einer Eigenschaft zu jedem Objekt erhalten wir einen Leistungsabfall von über 700%!
. JavaScript . , C# Java, "Faustian bargain" (" ". ; . ).
, . , , .
!
. , ?
, , Star Wars ( ). getName . :
(() => { const han = {firstname: "Han", lastname: "Solo"}; const luke = {firstname: "Luke", lastname: "Skywalker"}; const leia = {firstname: "Leia", lastname: "Organa"}; const obi = {firstname: "Obi", lastname: "Wan"}; const yoda = {firstname: "", lastname: "Yoda"}; const people = [ han, luke, leia, obi, yoda, luke, leia, obi ]; const getName = (person) => person.lastname;
console.time("engine"); for(var i = 0; i < 1000 * 1000 * 1000; i++) { getName(people[i & 7]); } console.timeEnd("engine"); })();
Intel i7 4510U 1.2 . . .
(() => { const han = { firstname: "Han", lastname: "Solo", spacecraft: "Falcon"}; const luke = { firstname: "Luke", lastname: "Skywalker", job: "Jedi"}; const leia = { firstname: "Leia", lastname: "Organa", gender: "female"}; const obi = { firstname: "Obi", lastname: "Wan", retired: true}; const yoda = {lastname: "Yoda"};
const people = [ han, luke, leia, obi, yoda, luke, leia, obi];
const getName = (person) => person.lastname;
console.time("engine"); for(var i = 0; i < 1000 * 1000 * 1000; i++) { getName(people[i & 7]); } console.timeEnd("engine");})();
8.5 , 7 , . . ?
.
:
— () , . . Mozilla Firefox Spidermonkey, Microsoft Edge — Chakra/ChakraCore, Apple Safari JavaScriptCore. Google Chrome V8, Node. js. V8 2008 . V8 JavaScript.
, , . .
. , .
, . , , .
— :
.
.
. "Hot Path" (" ") , . .
"Just in Time" JIT (Just-in-time compilation, « »).
, JavaScript C++. , “contextual optimisation” (" ").
Static Types ( ) Runtime ( ): Inline Caching ( )
Inline-, IC, JavaScript. , . , (getter method
) -. .
“” ("type"), . V8 "" ("types"), ECMAScript, . , . , {firstname: "Han", lastname: "Solo"}
, {lastname: "Solo", firstname: "Han"}
.
, . (hard-codes) , .
Inline Caching, . , .
: , firstname
lastname
, . , — p1
. IC, , p1 lastname
.
5 . , yoda
firstname
. , ?
Ducks (Intervening Ducks or Multiple Types)
“duck typing” ( " "), (good code) , . , "lastname", .
. , . IC.
, IC. , "" . , . .
, . IC. . , -. , .
Inline Cache 2 .
IC 5- :
JavaScript
, 5 IC. ?
, 5 . , . (object literals), JavaScript- .
, , null
. , :
(() => { class Person { constructor({ firstname = '', lastname = '', spaceship = '', job = '', gender = '', retired = false } = {}) { Object.assign(this, { firstname, lastname, spaceship, job, gender, retired }); } }
const han = new Person({ firstname: 'Han', lastname: 'Solo', spaceship: 'Falcon' }); const luke = new Person({ firstname: 'Luke', lastname: 'Skywalker', job: 'Jedi' }); const leia = new Person({ firstname: 'Leia', lastname: 'Organa', gender: 'female' }); const obi = new Person({ firstname: 'Obi', lastname: 'Wan', retired: true }); const yoda = new Person({ lastname: 'Yoda' }); const people = [ han, luke, leia, obi, yoda, luke, leia, obi ]; const getName = person => person.lastname; console.time('engine'); for (var i = 0; i < 1000 * 1000 * 1000; i++) { getName(people[i & 7]); } console.timeEnd('engine');})();
, , 1.2 . !
JavaScript- : .
Inline Caching — . , .
Inline .
JavaScript . (Static typed transpilers), TypeScript, IC .
"JavaScript Developer. Basic"
: « JavaScript»