A summary of several ways to create classes and objects in JavaScript

  • 2020-03-30 00:01:44
  • OfStack

In JS, Create Object is not exactly what we often say to Create class objects. The Object in JS emphasizes a kind of composite type, and the Object creation and access to the Object in JS is extremely flexible.

JS objects are a compound type that allows you to store and access them by variable names. Alternatively, an object is an unordered collection of properties, each of which is made up of a name and a value. , where the value type may be a built-in type (such as number,string) or an object.

Enclosed in a brace


var emptyObj = {};
    var myObj =
    {
        'id': 1,        //Attribute names are enclosed in quotation marks and separated by commas
        'name': 'myName'
    };
    //var m = new myObj(); // Does not support 

I don't know if you've noticed that objects are declared with var, but like the code above, it's just a simple declaration of an object, it only has one copy, and you can't do new to it like you would to instantiate a class object, like the comment section of the code above. This greatly limits the reuse of objects, and unless you only need one copy of the object to create, consider creating objects in other ways.

Let's take a look at how to access the properties and methods of an object.


var myObj =
    {
        'id': 1,
        'fun': function() {
            document.writeln(this.id + '-' + this.name);//Object. Properties
        },
        'name': 'myObj',
        'fun1': function() {
            document.writeln(this['id'] + '+' + this['name']);//Access as a collection
        }
    };
    myObj.fun();
    myObj.fun1();
    //  The results of 
    // 1-myObj 1+myObj

Function keyword is used to simulate class

Use this to refer to the current object in function, and declare the property by assigning it to it. If a variable is declared with var, it is a local variable and is only allowed in the class definition.


function myClass() {
            this.id = 5;
            this.name = 'myclass';
            this.getName = function() {
                return this.name;
            }
        }
        var my = new myClass();
        alert(my.id);
        alert(my.getName());
        //  The results of 
        // 5
        // myclass

Create an object in the body of a function, declare its properties, and return them

You can create an Object in the body of a function by using the first method, or by starting with new Object(). Assign values to each property.

However, objects created in this way are not intelligently prompted in VS2008 SP1.


function myClass() {
            var obj =
            {
                'id':2,
                'name':'myclass'
            };
            return obj;
        }
        function _myClass() {
            var obj = new Object();
            obj.id = 1;
            obj.name = '_myclass';
            return obj;
        }
        var my = new myClass();
        var _my = new _myClass();
        alert(my.id);
        alert(my.name);
        alert(_my.id);
        alert(_my.name);
        //  The results of 
        // 2
        // myclass
        // 1
        // _myclass


Related articles: