创建对象的几种方法

时间:2019-11-26
本文章向大家介绍创建对象的几种方法,主要包括创建对象的几种方法使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

对象创建的几种常用方法:

  1. 字面量的形式创建对象;
    var person = {
        name:'Nicholas',
        age:20,
        job:'前端开发',
        sayName:function(){
            return this.name;
        }
    }

    例子上创建一个名字为 person 的对象,并为它添加了二个属性(name、age、job )和一个 方法(sayName())的方法,其中 sayName 函数的 this 指向person.name。

  2. 工厂模式创建对象

    function createPerson(name, age, job) {
        var o = new Object();
        o.name = name;
        o.age = age;
        o.job = job;
        o.sayName = function () {
            return this.name;
        };
        return o;
    }

    函数 createPerson() 能够根据解释的参数来构建一个包含所有必要信息的 Person 对象。可以无数次地调用这个函数,而每次它都会返回一个包含三个属性一个方法的对象。工厂模式虽然解决了创建多个相似对象的问题,但却没有解决对象识别的问题(即怎样知道一个对象的类型)。 
     

  3. 构造函数创建对象
    function Person(name, age, job) {
        this.name = name;
        this.age = age;
        this.job = job;
        this.sayName = sayName;
    }
    ///
    function sayName(){
        return this.name;
    }
    /// 实例
    var person1 = new Person('Nicholas', 25, 'Software');
    var person2 = new Person('Greg', 25, '前端开发');

    与的createPerson()函数的不同之处:
     (1) 没有显式地创建对象;
     (2) 直接将属性和方法赋给了 this 对象;
     (3) 没有return语句。
    此外,还应该注意到函数名 Person 使用的是大写字母 P。按照惯例,构造函数始终都应该以一个 大写字母开头,而非构造函数则应该以一个小写字母开头。

    要创建 Person 的新实例,必须使用 new 操作符。以这种方式调用构造函数实际上会经历以下 4 个步骤:
    (1) 创建一个新对象;
    (2) 将构造函数的作用域赋给新对象(因此 this 就指向了这个新对象);
    (3) 执行构造函数中的代码(为这个新对象添加属性);
    (4) 返回新对象。

  4. 原型模式创建对象
    创建的每个函数都有一个prototype(原型)属性,这个属性是一个指针,指向一个对象,而这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法。如果按照字面意思来理解,那 么 prototype 就是通过调用构造函数而创建的那个对象实例的原型对象。使用原型对象的好处是可以 让所有对象实例共享它所包含的属性和方法。
    function Person() {
    }
    Person.prototype.name = "Nicholas";
    Person.prototype.age = 30;
    Person.prototype.job = "前端";
    Person.prototype.sayName = function () {
        return this.name;
    };
    var person1 = new Person();
    var person2 = new Person();

     理解原型对象
    无论什么时候,只要创建一个函数,就会根据一组特定的规则为该函数创建一个prototype属性,这个属性指向函数的原型对象。在默认情况下,所有的对象都会默认一个constructor(构造属性)属性,这个属性包含一个指向 prototype 属性所在函数的指针。

     各对象之间的关系,Proson构造函数与Person.prototype创建实例的代码为例。

    构造函数与prototype(原型)的关系如图

  5. 组合使用构造函数模式和原型模式
    创建自定义类型的最常见方式,就是组合使用构造函数模式与原型模式。构造函数模式用于定义实 例属性,而原型模式用于定义方法和共享的属性。 

    function Person(name,age,job){
        this.name = name;
        this.age = age;
        this.job = job;["Jack", "Court", "Van"]
        this.friends = ["Jack","Court"];
    };
    Person.prototype = {
        constructor:Person,
        sayName: function() {
            console.log(this.age);
        }
    };
    var person1 = new Person("Nicholas",30,"Sofware");
    var person2 = new Person("Greg",25,"Doctor");
    person1.friends.push("Van");
    console.log(person1.friends);//["Jack", "Court", "Van"]
    console.log(person2.friends);//["Jack", "Court"]
    console.log(person1.sayName == person2.sayName) // true

    在这个例子中,实例属性都是在构造函数中定义的,而由所有实例共享的属性 constructor 和方 法 sayName()则是在原型中定义的。而修改了 person1.friends(向其中添加一个新字符串),并不 会影响到 person2.friends,因为它们分别引用了不同的数组。 这种构造函数与原型混成的模式,是目前在 ECMAScript 中使用最广泛、认同度最高的一种创建自 定义类型的方法。可以说,这是用来定义引用类型的一种默认模式。

  6. 动态原型模式创建对象
    function Person(name,age,job) {
        this.name = name;
        this.age =age;
        this.job = job;
        if(typeof this.sayName != "function") {
            Person.prototype.sayName  = function() {
                console.log(this.name);
            }
        }
    }
    var friend = new Person("Nicholas",25,"Software Engineer");
    friend.sayName(); // Nicholas
    注意构造函数代码中加粗的部分。这里只在 sayName()方法不存在的情况下,才会将它添加到原 型中。这段代码只会在初次调用构造函数时才会执行。此后,原型已经完成初始化,不需要再做什么修 改了。不过要记住,这里对原型所做的修改,能够立即在所有实例中得到反映。因此,这种方法确实可 以说非常完美。其中,if 语句检查的可以是初始化之后应该存在的任何属性或方法——不必用一大堆 if 语句检查每个属性和每个方法;只要检查其中一个即可。对于采用这种模式创建的对象,还可以使 用 instanceof 操作符确定它的类型。

  7. 寄生构造函数模式创建对象
    // 一这个模式跟工厂模式其实,是一模一样的。构造函数在不返回值的情况下,默认会返回新对象实例。而通过在构造函数的末尾添一个 return 语句,可以重写调用构造函数时返回的值。
     function Person(name,age,job){
         var o = new Object();
         o.name = name;
         o.age = age;
         o.job = job;
         o.sayName = function () {
             return this.name;
         }
         return o;
     }
     var friend = new Person("Nicholas", 29, "Software Engineer");
     friend.sayName(); //"Nicholas"
    

     在这个例子中,Person 函数创建了一个新对象,并以相应的属性和方法初始化该对象,然后又返 回了这个对象。除了使用 new 操作符并把使用的包装函数叫做构造函数之外,这个模式跟工厂模式其实 是一模一样的。构造函数在不返回值的情况下,默认会返回新对象实例。而通过在构造函数的末尾添加一个 return 语句,可以重写调用构造函数时返回的值。

    function SpecialArray() {
        var values = new Array();
        values.push.apply(values,arguments);
        values.toString = function () {
            return this.join("|");
        }
        return values;
    }
    var color = new SpecialArray('blue','yellow','red','green');
    var toColorString = color.toString();
    console.log(color,toColorString) // "blue|yellow|red|green"

    在这个例子中,我们创建了一个名叫 SpecialArray 的构造函数。在这个函数内部,首先创建了 一个数组,然后 push()方法(用构造函数接收到的所有参数)初始化了数组的值。随后,又给数组实 例添加了一个 toPipedString()方法,该方法返回以竖线分割的数组值。最后,将数组以函数值的形 式返回。接着,我们调用了 SpecialArray 构造函数,向其中传入了用于初始化数组的值,此后又调 用了 toPipedString()方法。

原文地址:https://www.cnblogs.com/FishStudy520/p/11792327.html