用户体验度好的网站,网站开发的ppt报告,石家庄专门做网站的公司,游戏ui素材网站什么是原型#xff08;对象#xff09;
在JavaScript中#xff0c;每个对象都具有一个原型对象prototype#xff0c;目的是#xff1a;利用原型对象实现在同一原型链中的原型方法共享
在理解原型对象前#xff0c;需要先了解什么是构造函数
构造函数
用来初始化对象的…什么是原型对象
在JavaScript中每个对象都具有一个原型对象prototype目的是利用原型对象实现在同一原型链中的原型方法共享
在理解原型对象前需要先了解什么是构造函数
构造函数
用来初始化对象的特殊函数通过new 对象名参数来创建对象实例
构造函数实例化过程 1. 通过new创建一个空的对象{} 2. 构造函数的this指向改对象 3. 指向构造函数向该对象赋值 4. 返回新对象
//构造方法
function Parent(name, age) {this.name name;this.age age;this.fn function () { }
}//创建实例
const parent new Parent(张三, 18);
原型
每一个构造函数都有一个prototype属性该属性指向该函数的原型对象原型对象中的属性对其构造函数实例化的对象共享可以将共用的方法写在prototype中保证对象实例不会多次创建函数节省内存构造函数和原型对象中的this都指向实例对象
//构造方法
function Parent(name, age) {this.name name;this.age age;this.fn function () { }
}
Parent.prototype.fn2 function () { }
//创建实例
const p1 new Parent(张三, 18);
const p2 new Parent(李四, 19)
console.log(p1.fn2 p2.fn2) // true constructor属性
在每个prototype属性中都有一个constructor属性它指向该原型的构造函数 作用 方便在给原型对象一次性进行多次赋值时将原型指回其构造函数 对象原型__proto__
每个实例对象中都有一个__proto__属性该属性指向其实例的原型对象正是因为有__proto__的存在才能使得实例对象可以访问构造函数原型对象中的方法 总结
构造函数通过prototype指向它的原型对象原型对象通过constructor指向它的构造函数通过构造函数实例化的对象中的__proto__属性指向其构造函数的原型对象 原型继承
根据原型的特性可以实现对象之间的继承 上述代码Woman构造函数公共prototype继承了Person对象使得所有由Woman实例化出来的对象都可以使用Person对象中的属性。 通过prototype 接收 new Person实例保证所有子类不会影响父类中的结构 而在Woman构造函数中可以编写Woman私有的属性
弊端若父类中定义了引用数据类型被子类实例的对象所修改由于他们共同引用同一地址其他子类也会受到影响 构造函数继承
想要解决上述问题可以通过在子类创建实例时去执行父类构造函数并修改this指向为子类实例 组合式继承
结合原型链继承和构造函数继承弥补了两者的缺点 原型链查找 每个原型对象proptotype中也有一个__proto__属性它指向其上一级的原型对象
通过这一属性可以得到一条原型链的查找规则
每当需要访问一个对象中是否存在一个属性时先去该实例对象中的私有属性中进行查找若没查到通过实例对象中的__proto__属性去实例对象的原型prototype中进行查找若还没查到则根据prototype属性去它的上一级原型中进行查找直到查到Object的原型对象中最终Object的prototype的__proto__属性指向null 利用instanceof方法可以查找某实例对象的原型是否在某个原型链中 Class
class作为es6中原型的语法糖极大的简化了原型以及原型继承的写法