网站建设微信文章,企业门户网站数据库设计,wordpress5.2.2中文,音乐网站建立文章目录原型和原型链构造函数原型显式原型#xff08;prototype#xff09;隐式原型#xff08;\_\_proto\_\_#xff09;原型链总结原型和原型链
在js中#xff0c;原型和原型链是一个非常重要的知识点#xff0c;只有理解原型和原型链#xff0c;才能深刻理解JS。在…
文章目录原型和原型链构造函数原型显式原型prototype隐式原型\_\_proto\_\_原型链总结原型和原型链
在js中原型和原型链是一个非常重要的知识点只有理解原型和原型链才能深刻理解JS。在这一个月的面试中原型和原型链也是一个高频知识点现做出如下总结。
构造函数
构造函数本身就是一个函数只是为了与普通函数区别其首字母一般大写构造函数与普通函数的区别在于使用new创建实例的函数就是构造函数直接调用则是普通函数。
function Student(){this.name构造函数
}var stunew Student()console.log(stu.name);//构造函数原型
显式原型prototype
JS是一门基于原型的语言。而JS中的原型是其中十分重要的一个概念。原型本质上就是一个对象它的存在是为了JS中的实例对象可以获取到原型中的公共属性和公共方法。 每个对象都有一个显式原型对象当我创建一个名为Student的类时,其显式原型原型如下:
constructor显式原型中包含的构造函数属性指向该显式原型的构造函数
console.log(Student,Student.prototype);//输出展示如下图于是构造函数和原型之间存在以下关系原型相当于每一个对象实例的私有属性即每当创建一个对象该对象就会有一个为空的显式原型属性。
隐式原型__proto__
每一个对象除了null都有一个属性叫做__proto__(隐式原型)通过它可以访问到该对象的构造函数的原型对象关系如下 从JS的数据类型可以知道,函数类型本质是也是对象,而对象的原型又是指向其构造函数的原型对象得出如下关系
下面是一段关于原型的代码方便大家理解:
function Person() {this.name 构造函数;function col() {console.log(我是构造函数中的方法);};
}
Person.prototype {name: 原型,age: 18,getNum: function () {console.log(我是构造函数中的原型, 1);}
}
var per new Person()
console.log(per.__proto__.__proto__ Object.prototype);// true 对象实例的隐式原型(本质就是通过Object()构造出来的实例对象)的隐式原型指向Object.prototype
console.log(per.__proto__ Person.prototype);// true 没有给隐式原型添加数据时其默认指向其构造函数的显式原型
console.log(per.name, per.age,per.getNum);// 原型18 getNum 可以从构造函数中获取到age和name以及getNum,这里不能直接调用,但在外可以原因不知// 当为实例对象per的隐式原型中添加了数据时
per.__proto__{name:隐式原型,age:22
}
console.log(per.name, per.age,per.getNum); // 隐式原型,22,报错,getNum不存在
//原因此时实例对象的__proto__指定了特定的值不会再去其构造函数的显示原型中查找所以找不到getNum,报错原型链
每个对象拥有一个原型对象通过 __proto__ 指针指向上一个原型 并从中继承方法和属性同时原型对象也可能拥有原型这样一层一层最终指向 null。这种关系被称为原型链 (prototype chain)通过原型链一个对象会拥有定义在其他对象中的属性和方法。 最后的关系图如下
总结
使用new生成实例的函数就是构造函数直接调用的就是普通函数。原型的主要作用是用来存储对象实例的公共属性和公共方法。每个对象都拥有一个原型对象每个引用类型的隐式原型都指向它的构造函数的显式原型一个对象可以通过原型链获取其他对象的属性和方法Object.prototype是所有对象的根对象即原型链终点其隐式原型指向Null
