js __proto__ 和prototype的联系
1.Javascript中所有的对象都是Object的实例,并继承Object.prototype的属性和方法,也就是说,Object.prototype是所有对象的爸爸。(个人感觉搞清楚这一点很重要) 。
在对象创建时,就会有一些预定义的属性,其中定义函数的时候,这个预定义属性就是prototype,这个prototype是一个普通的对象。
而定义普通的对象的时候,就会生成一个__proto__,这个__proto__指向的是这个对象的构造函数的prototype.
详情请看例一:(建议大家用谷歌浏览器查看这些对象的属性);
function A(a){
this.a = a;
}
首先定义一个函数a,如上面所说,函数在被定义的时候就拥有了一个prototype对象。我们来打印看一下
console.log(A.prototype)
浏览器的结果:
如上图,这就是函数a的prototype对象,(记住我们最开始说的,凡是对象都会有一个属性那就是__proto__)。这个__proto__指向的就是他的构造函数的prototype 而这个函数a的prototype对象的构造函数是谁呢? 没错就是开头说到的Object.prototype。
看如下代码:
console.log(A.prototype.__proto__)
console.log(Object.prototype)
而这两个的结果如下:
打印出来是同一个东西,也就是说Object.prototype是所有函数的爹,当你声明一个函数的时候也就是相当于对Object的实例化。这里可以对比一下new一个实例。
我们也可以用几个方法来验证一下:
console.log(Object.prototype.isPrototypeOf(A))//true
console.log(A instanceOf Object) //true
函数a的prototype对象的另一个属性是constructor这个属性就指向了函数a本身,也就是指向了他自己的构造函数。
2.我们在来用一个实例对象来说明一下原型,代码如下:
function B(b){
this.b = b;
}
var b = new B('lc');
当我们声明一个函数B时就自动创建了prototype对象。而b是构造函数的B的实例,这时候b是一个对象,而我们知道,对象只有__proto__属性。而这个属性是指向他的构造函数(B)的prototype属性。这时候我们来打印一下b
console.log(b)
可以看到b中只有__proto__属性,而这个属性是指向他的构造函数的prototype对象的,也就是说
(b.__proto__==B.prototype)答案为true;
这就是js中的prototype和__proto__的区别。
那么什么是原型链呢?接着上面的讲,我们都知道对象都有一个toString方法。上述的实例化对象b也可以toString,
而实例化对象b本身并没有toString的方法,那他就会沿着它的__proto__向他的构造函数B的prototype对象去找,而这里也没有,那他就会 继续沿着B.prototype.__proto__向上找。而B.prototype.__proto__指向的就是Object.prototype。
我们打印一下Object.prototype:
这就是原型链查找,而则一层一层的链接 关系就是原型链。
---------------------
原文:https://blog.csdn.net/lc237423551/article/details/80010100
js __proto__ 和prototype的联系的更多相关文章
- js - __proto__ 、 prototype和constructor
零.资料与前言 0x1 材料: 1.帮你彻底搞懂JS中的prototype.__proto__与constructor(图解) 0x2 前言 之前也尝试总结过 js 中的 __proto__ . pr ...
- js中的prototype和__proto__
var Person = function(name){ this.name = name; this.say = function(){ return "I am " + thi ...
- js中__proto__和prototype的区别和关系?
_proto__(隐式原型)与prototype(显式原型)1.是什么 显式原型 explicit prototype property: 每一个函数在创建之后都会拥有一个名为prototype的属性 ...
- 说一说js中__proto__和prototype以及原型继承的那些事
在面试中遇到过,问js如何实现继承,其实最好的方式就是构造函数+原型,今天在讨论中,发现自己以前理解上的一些误区,特地写出来,最近都比较忙,等手上的项目做完,可以来做个总结. 先说我以前没有认识到位的 ...
- 帮你彻底搞懂JS中的prototype、__proto__与constructor(图解)
作为一名前端工程师,必须搞懂JS中的prototype.__proto__与constructor属性,相信很多初学者对这些属性存在许多困惑,容易把它们混淆,本文旨在帮助大家理清它们之间的关系并彻底搞 ...
- js 原型链 prototype __proto__
1.说明 函数(Function)才有prototype属性,对象(除Object)拥有__proto__. 2.prototype与__proto__区别 示例: <!DOCTYPE html ...
- JS的__proto__与prototype
一.prototype和__proto__的概念 prototype是函数的一个属性(每个函数都有一个prototype属性),这个属性是一个指针,指向一个对象.它是显示修改对象的原型的属性. __p ...
- JS中的prototype、__proto__与constructor属性
作为一名前端工程师,必须搞懂JS中的prototype.__proto__与constructor属性,相信很多初学者对这些属性存在许多困惑,容易把它们混淆,本文旨在帮助大家理清它们之间的关系并彻底搞 ...
- 实践一些js中的prototype, __proto__, constructor
<!DOCTYPE html> <html> <head> <title>ExtJs</title> <meta http-equiv ...
随机推荐
- QTP(5)
一.检查点 1.位图检查点(Bitmap CheckPoint) (1)作用:主要用于检查UI界面,检查页面布局,包括控件位置.大小.颜色.状态等 (2)确定位图检查点的要素: a.检查哪个控件 b. ...
- BPR贝叶斯个性化排序算法
全序关系:集合中的任两个元素之间都可以比较的关系.
- 使用Mutex實現單一程式執行個體的注意事項(转)
相信大家都知道在.NET程式中若要實現單一程式執行個體,一般來說有幾種方法,像是去判斷是否已經有開啟的Process是相同的程式.用Mutex與Semaphore之類的技術來判斷是否程式正在開啟.但是 ...
- thymeleaf错误 org.xml.sax.SAXParseException: 在实体引用中, 实体名称必须紧跟在 ‘&’ 后面
在thymeleaf的js中使用&,<,>等符号时会产生这种问题,因为thymeleaf是采用xml解析的方式进行替换的,所以javascript中&这样的xml实体转义字 ...
- CSS如何水平垂直居中?
CSS如何水平垂直居中? 1.CSS如何实现水平居中? margin: 0 auto 2.CSS如何实现水平垂直居中? 首先设置一个div元素,设置背景颜色以便看出变化.代码如下: <!DOCT ...
- 【Python之路】特别篇--Python内置函数
abs() 求绝对值 i = abs(-100) print(i) # 100 all() 循环里面的参数 如果每个元素都为真,那么all返回值为真 假: 0 False None "&q ...
- 【Python之路】特别篇--Python反射
反射 说反射之前先介绍一下__import__方法,这个和import导入模块的另一种方式 1. import commons 2. __import__('commons') 如果是多层导入: 1. ...
- java常用数据类型转换
在Java开发过程中经常会涉及到数据类型的转换问题,比如数字型转字符型,字符型转日期型,字符串转数组等等,以及其他类型的强制转换等.经常出现,所以有必要总结一下. 1.如何将字串 String 转换成 ...
- java+上传大视频文件断点续传
上周遇到这样一个问题,客户上传高清视频(1G以上)的时候上传失败. 一开始以为是session过期或者文件大小受系统限制,导致的错误. 查看了系统的配置文件没有看到文件大小限制, web.xml中s ...
- 【CUDA 基础】2.4 设备信息
title: [CUDA 基础]2.4 设备信息 categories: CUDA Freshman tags: CUDA Device Information toc: true date: 201 ...