From a4efa29762949462474f74075256ab0cdef828be Mon Sep 17 00:00:00 2001 From: Jim Cramer Date: Wed, 7 Feb 2018 16:05:55 +0100 Subject: [PATCH 1/3] corrected MAKEME week7 --- Week7/MAKEME.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Week7/MAKEME.md b/Week7/MAKEME.md index 671b5f795..0dc41ef89 100644 --- a/Week7/MAKEME.md +++ b/Week7/MAKEME.md @@ -125,7 +125,7 @@ myMovie.addStar(firstActor); // Make sure that the following actions work. console.log(myMovie.getStars().map(actor => `${actor.getName()} ${actor.getAge()}`)); const director = myMovie.getDirector(); -console.log(`Director: ${director.map(director => `${director.getName()}`)}`); +console.log(`Director: ${director.getName()}`); ``` Fun extra step: If you get bored, template them and make a page by rendering the results in HTML :smile: with something like `document.querySelector('.move').innerHTML = ...` From a77ec6d2b75fc3f01cc2c26a8211e1384897447b Mon Sep 17 00:00:00 2001 From: Jim Cramer Date: Thu, 8 Feb 2018 13:10:40 +0100 Subject: [PATCH 2/3] replaced broken link to review to fundamental topics --- Week1/README.md | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/Week1/README.md b/Week1/README.md index 3b7b15a3f..79b5e30bc 100644 --- a/Week1/README.md +++ b/Week1/README.md @@ -33,7 +33,13 @@ Only watch the below chapters: - The 50 best websites to Learn JavaScript: http://www.codeconquest.com/blog/top-50-websites-to-learn-javascript/ -:star: You can also already go through the [review](/Week2/REVIEW.md) of the upcoming lecture. :star: +:star: You can also already go through the topics of the upcoming lecture. :star: + +- Intro JavaScript (What is it, where can you use it for) +- [Variables (var, let, const)](../fundamentals/variables.md)
+- [Basic Data types (Strings, Numbers, Arrays, Booleans)](../fundamentals/values.md)
+- [Operators](../fundamentals/operators.md)
+- [Naming conventions](../fundamentals/naming_conventions.md) _Please go through the material and come to class prepared!_ From 04d9f200d01813ef99094a1a95b3ad7f4c6c50b5 Mon Sep 17 00:00:00 2001 From: Jim Cramer Date: Thu, 8 Feb 2018 13:11:08 +0100 Subject: [PATCH 3/3] added prototype chain explanation --- fundamentals/oop_classes.md | 35 ++++++++++++++++++++++++++++++++--- 1 file changed, 32 insertions(+), 3 deletions(-) diff --git a/fundamentals/oop_classes.md b/fundamentals/oop_classes.md index 2a3c21b33..40e929409 100644 --- a/fundamentals/oop_classes.md +++ b/fundamentals/oop_classes.md @@ -214,10 +214,38 @@ months ``` -The diagram below depicts how this sharing works out. At this time it is not necessary that you understand every detail. Just note how there is a single copy of functions, shared by all instances of the `Months` objects. - ![prototype](assets/prototype.png) +### Prototype vs __prototype + +The above diagram depicts how this sharing works out. + +The `prototype` property exists on all functions but is only relevant when that function is used as a **constructor function**. By assigning methods to the `prototype` property you are basically defining a ‘prototype’ object that will be shared by all objects created through the constructor function when called in conjunction with the `new` keyword. + +In contrast to `prototype`, the `__proto__` property (in documentation sometimes denoted as `[[proto]]`) is a property that exist on objects created through the constructor function. This `__proto__` property points to the shared ‘prototype’ object, as defined on the constructor function’s `prototype` property. + +The prototype object itself also has a `__proto__` property. In most cases this property points to the prototype of the standard JavaScript `Object` prototype. This is because, ultimately, all objects in JavaScript are prototype-linked to the `Object` prototype. In OOP terms one would say that all JavaScript objects ultimately derive from `Object`. + +The `__proto__` property of the `Object` prototype itself has the value `null`. This signals the end of the prototype chain. + +When you call a method on an object that does not exist on the object itself, the JavaScript engine will 'walk' down the prototype chain until it finds the requested method _or_ until it reaches the end of the chain. + +If the method is found, JavaScript calls the method, setting its `this` value to the object the method was called on. This happens behind the scenes without requiring intervention from the programmer. + +If the method was not found by walking the prototype chain, a run-time error is produced, e.g: + +```js +myObj.someNonExistingMethod(); + +``` + +``` +myObj.someNonExistingMethod(); + ^ + +TypeError: myObj.someNonExistingMethod is not a function +``` + ### ES6 Classes In ES6 a new way of defining objects and its methods was introduced. It uses the same `prototype` mechanism behind the scenes, but its syntax is closer to that of other object-oriented languages, such as Java, etc. Because it is only new syntax, hiding the intricacies of the `prototype`, it is often designated as 'syntactic sugaring'. @@ -312,4 +340,5 @@ Array.prototype.myFilter = function (callback) { } return arr; }; -``` \ No newline at end of file +``` +