JavaScript Object-oriented programming (excerpt from JS advanced programming)

There is no concept of class in ECMAScript.

ECMA-262 defines an object as: "A collection of unordered attributes whose properties can contain basic values, objects, or functions." , the object is a set of values that do not have a specific order. You can think of an object as a hash table, which is nothing more than a set of name-value pairs, where the value is data or function.

Each object is created based on a reference type (native type/custom type).

There are several ways to create objects:

1. Create an object instance and add properties and methods to it

var person = new Object ();        Person.name = "Da Huang";        Person.age =;        Person.job = "Software developer";        Person.sayname = function () {            alert (this.name);        }        Person.sayname ();

Cons: creating many objects with the same interface creates a lot of duplicate code.

2. Factory mode

Given that ECMAScript cannot create classes, use functions to encapsulate the details of creating objects with specific interfaces

function Createperson (name,age,job) {            var o = new Object ();            O.name = name;            O.age = age;            O.job = job;            O.sayname = function () {                alert (this.name);            };            return o;        }        var person1 = Createperson ("Li Lei", "PHD");        var person2 = Createperson ("Da Huang", "software Developer");        Person1.sayname ();        Person2.sayname ();

Features:Although the factory model solves the problem of creating multiple similar objects, itno problem solved for object recognition(that is, how to know the type of an object).
3. Constructor Mode

Constructors in ECMAScript can be used to create objects of a specific type. Native constructors, such as array and object, automatically appear in the execution environment. In addition, you can create custom constructors that define properties and methods for custom object types.

constructor function person        (name, age, Job) {            this.name = name;            This.age = age;            This.job = job;            This.sayname = function () {                alert (this.name);            }        }        var person1 = new Person ("Li Lei", "PHD");        var person2 = new Person ("Da Huang", "software Developer");        Person1.sayname ();        Person2.sayname ();        Alert (person1 instanceof person);//True        alert (Person1 instanceof Object);//True

differences from the factory model:

• Create object without display;
• Assigning properties and methods directly to this;
• no return statement;
• P Capitalization in person (Convention: Constructors should start with a capital letter);
• To create a new instance, you must use the new operator.

Feature: a constructor defined in this way can flag its instance as a specific type, which is where the constructor is better than the factory pattern , the main problem with the constructor, Is that each method is recreated on the instance, and This problem can be solved by using the prototype pattern. Constructors are defined by default in the Global object (which is the Window object in the browser), and the instanceof and Contructor properties always query the constructor in the world scope.

The Person1 and Person2 above have contructor properties, and the constructor property is initially used to flag the object type, but it is more reliable to refer to the monitoring object or the instanceof operator. Person1 is both a person instance and an object, because all objects inherit from object.

Use constructors as functions

The only difference between constructors and other functions is that they are called in different ways. Any function that is called by new can be used as a constructor, and any function that is not called by the new operator is no different than a normal function.

Constructor mode call        var person1 = new Person ("Li Lei", "PHD");        Person1.sayname ();        normal function calls person        ("Yuan Jie", "software Developer");        Window.sayname ();        In another object, call        var o = new Object ();        Person.call (O, "Li Lei", "software Developer");        O.sayname ();

No person () is called with the new operator, and the properties and methods are added to the Window object. When a function is called at the global scope, the This object always points to the global object (the browser is a Window object), so after the function is called, sayname () can be called through the Window object, or by call () (Apply () Call the person () function in the scope of a particular object, which is called in the scope of O, so after the call, O has all the properties and methods.

4. Prototype mode

Prototype mode        function person () {        }        Person.prototype.name = "Da Huang";        Person.prototype.age =;        Person.prototype.sayName = function () {            alert (this.name);        }        var person1 = new Person ();        Person1.sayname ();//Da Huang from prototype        person1.name = "Li Lei";        Person1.sayname (); Li Lei from instance        person1.name = null;        if (Person1.name = = null);            Alert ("Person1.name = = null");//Person1.name = = null from instance        Delete person1.name;        Person1.sayname (); Da Huang from prototype        var person2 = new Person ();        Person2.sayname (); Da Huang from prototype

JavaScript Object-oriented programming (excerpt from JS advanced programming)