js 创建对象的9种方式

131 阅读1分钟

1. new Object() --不实用

    var person = new Object(); 
    person.name = "lisi";
    person.age = 29;
    console.log(person)

2. var 对象名={} --常用

    var person ={
        name:'lisi',
        age:29
    }
    console.log(person)

3. 工厂函数 --不实用

    function createPerson(name,age) {
        var obj = new Object();
        obj.name = name;
        obj.age = age;
        obj.say = function(){ alert(this.name); }
        return obj;
    }
    var person = createPerson(“lisi",11);
    person.say(); // alert:lisi
    console.log(person)

4. 构造函数方式 --可以用

    function Person(name, age){
      this.name=name;
      this.age=age;
      this.intr=function(){ console.log(`我叫:${this.name}`) }
      }
    var lisi=new Person("lisi",11)
    lisi.intr() // 我叫:lisi
    console.log(lisi) // 1.  {age: 11,intr: ƒ (),name: "lisi"}

5. 原型对象方式:先创建完全相同的对象,再给子对象添加个性化属性。 --没啥用

      function Person() {
      }
      
      Person.prototype.name = "zs";
      Person.prototype.age =11;
      Person.prototype.say = function(){
          console.log(this.name);
      };
      
      var p1 = new Person(); //创建一个实例p1
      p1.name="lisi" //禁止修改共有属性,而是改你家自由属性
      p1.say() // lisi
      console.log(p1); // {name: "lisi"}
      console.log(Person.prototype) // {name:'zs',age:11,say()}

6. 混合模式:先创建完全相同的对象,再给子对象添加个性化属性。 --没啥用

    function Person(name, age) {
        this.name=name;
        this.age=age;
    }

    Person.prototype.say = function(){
        console.log(this.name);
    };
    
    var p1 = new Person("Lisi",11);
    console.log(p1); // {name:Lisi,age:11}

7. 寄生构造函数:构造函数里调用其他的构造函数 --可以用

    function Person(name, age) {
        this.name=name;
        this.age=age;
    }
    function Student(name,age,className){
      var p = new Person(name,age) //重点在这,借鸡生蛋!
      p.className = className     // 给p添加className 属性
      return p
    }
    var lisi= new Student('lisi',18,'高一(1)班')
    console.log(lisi) // {name:'lisi',age:18,className:'高一(1)班'}

8. ES6 class创建对象 --好用

  class Person{
        constructor(name,age){
          this.name= name;
          this.age = age;
        }
        intr(){
          console.log(`我叫:${this.name}`)
        }
    } 
    
    var p1 = new Person('lisi',19)
    p1.intr(); //我叫:lisi
    console.log(p1) // {name:'lisi',age:19}

9. 闭包构建-不好用

    function Person(name, age) {
          var p={};
          p.getName=function(){ return name };
          p.setName=function(value){ name=value };
          p.getAge=function(){ return age }
          return p;
    }

    var p1 = Person('lisi',11); 
    console.log(p1.getName(), p1.getAge()); // lisi ,11