JavaScript创建对象与原型

时间:2022-01-09 19:12:27

一、prototype原型

JavaScript 是一门面向对象语言,而面向对象的特点就是把一组事物的共性提取出来,组成一个对象,然后我们在为这个对象添加添加它特有的方法。

JavaScript 中任何事物都是对象,当我们创建一个函数时,每个函数都会自带有很多属性,其中一个是prototype属性,这个属性就是创建函数的实例对象。

JavaScript创建对象与原型

结果: Object

如上面的图所示,Persion.prototype在控制台输出的是个实例化好的对象,这就说明 我们在创建函数的时候,它内部自动为他实例化了一个对象,并赋值给prototype属性,后台创建函数的时候进行了以下操作:

  var temp = new Persion();
Persion.prototype = temp;

所以也就就是说 如果我们在Persion.prototype下自定义方法和属性,那么这些方法和属性就是共享有的。

二、对象创建

下面是在JavaScript 中创建对象的几种方式:

1.工厂方式

在函数中定义对象,并定义对象的属性和方法,最后把创建好的对象返回出去,

这就是工厂方式。

         JavaScript创建对象与原型

2.构造函数方式

构造函数模式创建对象,是使用new 来创建对象,比较好理解,而且用了this来指向属性和方法,比较灵活,但是我们大多数时候创建对象的时候,属性都是会变的,而方法是不变的,所有创建两次完全的相同方法没有必要。

           JavaScript创建对象与原型

3.原型方式

使用原型对象可以让所有对象实例共享它所包含的属性及方法,由于共享,因此因此一个实例修改了数据,另一个也随之更改了数据。

           JavaScript创建对象与原型

   4.混合模式(原型模式 + 构造函数模式)

混合模式中构造函数模式用于定义实例属性,而原型模式用于定义方法和共享属性。

这是开发中最常用的创建对象方式。

 JavaScript创建对象与原型

  5.动态原型模式

动态原型模式将所有信息封装在了构造函数中,而通过构造函数中初始化原型(仅第一个对象实例化时初始化原型),这个可以通过判断该方法是否存在,而选择是否需要初始化。

            JavaScript创建对象与原型

 

三、原型链

JavaScript 中创建对象,都有一个__proto__内置属性,他是创建对象后存在的,这个属性主要的作用就是继承概念,在JavaScript中所有的对象的基类都是Object,当我们创建一个对象的时候,新创建对象的prototype 属性已经没有了,取而代之的是__proto__,然而新对象的__proto__属性与之前对象的prototype属性进行==比较是相等的。

 JavaScript创建对象与原型

结果:true

   由此可见在对象初始化的时候,Persion.prototype赋值给了temp.__proto__,也就是说tempPersion.prototype下定义的所有方法和属性.

这就是一个通过__proto__属性实现的一个继承,下面是一个继承的寻找图

 JavaScript创建对象与原型

当对象调用方法或属性的时候,都会先查找自己有没有,如果有就不会再想上查找,如果没有找到,就会通过__proto__属性想上一层一层的寻找,直到Object,如果没有就会报null,这就是继承的原理,子类继承父类所有方法和属性。