几个概念 构造函数: 构造函数实际上是一个普通函数,通过new操作符,可以利用构造函数快速创建对象; prototype:每个构造函数自身上都会有一个prototype属性,该属性值为一个" />
  • 35648

    文章

  • 23

    评论

  • 20

    友链

  • 最近新加了很多技术文章,大家多来逛逛吧~~~~
  • 喜欢这个网站的朋友可以加一下QQ群,我们一起交流技术。

JavaScript 之 原型和原型链

欢迎来到阿八个人博客网站。本 阿八个人博客 网站提供最新的站长新闻,各种互联网资讯。 喜欢本站的朋友可以收藏本站,或者加QQ:我们大家一起来交流技术! URL链接:https://www.abboke.com/jsh/2019/0702/4689.html 1190000019634409">

几个概念

  1. 构造函数: 构造函数实际上是一个普通函数,通过new操作符,可以利用构造函数快速创建对象;
  2. prototype:每个构造函数自身上都会有一个prototype属性,该属性值为一个对象,这个对象具有一个constructor属性,constructor指向构造函数自身;
  3. 实例: 通过构造函数创建的对象,可以看做是该构造函数的实例;
  4. __proto__:通过构造函数创建的每个对象上面,都会有一个__proto__属性,该属性指向构造函数的prototype;

什么是原型

在JavaScript中,每个对象会有一个原型对象。对象会从原型对象继承一些属性和方法。

什么是原型链

在JavaScript中,访问一个对象的属性时,JS引擎会首先在该对象自身上线查找该属性。如果找到了,则直接返回该属性的值;如果没有找到,则会去改对象的原型上面继续查找。如果对象的原型上面也没有这个属性,则继续在原型对象的上原型上面查找,如此一级级继续往上,直到原型为null,此时JS引擎返回该对象的属性值为undefined。

继承

        /**
         * two methods to implement inheritance;
        */

        function Base(type){ 
            this.type = type;
        }
        Base.prototype.base=function(){
            console.log(`${this.type} is in base func`);
        }
        // method one
        function Sub(type){
            this.type = type;
        }
        Sub.prototype = Object.create(new Base('base'));
        Sub.prototype.sub=function(){
            console.log(`${this.type} is in sub func`);
        }

        // method two
        function Foo(type){
            this.type = type;
        }
        Object.setPrototypeOf( Foo.prototype, new Sub('sub'));
        Foo.prototype.foo=function(){
            console.log(`${this.type} is in foo func`);
        }

        let sub = new Sub('sub1');
        sub.base();
        sub.sub();
        sub instanceof Sub; // true
        sub instanceof Base; // true

        let foo = new Foo('foo1');
        foo.base();
        foo.sub();
        foo.foo();
        foo instanceof Foo; // true
        foo instanceof Sub; // true
        foo instanceof Base; // true

一些实例

Object.getPrototype

预测下面几个表达式的结果

Object.getPrototypeOf(function(){}).constructor === Function;
Object.getPrototypeOf(Function).constructor === Function;
Object.getPrototypeOf(Object.getPrototypeOf(Function)).constructor === Object;

答案:

true;

如何创建一个没有任何原型的对象?

let obj = Object.create(null);
console.log(obj);

image

这篇medium上获得8.6K赞的文章Prototypes in JavaScript讲得很清楚了。

相关文章

暂住......别动,不想说点什么吗?
  • 全部评论(0
    还没有评论,快来抢沙发吧!