# 11.JavaScript创建对象的方式

  • 1.对象字面量

    // 1.对象字面量
    person = {
        name: 'qmj',
        age: 18,
        height: 180
    }
    

    2.通过object

    // 2.通过Object实例
    var person = new Object();
    person.name = 'qmj'
    person.age = 18
    person.learn = function() {
    	console.log(person.name+'在学习js')
    } 
    

    上面两个方法都可以创建对象,但是有个明显的缺点,就是冗余的代码过多,以下是解决办法:

    3.工厂模式,使用函数封装里面创建对象的细节

    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("wei",25,"software");
    var person2 = createPerson("bu",25,"software");
    

    4.构造函数

    // 4.构造函数模式,创建了自定义的构造函数
    function Person(name, age, job){
        this.name = name;
        this.age = age;
        this.job = job;
        this.sayName = function(){
            alert(this.name);
        }
    }
    var person1 = new Person("wei",25,"software"); // 通过new来创建对象
    var person2 = new Person("bu",25,"software");
    new 之后会进行以下步骤:
       	1.创建一个新对象
        2.将构造函数的作用域赋给新对象(因此this指向这个新对象)
        3.执行构造函数中的代码
        4.返回新对象
    console.log(person1.constructor == Person);     //true
    

    5.原型模式

    function Person(){
    }
    Person.prototype.name = "wei";
    Person.prototype.age = 27;
    Person.prototype.job = "Software";
    Person.prototype.sayName = function(){
        alert(this.name);
    }
    
    var person1 = new Person();
    person1.sayName();      //"wei"
    
    var person2 = new Person();
    person2.sayName();      //"wei"
    
    alert(person1.sayName == person2.sayName);
    

    6.混合使用构造函数模式和原型模式

    function Person(name, age){
        this.name = name;
        this.age = age;
        this.friends = ["乾隆","康熙"];
    }
    Person.prototype = {
        constructor:Person,
        sayName:function(){
            alert(this.name);
        }
    }
    var person1 = new Person("wei",29);
    var person2 = new Person("bu",25);
    person1.friends.push("嬴政");
    console.log(person1.friends);   //["乾隆", "康熙", "嬴政"]
    console.log(person2.friends);   //["乾隆", "康熙"]
    console.log(person1.friends === person2.friends);   //false
    console.log(person1.sayName === person2.sayName);   //true
    

    7.寄生构造函数模式

    // 构造函数封装一个用Object实例创建的对象并返回
    function Person(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 person = new Person("wei",29,"banzhuan");
    person.sayName();   //"wei"
    
    // 除了需要new 和工厂模式没有啥区别
    
最后更新于: 12/25/2020, 9:20:27 AM