JavaScript中对象的定义方式

小咪咪 2022-05-31 02:25 214阅读 0赞

在JavaScript中是没有类的概念的，只有对象。无论是字符串，数值，数组还是函数，其本质都是对象。此外，JavaScript是允许自定义对象。什么是对象呢？简而言之，对象是带有**属性**和**方法**的特殊数据类型。以下是几种常用的对象定义方式。

##### 1、基于已有对象扩充其属性和方法 #####

简单的创建一个对象，然后动态地为其增加属性和方法。

var object=new Object();
    object.name="zhangsan";
    object.sayName=function()
    {
        this.name=name;
     }
    object.sayName("lisi");

##### 2、工厂方法 #####

工厂方式的优点在于你不需要每次扩充方法和属性，一次建成后就可以产生多个对象，无需关注创建细节，甚至不需要关注具体类的类名。

function factory()
    {
        var object = new Object();
        object.username = "zhangsan";
        object.password = "123";
    
        object.get = function()
        {
            return (this.username+","+this.password);
        }
        return object;
    }
    var object1 = factory();     
    object1.get();
    var object2 = factory();

好的对象创建方式应该满足**方法可以被多个对象共享，而属性私有**，使代码更加简略。同时，也可以将上述的程序改写为带参数的工厂创建方式。改进后的代码如下：

function get(){
        return (this.username+","+this.password);
    }
    
    function factory(username,password){
        var object = new Object();
        object.username = username;
        object.password = password;
    
        object.get = get;
        return object;
    }
    
    var object1 = factory("zhangsan","123");
    object1.get();
    var object2 = factory("lisi","456");

##### 3、构造函数方式 #####

使用构造函数方式时，JavaScript引擎会在第一行代码执行前为我们生成一个对象，同时含有一个隐藏的return语句，将生成的对象返回。因此，在函数体内，无需显性地声明。

function Person(){
        //在执行第一行代码前，js自动生成一个对象
        this.username = "zhangsan";
        this.password = "123";
    
        this.get = function(){
            return (this.username+","+this.password);
        }
        //隐藏的return语句，将生成的对象返回
    }
    
    var person = new Person();
    person.get();

同理，也可以将其改为可传递参数的构造函数。

##### 4、使用原型(prototype)方式 #####

单纯使用原型方式定义对象无法在构造函数中为属性赋初值，只能在对象生成后再去改变属性值。

function Person()
    {
    }
    
    Person.prototype.username = "zhangsan";
    Person.prototype.password = "123";
    person.prototype.get = function(){
        return (this.username+","+this.password);
    }
    
    var person = new Person();
    person.username = "lisi";
    person.password = "456";
    person.get();

如果使用原型方式对象，那么生成的所有对象会共享原型中的属性，这样一个对象改变了该属性也会反映到其他对象当中。可以使用**原型+构造函数**方式来解决这个问题，使对象之间的属性互不干扰，各个对象间共享同一个方法。这也是推荐使用的方法。

function Person()
    {
        this.username = new Array();
        this.password = "";
    }
    
    Person.prototype.get = function()
    {
        return (this.username+","+this.password);
    }
    
    var p1 = new Person();
    var p2 = new Person();
    
    p1.username.push("zhangsan");
    p1.password = "123";
    
    p2.username.push("lisi");
    p2.password = "456";
    
    p1.get();
    p2.get();

##### 5、动态原型方式 #####

在构造函数中，通过标志量让所有对象共享一个方法，而每个对象都拥有自己的属性。

##### 结言 #####

以上为个人学习过程中的总结，若有更好的方法或者其他的理解，欢迎留言或者私信探讨。