jeena/en.javascript.info
1
0
Fork 0
Code Issues Pull requests Projects Packages Wiki Activity Actions

images to svg

Browse source
This commit is contained in:
Ilya Kantor 2019-07-28 15:42:37 +03:00
parent a31e881856
commit 3ba28aa104
734 changed files with 11682 additions and 245 deletions
Download patch file Download diff file Expand all files Collapse all files

14
1-js/08-prototypes/01-prototype-inheritance/article.md
View file

@ -10,7 +10,7 @@ For instance, we have a `user` object with its properties and methods, and want
In JavaScript, objects have a special hidden property `[[Prototype]]` (as named in the specification), that is either `null` or references another object. That object is called "a prototype":
![prototype](object-prototype-empty.png)
![prototype](object-prototype-empty.svg)
The prototype is a little bit "magical". When we want to read a property from `object`, and it's missing, JavaScript automatically takes it from the prototype. In programming, such thing is called "prototypal inheritance". Many cool language features and programming techniques are based on it.
@ -66,7 +66,7 @@ Here the line `(*)` sets `animal` to be a prototype of `rabbit`.
Then, when `alert` tries to read property `rabbit.eats` `(**)`, it's not in `rabbit`, so JavaScript follows the `[[Prototype]]` reference and finds it in `animal` (look from the bottom up):
![](proto-animal-rabbit.png)
![](proto-animal-rabbit.svg)
Here we can say that "`animal` is the prototype of `rabbit`" or "`rabbit` prototypically inherits from `animal`".
@ -97,7 +97,7 @@ rabbit.walk(); // Animal walk
The method is automatically taken from the prototype, like this:
![](proto-animal-rabbit-walk.png)
![](proto-animal-rabbit-walk.svg)
The prototype chain can be longer:
@ -129,7 +129,7 @@ longEar.walk(); // Animal walk
alert(longEar.jumps); // true (from rabbit)
```
![](proto-animal-rabbit-chain.png)
![](proto-animal-rabbit-chain.svg)
There are actually only two limitations:
@ -169,7 +169,7 @@ rabbit.walk(); // Rabbit! Bounce-bounce!
From now on, `rabbit.walk()` call finds the method immediately in the object and executes it, without using the prototype:
![](proto-animal-rabbit-walk-2.png)
![](proto-animal-rabbit-walk-2.svg)
That's for data properties only, not for accessors. If a property is a getter/setter, then it behaves like a function: getters/setters are looked up in the prototype.
@ -245,7 +245,7 @@ alert(animal.isSleeping); // undefined (no such property in the prototype)
The resulting picture:
![](proto-animal-rabbit-walk-3.png)
![](proto-animal-rabbit-walk-3.svg)
If we had other objects like `bird`, `snake` etc inheriting from `animal`, they would also gain access to methods of `animal`. But `this` in each method would be the corresponding object, evaluated at the call-time (before dot), not `animal`. So when we write data into `this`, it is stored into these objects.
@ -305,7 +305,7 @@ for(let prop in rabbit) {
Here we have the following inheritance chain: `rabbit` inherits from `animal`, that inherits from `Object.prototype` (because `animal` is a literal object `{...}`, so it's by default), and then `null` above it:
![](rabbit-animal-object.png)
![](rabbit-animal-object.svg)
Note, there's one funny thing. Where is the method `rabbit.hasOwnProperty` coming from? We did not define it. Looking at the chain we can see that the method is provided by `Object.prototype.hasOwnProperty`. In other words, it's inherited.

BIN
1-js/08-prototypes/01-prototype-inheritance/object-prototype-empty.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 6.4 KiB

22
1-js/08-prototypes/01-prototype-inheritance/object-prototype-empty.svg Normal file
View file

@ -0,0 +1,22 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="191px" height="150px" viewBox="0 0 191 150" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>object-prototype-empty.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="object-prototype-empty.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="23" width="118" height="28"></rect>
<text id="prototype-object" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="12" y="15">prototype object</tspan>
</text>
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="111" width="118" height="28"></rect>
<text id="object" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="13" y="103">object</tspan>
</text>
<path id="Line" d="M74.5,74.5 L74.5,102.5 L72.5,102.5 L72.5,74.5 L66.5,74.5 L73.5,60.5 L80.5,74.5 L74.5,74.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="83" y="82">[[Prototype]]</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
1-js/08-prototypes/01-prototype-inheritance/object-prototype-empty@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 15 KiB

BIN
1-js/08-prototypes/01-prototype-inheritance/proto-animal-rabbit-chain.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 14 KiB

40
1-js/08-prototypes/01-prototype-inheritance/proto-animal-rabbit-chain.svg Normal file
View file

@ -0,0 +1,40 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="206px" height="258px" viewBox="0 0 206 258" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>proto-animal-rabbit-chain.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="proto-animal-rabbit-chain.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="23" width="134" height="48"></rect>
<text id="eats:-true" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="24" y="42">eats: true</tspan>
<tspan x="24" y="57">walk: function</tspan>
</text>
<text id="animal" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="13" y="15">animal</tspan>
</text>
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="134" width="134" height="28"></rect>
<text id="jumps:-true" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="24" y="151">jumps: true</tspan>
</text>
<text id="rabbit" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="13" y="126">rabbit</tspan>
</text>
<path id="Line" d="M79.5,97.5 L79.5,125.5 L77.5,125.5 L77.5,97.5 L71.5,97.5 L78.5,83.5 L85.5,97.5 L79.5,97.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="88" y="105">[[Prototype]]</tspan>
</text>
<rect id="Rectangle-1-Copy" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="227" width="134" height="28"></rect>
<text id="earLength:-10" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="24" y="244">earLength: 10</tspan>
</text>
<text id="longEar" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="13" y="219">longEar</tspan>
</text>
<path id="Line-Copy" d="M79.5,190.5 L79.5,218.5 L77.5,218.5 L77.5,190.5 L71.5,190.5 L78.5,176.5 L85.5,190.5 L79.5,190.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]-Copy" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="88" y="198">[[Prototype]]</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.9 KiB

BIN
1-js/08-prototypes/01-prototype-inheritance/proto-animal-rabbit-chain@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 34 KiB

BIN
1-js/08-prototypes/01-prototype-inheritance/proto-animal-rabbit-walk-2.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 9.4 KiB

29
1-js/08-prototypes/01-prototype-inheritance/proto-animal-rabbit-walk-2.svg Normal file
View file

@ -0,0 +1,29 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="202px" height="173px" viewBox="0 0 202 173" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>proto-animal-rabbit-walk-2.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="proto-animal-rabbit-walk-2.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="23" width="136" height="48"></rect>
<text id="eats:-true" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="24" y="42">eats: true</tspan>
<tspan x="24" y="57">walk: function</tspan>
</text>
<text id="animal" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="13" y="15">animal</tspan>
</text>
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="134" width="136" height="28"></rect>
<text id="walk:-function" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold" fill="#EC6B4E">
<tspan x="24" y="152">walk: function</tspan>
</text>
<text id="rabbit" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="18" y="126">rabbit</tspan>
</text>
<path id="Line" d="M79.5,97.5 L79.5,125.5 L77.5,125.5 L77.5,97.5 L71.5,97.5 L78.5,83.5 L85.5,97.5 L79.5,97.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="88" y="105">[[Prototype]]</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2 KiB

BIN
1-js/08-prototypes/01-prototype-inheritance/proto-animal-rabbit-walk-2@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 22 KiB

BIN
1-js/08-prototypes/01-prototype-inheritance/proto-animal-rabbit-walk-3.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 13 KiB

30
1-js/08-prototypes/01-prototype-inheritance/proto-animal-rabbit-walk-3.svg Normal file
View file

@ -0,0 +1,30 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="206px" height="190px" viewBox="0 0 206 190" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>proto-animal-rabbit-walk-3.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="proto-animal-rabbit-walk-3.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="7" y="23" width="190" height="48"></rect>
<text id="walk:-function" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="24" y="42">walk: function</tspan>
<tspan x="24" y="57">sleep: function</tspan>
</text>
<text id="animal" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="8" y="15">animal</tspan>
</text>
<text id="rabbit" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="8" y="126">rabbit</tspan>
</text>
<path id="Line" d="M79.5,97.5 L79.5,125.5 L77.5,125.5 L77.5,97.5 L71.5,97.5 L78.5,83.5 L85.5,97.5 L79.5,97.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="88" y="105">[[Prototype]]</tspan>
</text>
<rect id="Rectangle-1-Copy" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="7" y="138" width="190" height="48"></rect>
<text id="name:-&quot;White-Rabbit&quot;" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal">
<tspan x="20" y="157" fill="#8A704D">name: "White Rabbit"</tspan>
<tspan x="20" y="172" font-family="PTMono-Bold, PT Mono" font-weight="bold" fill="#EC6B4E">isSleeping: true</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
1-js/08-prototypes/01-prototype-inheritance/proto-animal-rabbit-walk-3@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 29 KiB

BIN
1-js/08-prototypes/01-prototype-inheritance/proto-animal-rabbit-walk.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 9.3 KiB

29
1-js/08-prototypes/01-prototype-inheritance/proto-animal-rabbit-walk.svg Normal file
View file

@ -0,0 +1,29 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="205px" height="173px" viewBox="0 0 205 173" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>proto-animal-rabbit-walk.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="proto-animal-rabbit-walk.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="23" width="135" height="48"></rect>
<text id="eats:-true" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal">
<tspan x="24" y="42" fill="#8A704D">eats: true</tspan>
<tspan x="24" y="57" font-family="PTMono-Bold, PT Mono" font-weight="bold" fill="#EC6B4E">walk: function</tspan>
</text>
<text id="animal" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="13" y="15">animal</tspan>
</text>
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="135" width="135" height="28"></rect>
<text id="jumps:-true" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="24" y="152">jumps: true</tspan>
</text>
<text id="rabbit" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="18" y="127">rabbit</tspan>
</text>
<path id="Line" d="M79.5,98.5 L79.5,126.5 L77.5,126.5 L77.5,98.5 L71.5,98.5 L78.5,84.5 L85.5,98.5 L79.5,98.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="88" y="106">[[Prototype]]</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2 KiB

BIN
1-js/08-prototypes/01-prototype-inheritance/proto-animal-rabbit-walk@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 22 KiB

BIN
1-js/08-prototypes/01-prototype-inheritance/proto-animal-rabbit.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 7.5 KiB

28
1-js/08-prototypes/01-prototype-inheritance/proto-animal-rabbit.svg Normal file
View file

@ -0,0 +1,28 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="191px" height="150px" viewBox="0 0 191 150" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>proto-animal-rabbit.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="proto-animal-rabbit.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="23" width="118" height="28"></rect>
<text id="eats:-true" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="24" y="40">eats: true</tspan>
</text>
<text id="animal" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="13" y="15">animal</tspan>
</text>
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="111" width="118" height="28"></rect>
<text id="jumps:-true" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="24" y="128">jumps: true</tspan>
</text>
<text id="rabbit" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="13" y="103">rabbit</tspan>
</text>
<path id="Line" d="M74.5,74.5 L74.5,102.5 L72.5,102.5 L72.5,74.5 L66.5,74.5 L73.5,60.5 L80.5,74.5 L74.5,74.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="83" y="82">[[Prototype]]</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
1-js/08-prototypes/01-prototype-inheritance/proto-animal-rabbit@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 18 KiB

BIN
1-js/08-prototypes/01-prototype-inheritance/proto-user-admin.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 13 KiB

32
1-js/08-prototypes/01-prototype-inheritance/proto-user-admin.svg Normal file
View file

@ -0,0 +1,32 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="233px" height="249px" viewBox="0 0 233 249" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>proto-user-admin.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="proto-user-admin.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="23" width="201" height="71"></rect>
<text id="name:-&quot;John&quot;" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="24" y="45">name: "John"</tspan>
<tspan x="24" y="60">surname: "Smith"</tspan>
<tspan x="24" y="75">set fullName: function</tspan>
</text>
<rect id="Rectangle-1-Copy" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="164" width="201" height="71"></rect>
<text id="isAdmin:-true" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="24" y="186">isAdmin: true</tspan>
<tspan x="24" y="201">name: "Alice"</tspan>
<tspan x="24" y="216">surname: "Cooper"</tspan>
</text>
<text id="user" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="19" y="15">user</tspan>
</text>
<text id="admin" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="18" y="153">admin</tspan>
</text>
<path id="Line" d="M107.5,124.5 L107.5,152.5 L105.5,152.5 L105.5,124.5 L99.5,124.5 L106.5,110.5 L113.5,124.5 L107.5,124.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="116" y="132">[[Prototype]]</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.2 KiB

BIN
1-js/08-prototypes/01-prototype-inheritance/proto-user-admin@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 35 KiB

BIN
1-js/08-prototypes/01-prototype-inheritance/rabbit-animal-object.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 20 KiB

48
1-js/08-prototypes/01-prototype-inheritance/rabbit-animal-object.svg Normal file
View file

@ -0,0 +1,48 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="233px" height="344px" viewBox="0 0 233 344" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>rabbit-animal-object.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="rabbit-animal-object.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="96" width="218" height="58"></rect>
<text id="toString:-function" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="24" y="113">toString: function</tspan>
<tspan x="24" y="128">hasOwnProperty: function</tspan>
<tspan x="24" y="143">...</tspan>
</text>
<text id="Object.prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="13" y="88">Object.prototype</tspan>
</text>
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="213" width="218" height="28"></rect>
<text id="animal" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="13" y="205">animal</tspan>
</text>
<path id="Line" d="M74.5,176.5 L74.5,204.5 L72.5,204.5 L72.5,176.5 L66.5,176.5 L73.5,162.5 L80.5,176.5 L74.5,176.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="83" y="184">[[Prototype]]</tspan>
</text>
<text id="[[Prototype]]-Copy" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="83" y="274">[[Prototype]]</tspan>
</text>
<path id="Line-2" d="M74.5,44.5 L74.5,72.5 L72.5,72.5 L72.5,44.5 L66.5,44.5 L73.5,30.5 L80.5,44.5 L74.5,44.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="83" y="52">[[Prototype]]</tspan>
</text>
<text id="null" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="59" y="19">null</tspan>
</text>
<text id="eats:-true" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="24" y="231">eats: true</tspan>
</text>
<rect id="Rectangle-1-Copy" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="302" width="218" height="28"></rect>
<text id="rabbit-copy" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="13" y="294">rabbit</tspan>
</text>
<path id="Line-Copy" d="M74.5,265.5 L74.5,293.5 L72.5,293.5 L72.5,265.5 L66.5,265.5 L73.5,251.5 L80.5,265.5 L74.5,265.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="jumps:-true" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="24" y="320">jumps: true</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3.5 KiB

BIN
1-js/08-prototypes/01-prototype-inheritance/rabbit-animal-object@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 48 KiB

6
1-js/08-prototypes/02-function-prototype/article.md
View file

@ -36,7 +36,7 @@ Setting `Rabbit.prototype = animal` literally states the following: "When a `new
That's the resulting picture:
![](proto-constructor-animal-rabbit.png)
![](proto-constructor-animal-rabbit.svg)
On the picture, `"prototype"` is a horizontal arrow, meaning a regular property, and `[[Prototype]]` is vertical, meaning the inheritance of `rabbit` from `animal`.
@ -62,7 +62,7 @@ Rabbit.prototype = { constructor: Rabbit };
*/
```
![](function-prototype-constructor.png)
![](function-prototype-constructor.svg)
We can check it:
@ -86,7 +86,7 @@ let rabbit = new Rabbit(); // inherits from {constructor: Rabbit}
alert(rabbit.constructor == Rabbit); // true (from prototype)
```
![](rabbit-prototype-constructor.png)
![](rabbit-prototype-constructor.svg)
We can use `constructor` property to create a new object using the same constructor as the existing one.

BIN
1-js/08-prototypes/02-function-prototype/function-prototype-constructor.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 7.5 KiB

26
1-js/08-prototypes/02-function-prototype/function-prototype-constructor.svg Normal file
View file

@ -0,0 +1,26 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="421px" height="73px" viewBox="0 0 421 73" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>function-prototype-constructor.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="function-prototype-constructor.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="233" y="23" width="170.5" height="28"></rect>
<rect id="Rectangle-1-Copy-2" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="10" y="23" width="108" height="28"></rect>
<text id="Rabbit" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="9" y="15">Rabbit</tspan>
</text>
<path id="Line-Copy" d="M204,31 L130,31 L130,29 L204,29 L204,23 L218,30 L204,37 L204,31 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<path id="Line-Copy-2" d="M145,40 L219,40 L219,42 L145,42 L145,48 L131,41 L145,34 L145,40 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="136" y="22">prototype</tspan>
</text>
<text id="constructor" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="128" y="62">constructor</tspan>
</text>
<text id="default-&quot;prototype&quot;" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="233.7" y="15">default "prototype"</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
1-js/08-prototypes/02-function-prototype/function-prototype-constructor@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 18 KiB

BIN
1-js/08-prototypes/02-function-prototype/native-prototypes-array-tostring.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 16 KiB

39
1-js/08-prototypes/02-function-prototype/native-prototypes-array-tostring.svg Normal file
View file

@ -0,0 +1,39 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="209px" height="316px" viewBox="0 0 209 316" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>native-prototypes-array-tostring.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="native-prototypes-array-tostring.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="17" y="156" width="168" height="58"></rect>
<text id="toString:-function" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold">
<tspan x="27" y="179" fill="#EC6B4E">toString: function</tspan>
<tspan x="178.2" y="179" font-family="PTMono-Regular, PT Mono" font-weight="normal" fill="#8A704D"></tspan>
<tspan x="27" y="194" font-family="PTMono-Regular, PT Mono" font-weight="normal" fill="#8A704D">...</tspan>
</text>
<text id="Array.prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="16" y="148">Array.prototype</tspan>
</text>
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="17" y="23" width="168" height="58"></rect>
<text id="toString:-function" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="27" y="46">toString: function</tspan>
<tspan x="27" y="61">...</tspan>
</text>
<text id="Object.prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="16" y="15">Object.prototype</tspan>
</text>
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="17" y="273" width="168" height="28"></rect>
<path id="Line" d="M77.5,236.5 L77.5,264.5 L75.5,264.5 L75.5,236.5 L69.5,236.5 L76.5,222.5 L83.5,236.5 L77.5,236.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="86" y="244">[[Prototype]]</tspan>
</text>
<path id="Line-2" d="M77.5,104.5 L77.5,132.5 L75.5,132.5 L75.5,104.5 L69.5,104.5 L76.5,90.5 L83.5,104.5 L77.5,104.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="86" y="112">[[Prototype]]</tspan>
</text>
<text id="[1,-2,-3]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="41" y="291">[1, 2, 3]</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3 KiB

BIN
1-js/08-prototypes/02-function-prototype/native-prototypes-array-tostring@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 36 KiB

BIN
1-js/08-prototypes/02-function-prototype/native-prototypes-classes.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 43 KiB

87
1-js/08-prototypes/02-function-prototype/native-prototypes-classes.svg Normal file
View file

@ -0,0 +1,87 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="692px" height="411px" viewBox="0 0 692 411" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>native-prototypes-classes.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="native-prototypes-classes.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="240" y="93" width="198" height="58"></rect>
<text id="toString:-function" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="250" y="116">toString: function</tspan>
<tspan x="250" y="131">other object methods</tspan>
</text>
<text id="Object.prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="239" y="85">Object.prototype</tspan>
</text>
<path id="Line-2" d="M300.5,41.5 L300.5,69.5 L298.5,69.5 L298.5,41.5 L292.5,41.5 L299.5,27.5 L306.5,41.5 L300.5,41.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<path id="Line-3" d="M300.5,174.5 L300.5,202.5 L298.5,202.5 L298.5,174.5 L292.5,174.5 L299.5,160.5 L306.5,174.5 L300.5,174.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="null" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="285" y="16">null</tspan>
</text>
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="224" width="198" height="58"></rect>
<text id="slice:-function" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="24" y="247">slice: function</tspan>
<tspan x="24" y="262">other array methods</tspan>
</text>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="66" y="174">[[Prototype]]</tspan>
</text>
<text id="[[Prototype]]-Copy-6" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="518" y="175">[[Prototype]]</tspan>
</text>
<text id="[[Prototype]]-Copy" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="310" y="187">[[Prototype]]</tspan>
</text>
<text id="[[Prototype]]-Copy-2" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="310" y="54">[[Prototype]]</tspan>
</text>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="310" y="317">[[Prototype]]</tspan>
</text>
<text id="[[Prototype]]-Copy-4" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="582" y="317">[[Prototype]]</tspan>
</text>
<text id="[[Prototype]]-Copy-5" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="117" y="317">[[Prototype]]</tspan>
</text>
<text id="Array.prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="13" y="216">Array.prototype</tspan>
</text>
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="243" y="224" width="198" height="58"></rect>
<text id="call:-function-other" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="253" y="247">call: function</tspan>
<tspan x="253" y="262">other function methods</tspan>
</text>
<text id="Function.prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="242" y="216">Function.prototype</tspan>
</text>
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="474" y="224" width="198" height="58"></rect>
<text id="toFixed:-function" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="484" y="247">toFixed: function</tspan>
<tspan x="484" y="262">other number methods</tspan>
</text>
<text id="Number.prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="473" y="216">Number.prototype</tspan>
</text>
<path id="Line" d="M208.207627,164.274774 L142.011099,194.827018 L141.172982,193.011099 L207.36951,162.458855 L204.855161,157.011099 L220.5,157.5 L210.721976,169.72253 L208.207627,164.274774 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<path id="Line" d="M475.605882,162.523529 L540.829412,193.017647 L539.982353,194.829412 L474.758824,164.335294 L472.217647,169.770588 L462.5,157.5 L478.147059,157.088235 L475.605882,162.523529 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<rect id="Rectangle-5" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="48" y="339" width="117" height="23"></rect>
<text id="[1,-2,-3]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="71" y="354">[1, 2, 3]</tspan>
</text>
<rect id="Rectangle-6" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="243" y="339" width="198" height="65"></rect>
<text id="function-f(args)-{" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="264" y="358">function f(args) {</tspan>
<tspan x="264" y="373"> ...</tspan>
<tspan x="264" y="388">}</tspan>
</text>
<rect id="Rectangle-7" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="541" y="339" width="69" height="23"></rect>
<text id="5" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="573" y="355">5</tspan>
</text>
<path id="Line-4" d="M300.5,304.5 L300.5,332.5 L298.5,332.5 L298.5,304.5 L292.5,304.5 L299.5,290.5 L306.5,304.5 L300.5,304.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<path id="Line-5" d="M577.5,304.5 L577.5,332.5 L575.5,332.5 L575.5,304.5 L569.5,304.5 L576.5,290.5 L583.5,304.5 L577.5,304.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<path id="Line-6" d="M107.5,304.5 L107.5,332.5 L105.5,332.5 L105.5,304.5 L99.5,304.5 L106.5,290.5 L113.5,304.5 L107.5,304.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 7 KiB

BIN
1-js/08-prototypes/02-function-prototype/native-prototypes-classes@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 104 KiB

BIN
1-js/08-prototypes/02-function-prototype/object-prototype-1.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 16 KiB

38
1-js/08-prototypes/02-function-prototype/object-prototype-1.svg Normal file
View file

@ -0,0 +1,38 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="453px" height="199px" viewBox="0 0 453 199" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>object-prototype-1.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="object-prototype-1.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="233" y="23" width="208" height="58"></rect>
<text id="constructor:-Object" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="243" y="40">constructor: Object</tspan>
<tspan x="243" y="55">toString: function</tspan>
<tspan x="243" y="70">...</tspan>
</text>
<rect id="Rectangle-1-Copy" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="233" y="164" width="178" height="28"></rect>
<text id="Object.prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="232" y="15">Object.prototype</tspan>
</text>
<rect id="Rectangle-1-Copy-2" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="10" y="23" width="108" height="28"></rect>
<text id="Object" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="9" y="15">Object</tspan>
</text>
<text id="obj-=-new-Object()" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="238" y="154">obj = new Object()</tspan>
</text>
<path id="Line" d="M322.5,108.5 L322.5,136.5 L320.5,136.5 L320.5,108.5 L314.5,108.5 L321.5,94.5 L328.5,108.5 L322.5,108.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<path id="Line-Copy" d="M204,35 L127,35 L127,33 L204,33 L204,27 L218,34 L204,41 L204,35 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="331" y="118">[[Prototype]]</tspan>
</text>
<text id="prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="134" y="22">prototype</tspan>
</text>
<text id="constructor" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="17" y="41">constructor</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.7 KiB

BIN
1-js/08-prototypes/02-function-prototype/object-prototype-1@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 41 KiB

BIN
1-js/08-prototypes/02-function-prototype/object-prototype.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 11 KiB

30
1-js/08-prototypes/02-function-prototype/object-prototype.svg Normal file
View file

@ -0,0 +1,30 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="453px" height="94px" viewBox="0 0 453 94" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>object-prototype.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="object-prototype.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="233" y="23" width="208" height="58"></rect>
<text id="constructor:-Object" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="243" y="39">constructor: Object</tspan>
<tspan x="243" y="54">toString: function</tspan>
<tspan x="243" y="69">...</tspan>
</text>
<text id="Object.prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="232" y="15">Object.prototype</tspan>
</text>
<rect id="Rectangle-1-Copy-2" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="10" y="23" width="107" height="28"></rect>
<text id="Object" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="9" y="15">Object</tspan>
</text>
<path id="Line-Copy" d="M194,35 L127,35 L127,33 L194,33 L194,27 L208,34 L194,41 L194,35 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="134" y="22">prototype</tspan>
</text>
<text id="constructor" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="17" y="39">constructor</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2 KiB

BIN
1-js/08-prototypes/02-function-prototype/object-prototype@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 26 KiB

BIN
1-js/08-prototypes/02-function-prototype/proto-constructor-animal-rabbit.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 12 KiB

36
1-js/08-prototypes/02-function-prototype/proto-constructor-animal-rabbit.svg Normal file
View file

@ -0,0 +1,36 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="453px" height="160px" viewBox="0 0 453 160" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>proto-constructor-animal-rabbit.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="proto-constructor-animal-rabbit.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="233" y="23" width="187" height="28"></rect>
<text id="eats:-true" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="243" y="42">eats: true</tspan>
</text>
<rect id="Rectangle-1-Copy" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="233" y="124" width="187" height="28"></rect>
<text id="name:-&quot;White-Rabbit&quot;" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="246" y="143">name: "White Rabbit"</tspan>
</text>
<text id="animal" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="232" y="15">animal</tspan>
</text>
<rect id="Rectangle-1-Copy-2" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="10" y="23" width="99" height="28"></rect>
<text id="Rabbit" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="9" y="15">Rabbit</tspan>
</text>
<text id="rabbit" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="238" y="113">rabbit</tspan>
</text>
<path id="Line" d="M322.5,82.5 L322.5,110.5 L320.5,110.5 L320.5,82.5 L314.5,82.5 L321.5,68.5 L328.5,82.5 L322.5,82.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<path id="Line-Copy" d="M208,35 L127,35 L127,33 L208,33 L208,27 L222,34 L208,41 L208,35 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="331" y="92">[[Prototype]]</tspan>
</text>
<text id="prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="134" y="22">prototype</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.6 KiB

BIN
1-js/08-prototypes/02-function-prototype/proto-constructor-animal-rabbit@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 29 KiB

BIN
1-js/08-prototypes/02-function-prototype/rabbit-animal-object.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 20 KiB

48
1-js/08-prototypes/02-function-prototype/rabbit-animal-object.svg Normal file
View file

@ -0,0 +1,48 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="233px" height="344px" viewBox="0 0 233 344" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>rabbit-animal-object.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="rabbit-animal-object.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="96" width="218" height="58"></rect>
<text id="toString:-function" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="24" y="113">toString: function</tspan>
<tspan x="24" y="128">hasOwnProperty: function</tspan>
<tspan x="24" y="143">...</tspan>
</text>
<text id="Object.prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="13" y="88">Object.prototype</tspan>
</text>
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="213" width="218" height="28"></rect>
<text id="animal" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="13" y="205">animal</tspan>
</text>
<path id="Line" d="M74.5,176.5 L74.5,204.5 L72.5,204.5 L72.5,176.5 L66.5,176.5 L73.5,162.5 L80.5,176.5 L74.5,176.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="83" y="184">[[Prototype]]</tspan>
</text>
<text id="[[Prototype]]-Copy" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="83" y="274">[[Prototype]]</tspan>
</text>
<path id="Line-2" d="M74.5,44.5 L74.5,72.5 L72.5,72.5 L72.5,44.5 L66.5,44.5 L73.5,30.5 L80.5,44.5 L74.5,44.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="83" y="52">[[Prototype]]</tspan>
</text>
<text id="null" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="59" y="19">null</tspan>
</text>
<text id="eats:-true" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="24" y="231">eats: true</tspan>
</text>
<rect id="Rectangle-1-Copy" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="302" width="218" height="28"></rect>
<text id="rabbit-copy" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="13" y="294">rabbit</tspan>
</text>
<path id="Line-Copy" d="M74.5,265.5 L74.5,293.5 L72.5,293.5 L72.5,265.5 L66.5,265.5 L73.5,251.5 L80.5,265.5 L74.5,265.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="jumps:-true" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="24" y="320">jumps: true</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3.5 KiB

BIN
1-js/08-prototypes/02-function-prototype/rabbit-animal-object@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 48 KiB

BIN
1-js/08-prototypes/02-function-prototype/rabbit-prototype-constructor.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 13 KiB

39
1-js/08-prototypes/02-function-prototype/rabbit-prototype-constructor.svg Normal file
View file

@ -0,0 +1,39 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="449px" height="157px" viewBox="0 0 449 157" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>rabbit-prototype-constructor.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="rabbit-prototype-constructor.svg">
<g id="Line-Copy-5-+-Line-Copy-4-+-Line-Copy-3" transform="translate(267.500000, 79.000000) scale(-1, 1) rotate(-180.000000) translate(-267.500000, -79.000000) translate(224.000000, 50.000000)" stroke="#EC6B4E" stroke-linecap="square" stroke-width="2">
<path d="M86.372208,4.4122072 C86.372208,4.4122072 86.372208,-11.5862 86.372208,19.3384447 C86.372208,50.2630894 1.10897436,50.2630894 1.10897436,50.2630894" id="Line-Copy-5" stroke-dasharray="1,2,1,8"></path>
<path d="M1.66346154,49.7604585 L10.5352564,40.7131024" id="Line-Copy-4"></path>
<path d="M0.554487179,50.7657203 L8.31730769,56.797291" id="Line-Copy-3"></path>
</g>
<path d="M248,23 L248,51 L406,51 L406,23 L248,23 Z" id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB"></path>
<text id="default-&quot;prototype&quot;" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="248.2" y="15">default "prototype"</tspan>
</text>
<rect id="Rectangle-1-Copy" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="248" y="121" width="158" height="28"></rect>
<rect id="Rectangle-1-Copy-2" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="10" y="23" width="99" height="28"></rect>
<text id="Rabbit" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="9" y="15">Rabbit</tspan>
</text>
<text id="rabbit" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="248" y="112">rabbit</tspan>
</text>
<path id="Line" d="M324.5,79.5 L324.5,107.5 L322.5,107.5 L322.5,79.5 L316.5,79.5 L323.5,65.5 L330.5,79.5 L324.5,79.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<path id="Line-Copy" d="M197,35 L127,35 L127,33 L197,33 L197,27 L211,34 L197,41 L197,35 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<path id="Line-Copy-2" d="M142,43 L212,43 L212,45 L142,45 L142,51 L128,44 L142,37 L142,43 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="333" y="89">[[Prototype]]</tspan>
</text>
<text id="prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="134" y="22">prototype</tspan>
</text>
<text id="constructor" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="128" y="62">constructor</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3.2 KiB

BIN
1-js/08-prototypes/02-function-prototype/rabbit-prototype-constructor@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 32 KiB

8
1-js/08-prototypes/03-native-prototypes/article.md
View file

@ -19,11 +19,11 @@ Where's the code that generates the string `"[object Object]"`? That's a built-i
Here's what's going on:
![](object-prototype.png)
![](object-prototype.svg)
When `new Object()` is called (or a literal object `{...}` is created), the `[[Prototype]]` of it is set to `Object.prototype` according to the rule that we discussed in the previous chapter:
![](object-prototype-1.png)
![](object-prototype-1.svg)
So then when `obj.toString()` is called the method is taken from `Object.prototype`.
@ -52,7 +52,7 @@ By specification, all of the built-in prototypes have `Object.prototype` on the
Here's the overall picture (for 3 built-ins to fit):
![](native-prototypes-classes.png)
![](native-prototypes-classes.svg)
Let's check the prototypes manually:
@ -79,7 +79,7 @@ alert(arr); // 1,2,3 <-- the result of Array.prototype.toString
As we've seen before, `Object.prototype` has `toString` as well, but `Array.prototype` is closer in the chain, so the array variant is used.
![](native-prototypes-array-tostring.png)
![](native-prototypes-array-tostring.svg)
In-browser tools like Chrome developer console also show inheritance (`console.dir` may need to be used for built-in objects):

BIN
1-js/08-prototypes/03-native-prototypes/function-prototype-constructor.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 7.5 KiB

26
1-js/08-prototypes/03-native-prototypes/function-prototype-constructor.svg Normal file
View file

@ -0,0 +1,26 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="421px" height="73px" viewBox="0 0 421 73" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>function-prototype-constructor.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="function-prototype-constructor.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="233" y="23" width="170.5" height="28"></rect>
<rect id="Rectangle-1-Copy-2" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="10" y="23" width="108" height="28"></rect>
<text id="Rabbit" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="9" y="15">Rabbit</tspan>
</text>
<path id="Line-Copy" d="M204,31 L130,31 L130,29 L204,29 L204,23 L218,30 L204,37 L204,31 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<path id="Line-Copy-2" d="M145,40 L219,40 L219,42 L145,42 L145,48 L131,41 L145,34 L145,40 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="136" y="22">prototype</tspan>
</text>
<text id="constructor" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="128" y="62">constructor</tspan>
</text>
<text id="default-&quot;prototype&quot;" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="233.7" y="15">default "prototype"</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
1-js/08-prototypes/03-native-prototypes/function-prototype-constructor@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 18 KiB

BIN
1-js/08-prototypes/03-native-prototypes/native-prototypes-array-tostring.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 16 KiB

39
1-js/08-prototypes/03-native-prototypes/native-prototypes-array-tostring.svg Normal file
View file

@ -0,0 +1,39 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="209px" height="316px" viewBox="0 0 209 316" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>native-prototypes-array-tostring.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="native-prototypes-array-tostring.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="17" y="156" width="168" height="58"></rect>
<text id="toString:-function" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold">
<tspan x="27" y="179" fill="#EC6B4E">toString: function</tspan>
<tspan x="178.2" y="179" font-family="PTMono-Regular, PT Mono" font-weight="normal" fill="#8A704D"></tspan>
<tspan x="27" y="194" font-family="PTMono-Regular, PT Mono" font-weight="normal" fill="#8A704D">...</tspan>
</text>
<text id="Array.prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="16" y="148">Array.prototype</tspan>
</text>
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="17" y="23" width="168" height="58"></rect>
<text id="toString:-function" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="27" y="46">toString: function</tspan>
<tspan x="27" y="61">...</tspan>
</text>
<text id="Object.prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="16" y="15">Object.prototype</tspan>
</text>
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="17" y="273" width="168" height="28"></rect>
<path id="Line" d="M77.5,236.5 L77.5,264.5 L75.5,264.5 L75.5,236.5 L69.5,236.5 L76.5,222.5 L83.5,236.5 L77.5,236.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="86" y="244">[[Prototype]]</tspan>
</text>
<path id="Line-2" d="M77.5,104.5 L77.5,132.5 L75.5,132.5 L75.5,104.5 L69.5,104.5 L76.5,90.5 L83.5,104.5 L77.5,104.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="86" y="112">[[Prototype]]</tspan>
</text>
<text id="[1,-2,-3]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="41" y="291">[1, 2, 3]</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3 KiB

BIN
1-js/08-prototypes/03-native-prototypes/native-prototypes-array-tostring@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 36 KiB

BIN
1-js/08-prototypes/03-native-prototypes/native-prototypes-classes.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 43 KiB

87
1-js/08-prototypes/03-native-prototypes/native-prototypes-classes.svg Normal file
View file

@ -0,0 +1,87 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="692px" height="411px" viewBox="0 0 692 411" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>native-prototypes-classes.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="native-prototypes-classes.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="240" y="93" width="198" height="58"></rect>
<text id="toString:-function" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="250" y="116">toString: function</tspan>
<tspan x="250" y="131">other object methods</tspan>
</text>
<text id="Object.prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="239" y="85">Object.prototype</tspan>
</text>
<path id="Line-2" d="M300.5,41.5 L300.5,69.5 L298.5,69.5 L298.5,41.5 L292.5,41.5 L299.5,27.5 L306.5,41.5 L300.5,41.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<path id="Line-3" d="M300.5,174.5 L300.5,202.5 L298.5,202.5 L298.5,174.5 L292.5,174.5 L299.5,160.5 L306.5,174.5 L300.5,174.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="null" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="285" y="16">null</tspan>
</text>
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="14" y="224" width="198" height="58"></rect>
<text id="slice:-function" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="24" y="247">slice: function</tspan>
<tspan x="24" y="262">other array methods</tspan>
</text>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="66" y="174">[[Prototype]]</tspan>
</text>
<text id="[[Prototype]]-Copy-6" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="518" y="175">[[Prototype]]</tspan>
</text>
<text id="[[Prototype]]-Copy" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="310" y="187">[[Prototype]]</tspan>
</text>
<text id="[[Prototype]]-Copy-2" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="310" y="54">[[Prototype]]</tspan>
</text>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="310" y="317">[[Prototype]]</tspan>
</text>
<text id="[[Prototype]]-Copy-4" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="582" y="317">[[Prototype]]</tspan>
</text>
<text id="[[Prototype]]-Copy-5" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="117" y="317">[[Prototype]]</tspan>
</text>
<text id="Array.prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="13" y="216">Array.prototype</tspan>
</text>
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="243" y="224" width="198" height="58"></rect>
<text id="call:-function-other" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="253" y="247">call: function</tspan>
<tspan x="253" y="262">other function methods</tspan>
</text>
<text id="Function.prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="242" y="216">Function.prototype</tspan>
</text>
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="474" y="224" width="198" height="58"></rect>
<text id="toFixed:-function" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="484" y="247">toFixed: function</tspan>
<tspan x="484" y="262">other number methods</tspan>
</text>
<text id="Number.prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="473" y="216">Number.prototype</tspan>
</text>
<path id="Line" d="M208.207627,164.274774 L142.011099,194.827018 L141.172982,193.011099 L207.36951,162.458855 L204.855161,157.011099 L220.5,157.5 L210.721976,169.72253 L208.207627,164.274774 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<path id="Line" d="M475.605882,162.523529 L540.829412,193.017647 L539.982353,194.829412 L474.758824,164.335294 L472.217647,169.770588 L462.5,157.5 L478.147059,157.088235 L475.605882,162.523529 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<rect id="Rectangle-5" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="48" y="339" width="117" height="23"></rect>
<text id="[1,-2,-3]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="71" y="354">[1, 2, 3]</tspan>
</text>
<rect id="Rectangle-6" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="243" y="339" width="198" height="65"></rect>
<text id="function-f(args)-{" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="264" y="358">function f(args) {</tspan>
<tspan x="264" y="373"> ...</tspan>
<tspan x="264" y="388">}</tspan>
</text>
<rect id="Rectangle-7" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="541" y="339" width="69" height="23"></rect>
<text id="5" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="573" y="355">5</tspan>
</text>
<path id="Line-4" d="M300.5,304.5 L300.5,332.5 L298.5,332.5 L298.5,304.5 L292.5,304.5 L299.5,290.5 L306.5,304.5 L300.5,304.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<path id="Line-5" d="M577.5,304.5 L577.5,332.5 L575.5,332.5 L575.5,304.5 L569.5,304.5 L576.5,290.5 L583.5,304.5 L577.5,304.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<path id="Line-6" d="M107.5,304.5 L107.5,332.5 L105.5,332.5 L105.5,304.5 L99.5,304.5 L106.5,290.5 L113.5,304.5 L107.5,304.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 7 KiB

BIN
1-js/08-prototypes/03-native-prototypes/native-prototypes-classes@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 104 KiB

BIN
1-js/08-prototypes/03-native-prototypes/object-prototype-1.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 16 KiB

38
1-js/08-prototypes/03-native-prototypes/object-prototype-1.svg Normal file
View file

@ -0,0 +1,38 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="453px" height="199px" viewBox="0 0 453 199" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>object-prototype-1.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="object-prototype-1.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="233" y="23" width="208" height="58"></rect>
<text id="constructor:-Object" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="243" y="40">constructor: Object</tspan>
<tspan x="243" y="55">toString: function</tspan>
<tspan x="243" y="70">...</tspan>
</text>
<rect id="Rectangle-1-Copy" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="233" y="164" width="178" height="28"></rect>
<text id="Object.prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="232" y="15">Object.prototype</tspan>
</text>
<rect id="Rectangle-1-Copy-2" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="10" y="23" width="108" height="28"></rect>
<text id="Object" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="9" y="15">Object</tspan>
</text>
<text id="obj-=-new-Object()" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="238" y="154">obj = new Object()</tspan>
</text>
<path id="Line" d="M322.5,108.5 L322.5,136.5 L320.5,136.5 L320.5,108.5 L314.5,108.5 L321.5,94.5 L328.5,108.5 L322.5,108.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<path id="Line-Copy" d="M204,35 L127,35 L127,33 L204,33 L204,27 L218,34 L204,41 L204,35 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="331" y="118">[[Prototype]]</tspan>
</text>
<text id="prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="134" y="22">prototype</tspan>
</text>
<text id="constructor" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="17" y="41">constructor</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.7 KiB

BIN
1-js/08-prototypes/03-native-prototypes/object-prototype-1@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 41 KiB

BIN
1-js/08-prototypes/03-native-prototypes/object-prototype-null.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 3.9 KiB

21
1-js/08-prototypes/03-native-prototypes/object-prototype-null.svg Normal file
View file

@ -0,0 +1,21 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="194px" height="121px" viewBox="0 0 194 121" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>object-prototype-null.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="object-prototype-null.svg">
<rect id="Rectangle-1-Copy" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="6" y="83" width="138" height="28"></rect>
<text id="obj" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="5" y="72">obj</tspan>
</text>
<path id="Line" d="M76.5,41.5 L76.5,69.5 L74.5,69.5 L74.5,41.5 L68.5,41.5 L75.5,27.5 L82.5,41.5 L76.5,41.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="84" y="51">[[Prototype]]</tspan>
</text>
<text id="null" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="60" y="15">null</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.4 KiB

BIN
1-js/08-prototypes/03-native-prototypes/object-prototype-null@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 8.7 KiB

BIN
1-js/08-prototypes/03-native-prototypes/object-prototype.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 11 KiB

30
1-js/08-prototypes/03-native-prototypes/object-prototype.svg Normal file
View file

@ -0,0 +1,30 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="453px" height="94px" viewBox="0 0 453 94" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>object-prototype.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="object-prototype.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="233" y="23" width="208" height="58"></rect>
<text id="constructor:-Object" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="243" y="39">constructor: Object</tspan>
<tspan x="243" y="54">toString: function</tspan>
<tspan x="243" y="69">...</tspan>
</text>
<text id="Object.prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="232" y="15">Object.prototype</tspan>
</text>
<rect id="Rectangle-1-Copy-2" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="10" y="23" width="107" height="28"></rect>
<text id="Object" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="9" y="15">Object</tspan>
</text>
<path id="Line-Copy" d="M194,35 L127,35 L127,33 L194,33 L194,27 L208,34 L194,41 L194,35 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="134" y="22">prototype</tspan>
</text>
<text id="constructor" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="17" y="39">constructor</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2 KiB

BIN
1-js/08-prototypes/03-native-prototypes/object-prototype@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 26 KiB

BIN
1-js/08-prototypes/03-native-prototypes/proto-constructor-animal-rabbit.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 12 KiB

36
1-js/08-prototypes/03-native-prototypes/proto-constructor-animal-rabbit.svg Normal file
View file

@ -0,0 +1,36 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="453px" height="160px" viewBox="0 0 453 160" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>proto-constructor-animal-rabbit.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="proto-constructor-animal-rabbit.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="233" y="23" width="187" height="28"></rect>
<text id="eats:-true" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="243" y="42">eats: true</tspan>
</text>
<rect id="Rectangle-1-Copy" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="233" y="124" width="187" height="28"></rect>
<text id="name:-&quot;White-Rabbit&quot;" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="246" y="143">name: "White Rabbit"</tspan>
</text>
<text id="animal" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="232" y="15">animal</tspan>
</text>
<rect id="Rectangle-1-Copy-2" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="10" y="23" width="99" height="28"></rect>
<text id="Rabbit" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="9" y="15">Rabbit</tspan>
</text>
<text id="rabbit" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="238" y="113">rabbit</tspan>
</text>
<path id="Line" d="M322.5,82.5 L322.5,110.5 L320.5,110.5 L320.5,82.5 L314.5,82.5 L321.5,68.5 L328.5,82.5 L322.5,82.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<path id="Line-Copy" d="M208,35 L127,35 L127,33 L208,33 L208,27 L222,34 L208,41 L208,35 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="331" y="92">[[Prototype]]</tspan>
</text>
<text id="prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="134" y="22">prototype</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.6 KiB

BIN
1-js/08-prototypes/03-native-prototypes/proto-constructor-animal-rabbit@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 29 KiB

BIN
1-js/08-prototypes/03-native-prototypes/rabbit-prototype-constructor.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 13 KiB

39
1-js/08-prototypes/03-native-prototypes/rabbit-prototype-constructor.svg Normal file
View file

@ -0,0 +1,39 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="449px" height="157px" viewBox="0 0 449 157" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>rabbit-prototype-constructor.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="rabbit-prototype-constructor.svg">
<g id="Line-Copy-5-+-Line-Copy-4-+-Line-Copy-3" transform="translate(267.500000, 79.000000) scale(-1, 1) rotate(-180.000000) translate(-267.500000, -79.000000) translate(224.000000, 50.000000)" stroke="#EC6B4E" stroke-linecap="square" stroke-width="2">
<path d="M86.372208,4.4122072 C86.372208,4.4122072 86.372208,-11.5862 86.372208,19.3384447 C86.372208,50.2630894 1.10897436,50.2630894 1.10897436,50.2630894" id="Line-Copy-5" stroke-dasharray="1,2,1,8"></path>
<path d="M1.66346154,49.7604585 L10.5352564,40.7131024" id="Line-Copy-4"></path>
<path d="M0.554487179,50.7657203 L8.31730769,56.797291" id="Line-Copy-3"></path>
</g>
<path d="M248,23 L248,51 L406,51 L406,23 L248,23 Z" id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB"></path>
<text id="default-&quot;prototype&quot;" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="248.2" y="15">default "prototype"</tspan>
</text>
<rect id="Rectangle-1-Copy" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="248" y="121" width="158" height="28"></rect>
<rect id="Rectangle-1-Copy-2" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="10" y="23" width="99" height="28"></rect>
<text id="Rabbit" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="9" y="15">Rabbit</tspan>
</text>
<text id="rabbit" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="248" y="112">rabbit</tspan>
</text>
<path id="Line" d="M324.5,79.5 L324.5,107.5 L322.5,107.5 L322.5,79.5 L316.5,79.5 L323.5,65.5 L330.5,79.5 L324.5,79.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<path id="Line-Copy" d="M197,35 L127,35 L127,33 L197,33 L197,27 L211,34 L197,41 L197,35 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<path id="Line-Copy-2" d="M142,43 L212,43 L212,45 L142,45 L142,51 L128,44 L142,37 L142,43 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="333" y="89">[[Prototype]]</tspan>
</text>
<text id="prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="134" y="22">prototype</tspan>
</text>
<text id="constructor" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="128" y="62">constructor</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3.2 KiB

BIN
1-js/08-prototypes/03-native-prototypes/rabbit-prototype-constructor@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 32 KiB

4
1-js/08-prototypes/04-prototype-methods/article.md
View file

@ -121,7 +121,7 @@ But `Object` also can serve us well here, because language creators gave a thoug
The `__proto__` is not a property of an object, but an accessor property of `Object.prototype`:
![](object-prototype-2.png)
![](object-prototype-2.svg)
So, if `obj.__proto__` is read or set, the corresponding getter/setter is called from its prototype, and it gets/sets `[[Prototype]]`.
@ -142,7 +142,7 @@ alert(obj[key]); // "some value"
`Object.create(null)` creates an empty object without a prototype (`[[Prototype]]` is `null`):
![](object-prototype-null.png)
![](object-prototype-null.svg)
So, there is no inherited getter/setter for `__proto__`. Now it is processed as a regular data property, so the example above works right.

BIN
1-js/08-prototypes/04-prototype-methods/object-prototype-2.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 14 KiB

38
1-js/08-prototypes/04-prototype-methods/object-prototype-2.svg Normal file
View file

@ -0,0 +1,38 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="449px" height="190px" viewBox="0 0 449 190" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>object-prototype-2.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="object-prototype-2.svg">
<rect id="Rectangle-1" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="233" y="23" width="207" height="58"></rect>
<text id="..." font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="243" y="38">...</tspan>
<tspan x="243" y="53">get __proto__: function</tspan>
<tspan x="243" y="68">set __proto__: function</tspan>
</text>
<rect id="Rectangle-1-Copy" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="233" y="150" width="207" height="28"></rect>
<text id="Object.prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="232" y="15">Object.prototype</tspan>
</text>
<rect id="Rectangle-1-Copy-2" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="10" y="23" width="108" height="28"></rect>
<text id="Object" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="9" y="15">Object</tspan>
</text>
<text id="obj" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="238" y="139">obj</tspan>
</text>
<path id="Line" d="M322.5,108.5 L322.5,136.5 L320.5,136.5 L320.5,108.5 L314.5,108.5 L321.5,94.5 L328.5,108.5 L322.5,108.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<path id="Line-Copy" d="M194,35 L127,35 L127,33 L194,33 L194,27 L208,34 L194,41 L194,35 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="331" y="118">[[Prototype]]</tspan>
</text>
<text id="prototype" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="134" y="22">prototype</tspan>
</text>
<text id="constructor" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="17" y="41">constructor</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.7 KiB

BIN
1-js/08-prototypes/04-prototype-methods/object-prototype-2@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 36 KiB

BIN
1-js/08-prototypes/04-prototype-methods/object-prototype-null.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 3.9 KiB

21
1-js/08-prototypes/04-prototype-methods/object-prototype-null.svg Normal file
View file

@ -0,0 +1,21 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="194px" height="121px" viewBox="0 0 194 121" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>object-prototype-null.svg</title>
<desc>Created with sketchtool.</desc>
<g id="inheritance" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="object-prototype-null.svg">
<rect id="Rectangle-1-Copy" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="6" y="83" width="138" height="28"></rect>
<text id="obj" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="5" y="72">obj</tspan>
</text>
<path id="Line" d="M76.5,41.5 L76.5,69.5 L74.5,69.5 L74.5,41.5 L68.5,41.5 L75.5,27.5 L82.5,41.5 L76.5,41.5 Z" fill="#EE6B47" fill-rule="nonzero"></path>
<text id="[[Prototype]]" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="84" y="51">[[Prototype]]</tspan>
</text>
<text id="null" font-family="PTMono-Regular, PT Mono" font-size="14" font-weight="normal" fill="#8A704D">
<tspan x="60" y="15">null</tspan>
</text>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.4 KiB

BIN
1-js/08-prototypes/04-prototype-methods/object-prototype-null@2x.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 8.7 KiB