Merge pull request HackYourFuture#35 from remarcmij/master

mkruijt · web-flow · commit 5b644b4746e4 · 2018-02-08T13:24:39.000+01:00
MAKEME week 7, README Week 1 + prototype chain
diff --git 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)<br>
+- [Basic Data types (Strings, Numbers, Arrays, Booleans)](../fundamentals/values.md)<br>
+- [Operators](../fundamentals/operators.md)<br>
+- [Naming conventions](../fundamentals/naming_conventions.md)
 
 _Please go through the material and come to class prepared!_
 
diff --git 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 = ...`
diff --git 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;
 };
-```
+```
+
