In the last article, I learned how to use object or object literals to easily create objects, but there are still some disadvantages. This leads to the need to create multiple objects with the same interface repeatedly. The code reuse rate is poor, so classes and inheritance are officially supported in ES6.

The factory pattern

function person(name,sex,year){
    let o=new Object(a);let o.name=name;
    let o.sex=sex;
    let o.year=year;
    let o.selfDescriptor=function(){
     console.log(this.name)   
    }
    return o;
}
let person1=person('yangyang'.'male'.24);console.log(person1);
/ / {
// name: 'yangyang',
// sex: male,
//year: 24,
// selfDescriptor: [Function (anonymous)]
/ /}
Copy the code

While the factory pattern can create similar objects, it does not solve the problem of object identification

Constructor pattern

function Person(name,sex,age){ this.name=name; this.sex=sex; this.age=age; this.sayname=function(){ console.log(this.name); }} let person1=new Person('fangfua',' fangfua', 33); Let person1=new Person('lulu',' male ', 21); person1.sayname(); //fangfua person2.sayname(); //luluCopy the code

Different from the factory model

  • Create object not displayed
  • Properties and methods are assigned directly to this
  • There is no return
  • The first letter of the function name must be capitalized

What happens internally when the new operator creates an instance

  1. A new object is created in memory

  2. The new object’s internal [[Prototype]] property is assigned to the constructor’s Prototype property

  3. The this in the constructor is assigned to the new object

  4. Execute constructor code to add attributes to the new object

  5. If the constructor returns a non-empty object, that object is returned; otherwise, the newly created object is returned

    If no arguments are passed during construction instantiation, the parentheses following the constructor can be removed

The prototype pattern

With stereotype objects, properties and methods defined on them can be shared by instances;

function Person(){ Person.prototype.name="fangfua"; = 'female' Person. Prototype. Sex; Person.prototype.age=33; Person.prototype.sayname=function(){ console.log(this.name); }} let person1=new Person(); Let person1 = new Person (); person1.sayname(); //fangfua person2.sayname(); //fangfuaCopy the code

As soon as a function is created, a prototype attribute is created for the function pointing to the prototype object. The prototype object also has a constructor attribute pointing to the associated constructor.

Each time an instance is created, the [[prototype]] property of the constructor is assigned to the instance object, proto

Note: Instances and stereotypes are directly related, while instances and constructors are not

How do you tell if an instance object and a constructor have the same prototype object

Prototype. isPrototypeOf (instance)

Example: the Person. The prototype. IsPrototypeOf (person1) / / true

Object.getprototypeof () returns the value of the internal property of the parameter [[prototype]]

Prototype level

function Person(){ Person.prototype.name="fangfua"; = 'female' Person. Prototype. Sex; Person.prototype.age=33; Person.prototype.sayname=function(){ console.log(this.name); }} let person1=new Person(); Let person1 = new Person (); person1.name='gungun'; console.log(person1.name); // Gungun comes from instance console.log(person2.name); // Fangfua is a prototypeCopy the code

If you look for an attribute on an instance object, you look for it from the instance itself, or if you don’t find it, you look for it from the prototype object

The object.hasownProperty () method determines whether a property appears on an instance or prototype (true on the instance, false on the prototype).

There are three methods to iterate over property names or values on an instance or stereotype

for… in

Object.keys()

function Person(){ Person.prototype.name="fangfua"; = 'female' Person. Prototype. Sex; Person.prototype.age=33; Person.prototype.sayname=function(){ console.log(this.name); } } let keys=Object.keys(Person.prototype); console.log(keys)//name,sex,age.saynameCopy the code

Object.values()

const o={ foo:'bar', baz:1, qux:{} } console.log(Object.values(o)); //['bar',1,{}]Copy the code