javascript中的__proto__和prototype,以及ES6中class的原型相关
2017-07-04 19:56
791 查看
简要介绍:javascript基于原型链的继承与其他语言明显不同,在一些浏览器厂商中,通过proto可以得到对象的原型,ES6中补充了Class,类似于C++和java,那么Class是如何通过原型链实现的呢?
1.function的原型
这里涉及到如何new一个函数的过程,如果通过new的方式来新生成一个对象,那么stu的原型指向的是new这个函数对象的prototype。这里注意区别,Student.prototype仅仅是一个对象,用于构建Student实例。
这里也一样,Student函数是由Function.prototype构建而来,综上我们可以归纳,proto表示的是对象的原型,也就是对象继承自什么,而prototype是对象的一个属性,用于构造它本身的实例。
注:上述的proto仅仅使用与部分浏览器,并且不支持node环境。ES6下可以通过getPrototypeOf来代替
2.ES6中class的原型
ES6实现了class的语法糖,但是class的本身也是通过原型链来实现的。
从上述子类继承父类的原型来看,显然是与new 一个function有很大区别的,这里就比较类似于C++等语言的语法糖,B子类的原型指向A父类,并且B子类的prototype属性是一个对象,也指向父类的prototype。
下面我们来看通过new一个Class的过程。
综上,在通过new一个方式来创建一个对象的实例,还是比较像new一个function创建一个对象的过程的。
1.function的原型
function Student(){ // } var stu=new Student(); stu.__proto__==Student //false stu.__proto__==Student.prototype //true
这里涉及到如何new一个函数的过程,如果通过new的方式来新生成一个对象,那么stu的原型指向的是new这个函数对象的prototype。这里注意区别,Student.prototype仅仅是一个对象,用于构建Student实例。
Student.__proto__==Function //false Student.__proto__==Function.prototype //true
这里也一样,Student函数是由Function.prototype构建而来,综上我们可以归纳,proto表示的是对象的原型,也就是对象继承自什么,而prototype是对象的一个属性,用于构造它本身的实例。
注:上述的proto仅仅使用与部分浏览器,并且不支持node环境。ES6下可以通过getPrototypeOf来代替
2.ES6中class的原型
ES6实现了class的语法糖,但是class的本身也是通过原型链来实现的。
class A{ } class B extends A{ } B.__proto__==A //true A.prototype.__proto__==B.prototype //true
从上述子类继承父类的原型来看,显然是与new 一个function有很大区别的,这里就比较类似于C++等语言的语法糖,B子类的原型指向A父类,并且B子类的prototype属性是一个对象,也指向父类的prototype。
下面我们来看通过new一个Class的过程。
class A{ } class B extends A{ } var ex=new B(); ex.__proto__==B.prototype // ex.__proto__.__proto__==A.prototype //true
综上,在通过new一个方式来创建一个对象的实例,还是比较像new一个function创建一个对象的过程的。
相关文章推荐
- JavaScript 原型系统的变迁,以及 ES6 class
- Javascript 原型、原型链、prototype以及__proto__详解
- JavaScript 原型系统的变迁,以及 ES6 class
- 彻底深刻理解js原型链之prototype,__proto__以及constructor(一)
- Javascript 原型中的哲学思想 __proto__和prototype
- JavaScript 特殊之-prototype __proto__ class
- Javascript 理解 __proto__ 和 prototype以及instance
- 说一说js中__proto__和prototype以及原型继承的那些事
- 一张图看透JavaScript原型关系:__proto__(对象原型)和prototype(函数原型)
- Javascript中的原型链、prototype、__proto__的关系
- JavaScript精炼---类(class)、构造函数(constructor)、原型(prototype)
- javascript中的 prototype, __proto__, constructor 与 原型继承链
- javascript中prototype、constructor以及__proto__之间的三角关系
- Javascript原型(prototype)和原型链(__proto__)
- JavaScript的原型链继承__propt__、prototype、constructor的理解、以及他们之间相互的关系。
- javascript this指代,new的含义以及prototype,原型链
- 深入理解JavaScript原型:prototype,__proto__和constructor
- Javascript原型链的原理,JS的__proto__,prototype相关知识!(转)
- javascript中的原型链,prototype与__proto__的关系
- js原型链prototype与__proto__以及new表达式