原型

1.理解原型对象

在JS中,只要创建了一个新函数A(就是声明了一个函数),那么浏览器就会在内存中创建一个对象B,
而且每个函数都默认有一个属性prototype指向这个对象。这个对象B就是函数A的原型对象,简称原型。
这个函数对象B中默认有一个属性constructor(构造器)指向了这个函数A。

avatar


2.使用构造函数创建对象

任何函数,只要通过new操作符来调用,那么它就可以作为构造函数。构造函数也是函数,不存在定义
构造函数的特殊语法。使用new创建对象的时候,这个对象就会存在一个默认的不可见属性,指向构造
函数的原型对象。这个不可见属性一般用[[prototype]]来表示。

avatar

说明:

1.虽然使用构造函数创建对象,但是对象创建出来以后,就和构造函数没有关系了,它的[[prototype]]属性指向的是构造函数的原型对象。

2.如果使用构造函数创建多个对象,则多个对象会同时指向构造函数的原型对象。

3.如果我们手动给这个原型对象添加属性和方法,那么这些对象就会共享新添的属性和方法。

4.如果给新建对象添加属性,那么它就没法访问到原型上的相同属性,相当于屏蔽了原型中的相同属性>

(3.4点类比CSS来说就是给新建对象添加属性和方法,相当于添加行间样式;给原型对象添加属性和方法,相当于添加class,可以影响一类元素,行间样式的优先级高于class样式的优先级)

5.新建对象只能读取原型中的属性值,但没法修改。例如:p1.name=’winnie’,并不是修改了原型中的属性值,而是给p1对象新添了一个name属性。


与原型相关的属性和方法

1.prototype
我们创建的每个函数都有一个prototype(原型)属性,它是一个指针,指向一个原型对象。原型对象
包含了特定类型的所有实例所共享的方法和属性。

2.constructor
constructor属性存在于原型对象中,它指向构造函数。根据需要,我们可以修改构造函数的prototype属性,让它
指向新的原型对象,但是constructor属性就不再指向原构造函数了,而是指向新原型对象的构造函数。

3.[[prototype]]

用构造方法新建一个对象之后,这个对象中默认会有一个不可访问的属性 [[prototype]] , 这个属性就指向了构造方法的原型对象。虽然说[[prototype]]是一个隐藏属性,但很多浏览器都给每一个对象提供了.proto属性去访问原型对象

4.hasOwnProperty()方法

作用:判断一个属性是否来自对象本身
注意:这个方法不能判断属性是否存在于原型中,因为有可能这个属性不存在

5.in操作符

作用:判断对象或者原型中是否有某个属性。只要其中一个有,就返回true