js原型、构造函数和原型链的理解

本文探讨了JavaScript中的原型概念,指出普通对象和函数对象的区别,特别是它们的`__proto__`属性。接着,介绍了构造函数的特点,如需要通过`new`操作符实例化,并通过`constructor`属性指向自身。最后,阐述了原型链的工作原理,它是通过`__proto__`连接各个对象,形成查找属性的路径。通过实例代码帮助理解这一过程。
摘要由CSDN通过智能技术生成

仅此表达我个人的理解。

prototype 原型

首先原型(prototype)是什么,可以这么理解在js里面一切都是对象,而原型就是对象的属性啦,但是对象又分为两种,一种是普通对象,还有一种是函数对象,废话少说看代码吧:
在这里插入图片描述在这里插入图片描述
由此可见,普通对象不具有prototype属性,只有函数对象才有prototype属性,但是他们都有一个共同点都有__proto __属性,也就是说只要是对象都有 __proto __属性。注意:__proto__属性不是规范的属性,对应的规范属性是[[Prototype]]

constructor 构造函数

首先说一下构造函数的特点:
1.需要new实例化,内部使用this对象指向即将要生成的实例对象
2.首字母大写,用于区分普通函数,因为和普通函数的写法一样
从上面的代码和控制台打印出来的东西可以知道,每一个函数对象都具有prototype属性,prototype原型对象下面又有一个constructor 属性,这个constructor属性指向的是prototype属性所在的构造函数Person,现在再来看一下下面的代码:

function Person(name){    // 构造函数
    this.name = name;
}
var a = new Person('pingfan');
console.dir(Person);
console.dir(a.constructor);

在这里插入图片描述
打印出来的东西是完全一样的,也就是说:a.constructor指向的是构造函数Person,Person.prototype.constructor指向的也是构造函数Person,用一个表达式解释一下:Person === a.constructor === Person.prototype.constructor 。

__proto__ 原型链

先说特点:是个对象就有,__proto__的指向取决于对象创建时的实现方式
为什么要叫它原型链呢?原型链的形成是真正是靠__proto__,因为当js查找对象的属性的时候,先从该对象本身开始查找是否存在这个属性,如果找不到就会往原型链上查找,会一直查找__proto__到null为止,并且不会查找自身的prototype属性。从而行成一条__proto__连起来的原型链。代码如下:

function Person(name){    // 构造函数
    this.name = name;
}
var a = new Person('pingfan');
console.dir(Person.prototype);
console.dir(a.__proto__);
console.log(a.__proto__.__proto__);
console.log(Person.prototype === a.__proto__, 'Person.prototype === a.__proto__');

在这里插入图片描述

						原型和原型链是JS实现继承的一种模型
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值