JavaScript对象创建总结

对象的定义:“无序属性的集合,其属性可以包含基本值、对象或者函数。”简单来说,对象是一组没有特定顺序的值,对象的每个属性或方法都有一个名字,而且这个名字都有一个对应的值,也就是说对象是以键值对形式的存在。

理解了对象是什么,那么接下来就是如何创建对象了,本文将介绍6种创建对象的方法

一、Object构造函数创建对象

 var obj1 = new Object();
        obj1.name = "root";
        obj1.age = 18 ;
        obj.sayHello = function(){
			console.log(this.name + "---" + this.age)
	}

优点:简单易读

缺点:只能使用同一个接口创建很多对象,产生大量的重复代码

二、 字面量创建对象

 var person = {};
    person.name = "zhangsan";
    person.age = 18;
    person.sex = "男";
    person.sayHello = function(){
        console.log(this.name + "---" + this.age)
    }

优点:比Object构造函数创建对象更简洁

缺点:只能使用同一个接口创建很多对象,产生大量的重复代码

三、工厂模式

function createPerson(n,a,s){
        var person = {};        // 原料
        // 加工
        person.name = n;
        person.age = a;
        person.sex = s;
        person.sayHello = function(){
            console.log(this.name + "---" + this.age)
        }
        // 出厂
        return person;
    }
	// 调用
    var p1 = createPerson("zhangsan",18,"男");
    console.log(p1);
    p1.sayHello();

优点:可以无数次地调用这个函数,而且每次都会返回一个包含设置了特定属性的对象

缺点:解决了多个相似对象的问题,但却没有解决对象识别的问题

四、构造函数模式

function createPerson(n,a,s){
        this.name = n;
        this.age = a;
        this.sex = s;
        this.sayHello = function(){
            console.log(this.name + "---" + this.age);
        }
    }
var p1 = new createPerson("张三",18,"男");
console.log(p1);
p1.sayHello();

new是一个执行关键字,它的内部执行原理:

  1. 自动创建一个新对象,在内存中存着,此时拿不到
  2. 改变了函数内部的this指向,改成了第一步创建的新对象
  3. 执行函数内部的代码,并且将第一步创建的对象的__proto__与函数的prototype做了关联
  4. 检查当前函数是否主动返回对象,如果没有,则返回第一步创建的新对象

优点:可以将实例标识为一种特定的类型

缺点:每个方法都要在每个实例上重新创建一遍

五、 原型模式

  function CreatePerson(){
        this.name = "admin";
        this.sayHi = function(){
            console.log(`hi,my name is ${this.name}`);
        }
    }
    CreatePerson.prototype.show = function(){
        console.log("hello");
    };

prototype:专属于函数的一个属性,类型为对象,叫原型对象

作用:为了给将来自身所在的构造函数被new出来的实例做父级使用的

  • 当某个对象自身不具有某个属性或方法时,会找父级
  • 当这个对象是被new出来的实例时,这个对象的父级(proto)就是当前被new的这个构造函数的prototype

优点:可以让所有对象实例共享它的属性和方法

缺点:所有的实例默认情况下都将取得相同的属性值,不过最大的问题是由其共享的本性所导致的

六、混合模式

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

function Person(n,a,f){
      this.name = n;
      this.age = a;
      this.family = f;
  }
  Person.prototype = {
      constructor: Person,  
      say: function(){
         alert(this.name);
     }
 }
 var person1 = new Person("小明",21,["小红","小花","小王]);
 console.log(person1);
 var person2 = new Person("司马懿",20,["刘备","孙权","曹操]);
 console.log(person2);

优点:混合模式共享着对方法的引用,又保证了每个实例都有自己的私有属性,最大限度的节省了内存

发布了2 篇原创文章 · 获赞 10 · 访问量 161

猜你喜欢

转载自blog.csdn.net/weixin_43919429/article/details/104730251