mirror of
https://github.com/flynx/Course-JavaScript.git
synced 2025-10-29 02:50:09 +00:00
some cleanup...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
parent
e2c5bff393
commit
72c9bf45a4
55
js-oop.js
55
js-oop.js
@ -19,13 +19,13 @@
|
|||||||
y: 2,
|
y: 2,
|
||||||
}
|
}
|
||||||
|
|
||||||
// Then we will create a new object using a as a "base"
|
// Then we will create a new object using 'a' as a "base"
|
||||||
|
|
||||||
var b = Object.create(a)
|
var b = Object.create(a)
|
||||||
b.z = 3
|
b.z = 3
|
||||||
|
|
||||||
// The object b now has both access to it's own attributes ('z') and
|
// The object 'b' now has both access to it's own attributes ('z') and
|
||||||
// attributes of a ('x' and 'y')
|
// attributes of 'a' ('x' and 'y')
|
||||||
|
|
||||||
b.x // -> 1
|
b.x // -> 1
|
||||||
b.z // -> 3
|
b.z // -> 3
|
||||||
@ -37,23 +37,23 @@
|
|||||||
// Cycles in prototype chains are not allowed, see note further down for
|
// Cycles in prototype chains are not allowed, see note further down for
|
||||||
// an example.
|
// an example.
|
||||||
//
|
//
|
||||||
// Note that this works for reading, when writing or deleting we are
|
// Note that this works for reading attributes, but when writing or
|
||||||
// affecting ONLY the local object and attributes explicitly defined in
|
// deleting we are affecting ONLY the local object and attributes
|
||||||
// it, or its' "own" attributes.
|
// explicitly defined in it, or its' "own" attributes.
|
||||||
|
|
||||||
b.x = 321
|
b.x = 321
|
||||||
b.x // -> 321
|
b.x // -> 321
|
||||||
a.x // -> 1
|
a.x // -> 1
|
||||||
|
|
||||||
// Notice that a.x is no longer visible from b, this is called "shadowing"
|
// Notice also that a.x is no longer visible from 'b', this is called
|
||||||
// and a.x is shadowed by b.x, now let us delete x from b to reveal the
|
// "shadowing", we say: a.x is shadowed by b.x, now let us delete 'x'
|
||||||
// shadowed a.x
|
// from 'b' to reveal the shadowed a.x
|
||||||
|
|
||||||
delete b.x
|
delete b.x
|
||||||
b.x // -> 1
|
b.x // -> 1
|
||||||
|
|
||||||
// Trying to delete .x from b again will have no effect, this is because
|
// But, trying to delete .x from 'b' again will have no effect, this is
|
||||||
// .x no longer exists in b
|
// because .x no longer exists in 'b'
|
||||||
|
|
||||||
delete b.x
|
delete b.x
|
||||||
b.x // -> 1
|
b.x // -> 1
|
||||||
@ -95,7 +95,9 @@
|
|||||||
// var b = Object.creating(a)
|
// var b = Object.creating(a)
|
||||||
// a.__proto__ = b
|
// a.__proto__ = b
|
||||||
//
|
//
|
||||||
// Thus, we could define our own create function like this:
|
//
|
||||||
|
// Thus, we could define our own equivalent to Object.create(..) like
|
||||||
|
// this:
|
||||||
|
|
||||||
function clone(from){
|
function clone(from){
|
||||||
var o = {}
|
var o = {}
|
||||||
@ -126,6 +128,19 @@
|
|||||||
Object.prototype.__proto__ === null
|
Object.prototype.__proto__ === null
|
||||||
|
|
||||||
// We'll also need this a bit later...
|
// We'll also need this a bit later...
|
||||||
|
//
|
||||||
|
// And can create an object with a null prototype like this:
|
||||||
|
|
||||||
|
var raw_obj = Object.create(null)
|
||||||
|
var raw_obj = clone(null)
|
||||||
|
|
||||||
|
// or manually...
|
||||||
|
var raw_obj = {}
|
||||||
|
raw_obj.__proto__ = null
|
||||||
|
|
||||||
|
// These "raw" objects differ from normal objects in that they do not
|
||||||
|
// inherit any interface methods, defined in the Object, like the
|
||||||
|
// .hasOwnProperty(..) we used above, this can be useful in some cases.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -135,7 +150,7 @@
|
|||||||
// JavaScript provides a second, complementary mechanism to inherit
|
// JavaScript provides a second, complementary mechanism to inherit
|
||||||
// attributes, it resembles the class/object relationship in languages
|
// attributes, it resembles the class/object relationship in languages
|
||||||
// like C++ but this resemblance is on the surface only, as it still
|
// like C++ but this resemblance is on the surface only, as it still
|
||||||
// uses the same prototype mechanism as basis as described above.
|
// uses the same prototype mechanism as basis, as described above.
|
||||||
//
|
//
|
||||||
// We will start by creating a "constructor":
|
// We will start by creating a "constructor":
|
||||||
|
|
||||||
@ -151,9 +166,9 @@
|
|||||||
|
|
||||||
|
|
||||||
// Some terminology:
|
// Some terminology:
|
||||||
// - in the above use-case A is called a constructor,
|
// - in the above use-case 'A' is called a constructor,
|
||||||
// - the object returned by new is called an "instance" (in this case
|
// - the object returned by new is called an "instance" (in this case
|
||||||
// assigned to a),
|
// assigned to 'a'),
|
||||||
// - the attributes set by the constructor (x and y) are called
|
// - the attributes set by the constructor (x and y) are called
|
||||||
// "instance attributes" and are not shared (obviously) between
|
// "instance attributes" and are not shared (obviously) between
|
||||||
// different instances, rather they are "constructed" for each
|
// different instances, rather they are "constructed" for each
|
||||||
@ -166,7 +181,7 @@
|
|||||||
// 3) passes the new object to the constructor via 'this'
|
// 3) passes the new object to the constructor via 'this'
|
||||||
// 4) after the constructor finishes, this object is returned
|
// 4) after the constructor finishes, this object is returned
|
||||||
//
|
//
|
||||||
// We could write an equivalent (simplified) function:
|
// We could write a simplified equivalent function:
|
||||||
|
|
||||||
function construct(func){
|
function construct(func){
|
||||||
var obj = {}
|
var obj = {}
|
||||||
@ -178,8 +193,8 @@
|
|||||||
// But at this point this all looks like all we did is move the attribute
|
// But at this point this all looks like all we did is move the attribute
|
||||||
// definition from a literal object notation into a constructor function,
|
// definition from a literal object notation into a constructor function,
|
||||||
// effectively adding complexity.
|
// effectively adding complexity.
|
||||||
// And now instead of "inheriting" attributes we make a new set for each
|
// And now instead of "inheriting" and reusing attributes we make a new
|
||||||
// individual instance.
|
// set for each individual instance.
|
||||||
// So hat are we getting back from this?
|
// So hat are we getting back from this?
|
||||||
//
|
//
|
||||||
// To answer this question we will need to look deeper under the hood,
|
// To answer this question we will need to look deeper under the hood,
|
||||||
@ -192,7 +207,7 @@
|
|||||||
a.constructor // -> [Function A]
|
a.constructor // -> [Function A]
|
||||||
|
|
||||||
|
|
||||||
// These are what makes this fun, lets write a more complete new
|
// These are what makes this fun, lets write a more complete 'new'
|
||||||
// re-implementation:
|
// re-implementation:
|
||||||
|
|
||||||
function construct(func, args){
|
function construct(func, args){
|
||||||
@ -238,6 +253,8 @@
|
|||||||
// So if we add stuff to the constructor's .prototype they should be
|
// So if we add stuff to the constructor's .prototype they should be
|
||||||
// accessible from the object
|
// accessible from the object
|
||||||
|
|
||||||
|
// the following three lines actually add attributes to the same
|
||||||
|
// object...
|
||||||
A.prototype.x = 123
|
A.prototype.x = 123
|
||||||
a.constructor.prototype.y = 321
|
a.constructor.prototype.y = 321
|
||||||
a.__proto__.z = 333
|
a.__proto__.z = 333
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user