JavaScript based learning - Prototype
Speaking from the object
JavaScript is an object-oriented language, and JavaScript implementations and common (such as Java) are not the same, not through JavaScript classes to abstract objects, created directly create objects, JavaScritpt only object.
[[Prototype]]
Almost all the objects have been given a non-null value when the object is created by a [[the Prototype]] would
value may be obtained by a .__ proto__, may be obtained by Object.getPrototypeOf (A)
var A = {}
object [[Prototype]] will eventually point to Objects.prototype
Prototype role
Copy the JavaScript object-oriented way than through the class (like Java), but through the associated objects, the associated object is through the prototype
we create an object b and associate it to the object a, b find the prototype point a.
When we visited ba, although in a b does not exist, will always look up through the prototype (until you find Object), found in a prototype of a.
var a = { a: 2 },
b = Object.create(a);
console.log(b);
console.log(b.a); // 2
console.log(Object.getPrototypeOf(b) === a); // true
Object b
About functions
- There will be also a function of the object prototype function has a prototype property, when we used to call this new function, the resulting object [[Prototype]] would correlation function of the prototype
- JavaScript does not exist constructor only when using the new function calls, function calls will become a constructor call.
- The first letter of the function name function normally we will call by new capital, but for JavaScript engines capitalize the first letter does not make any sense.
When we use new to call a function, the following procedure occurs
- Create a new object
- This object will be executed [[the Prototype]] connection
- This new object will be bound to this function call
- If the function does not return other objects, then the function call new expression will automatically return the new object (this)
function Foo(name) {
this.name = name;
}
Foo.prototype.myName = function() {
return this.name;
};
var a = new Foo('a');
console.log(a);
console.log(a.myName()); // a
console.log(a.constructor === Foo); // true
console.log(Foo.constructor === Function);
console.log(Foo.prototype.constructor === Foo); // true
Object A
A itself has a name attribute, A prototype of a myName from Foo () function, and constructors constructor, the constructor point A Foo, Foo.prototype.constructor also defaults to the Foo.
The properties of a point .constructor Foo, not Foo described by a "configuration", trust relationships only between them
Foo.prototype .constructor the default attributes only function Foo properties when made, may be modified
when the modified Foo. after the prototype, a.constructor in "{}" is not found in the constructor property, continues to look to the upper prototype chain, found Object, so a.constructor === Object
function Foo() {}
Foo.prototype = {};
var a = new Foo();
console.log(a.constructor === Foo); // false
console.log(a.constructor === Object); // true
inherit
- Bar.prototype = Object.create (Fun.prototype). Create a new object is created Bar.prototype will pass Object.create () way inside and associate new object [[prototype]] to Foo.prototype. Doing so would Bar.prototype.constructor attribute is missing
- When Bar.prototype = Fun.prototype time, make Bar.prototype and Fun.prototype common reference the same object, when Bar.prototype assignment, but also make Fun.prototype change, loss of inheritance meaning.
- ES6 provides a better way Object.setPrototypeOf (Bar.prototype, Fun.prototype)
function Fun(name) {
this.name = name;
}
Fun.prototype.myName = function() {
return this.name;
};
function Bar(name, lable) {
Fun.call(this, name);
this.lable = lable;
}
// Bar.prototype = Fun.prototype;
// Bar.prototype = new Fun();
Bar.prototype = Object.create(Fun.prototype);
// Object.setPrototypeOf(Bar.prototype, Fun.prototype);
Bar.prototype.myName = function() {
return this.name + 'jsong';
};
var a = new Bar('jsong');
console.log(a.myName()); // jsongjsong
var b = new Fun('js');
console.log(b.myName()); // js