当前位置:网站首页>原型和原型链
原型和原型链
2022-08-10 08:42:00 【Oh No 发量又少了】
引用类型有如下四个规则:
规则一
引用类型,都具有对象特性,即可自由扩展属性:
const obj = {
}
const arr = []
const fn = function () {
}
obj.a = 1
arr.a = 1
fn.a = 1
console.log(obj.a) // 1
console.log(arr.a) // 1
console.log(fn.a) // 1
规则二
引用类型,都有一个隐式原型 __proto__
属性,属性值是一个普通的对象:
const obj = {
};
const arr = [];
const fn = function() {
}
console.log('obj.__proto__', obj.__proto__);
console.log('arr.__proto__', arr.__proto__);
console.log('fn.__proto__', fn.__proto__);
规则三
引用类型,隐式原型 __proto__
的属性值指向它的构造函数的显式原型 prototype
属性值:
const obj = {
};
const arr = [];
const fn = function() {
}
obj.__proto__ == Object.prototype // true
arr.__proto__ === Array.prototype // true
fn.__proto__ == Function.prototype // true
规则四
当你试图得到一个对象的某个属性时,如果这个对象本身没有这个属性,那么它会去它的隐式原型 __proto__
(也就是它的构造函数的显式原型 prototype
)中寻找:
const obj = {
a:1 }
obj.toString
// ƒ toString() { [native code] }
首先, obj
对象并没有 toString
属性,之所以能获取到 toString
属性,是遵循了第四条规则,从它的构造函数 Object
的 prototype
里去获取。
特例
function Person(name) {
this.name = name
return this // 其实这行可以不写,默认返回 this 对象
}
var nick = new Person("nick")
console.log(nick.toString());
//打印的结果为:[object Object]
这里就引出 原型链 的概念了, nick
实例先从自身出发检讨自己,发现并没有 toString
方法。找不到,就往上走,找 Person
构造函数的 prototype
属性,还是没找到。构造函数的 prototype
也是一个对象嘛,那对象的构造函数是 Object
,所以就找到了 Object.prototype
下的 toString
方法。
function Person(name) {
this.name = name
return this // 其实这行可以不写,默认返回 this 对象
}
var nick = new Person("nick")
console.log(Person.prototype);
console.log(Person.prototype.__proto__ === Object.prototype);
打印结果如下:
**注意:**当我们往对象的__proto__
属性中添加属性时,对象的__proto__
属性仍会指向构造函数的prototype
属性
function Person(name) {
this.name = name
return this // 其实这行可以不写,默认返回 this 对象
}
var nick = new Person("nick")
console.log('1',nick.__proto__ === Person.prototype);
nick.__proto__.age = 12;
console.log('2',nick.__proto__ === Person.prototype);
打印结果如下:
图片描述原型和原型链
总结
通过四个特性、一个例子、一张图片、一个方法,大家应该对原型和原型链的关系有了大概的认知。我的认知就是,原型链就是一个过程,原型是原型链这个过程中的一个单位,贯穿整个原型链。
边栏推荐
- 爬虫-爬取某小说网站
- debezium-connector-mysql拉起docker报错:debezium启动docke
- 打工人的第27天-平凡但不平淡的日子
- 【微信小程序】一文读懂页面导航
- I don't want to do accounting anymore, Die changed to a new one, moved forward bravely, and finally successfully passed the career change test to double his monthly salary~
- J9数字论:Web3.0+互联网电商会引起怎样的火花?
- Rust learning: 6.5_Array of composite types
- Uni-app开发微信小程序使用本地图片做背景图
- FFT模板
- StringUtils的具体操作
猜你喜欢
Binary tree --- heap
iwemeta元宇宙:一个娃娃卖9999元,泡泡玛特认为一点也不贵
2022-08-01 Advanced Network Engineering (23) Advanced VLAN Technology - VLAN Aggregation, MUX VLAN
【微信小程序】一文读懂页面导航
浅析JWT安全问题
iwemeta元宇宙:阿里首任COO:如何打造销售铁军
mySQL增删改查进阶
Unity—UGUI control
A File Online Query Display and Download Function Realized by Delphi
NPU architecture and force analysis
随机推荐
打工人的第27天-平凡但不平淡的日子
js读取excel时间格式转换
编程老手如何在autojs和冰狐智能辅助之间选择?
J9 Digital Theory: What kind of sparks will Web3.0+ Internet e-commerce cause?
ARM Architecture 2: Processor Core and Assembly Instruction Set
硬件工程师90天学习资料及笔记汇总
爬虫-爬取某小说网站
iwemeta metaverse: Ali's first COO: how to build a sales force
[OAuth2] 20. OAuth2 Extended Protocol PKCE
Is the write performance of raid5 faster than raid10?
JS reduce
数据库注入提权总结(一)
DAY25: Logic vulnerability recurrence
DAY26: GetShell project
The sixteenth day & the basic operation of charles
并查集模板
How to use [jmeter regular expression extractor] to solve the problem of returning the value as a parameter
UGUI - Events, iTween Plugin
如何远程调试对方的H5页面
J9数字科普:Web 3.0 是关于数据所有权还是去中心化?