美文网首页
js中prototype,__protpo__,construc

js中prototype,__protpo__,construc

作者: 李牧敲代码 | 来源:发表于2019-02-07 14:14 被阅读0次

    作为一个前端开发人员,对prototype,__proto__,constructor如果不理解,感觉有点说不过去(其实这个也是挺实用的),这里做个总结。

    【prototype】

    定义:

    函数的原型对象。

    注意点
    1. 函数才有prototype
    2. 包含2个成员——constructor和__proto__
    作用
    • 实现类的继承
        function Class3() {
            this.sex = 'male';
        }
        let obj = {
            name: 'obj123123'
        }
        Class3.prototype = obj;
        let c3 = new Class3();
       console.log(c3.name);//输出obj123123
    
    • 向类添加方法
    function Class1() {
        this.name = 'wcx';
    }
    Class1.prototype.sayhello = function() {
        console.log(123)
    }
    let c1 = new Class1();
    console.log(c1.sayhello())//输出123
    

    【 __proto__】

    定义

    对象的构造函数的原型对象(对象爸爸的prototype)

    作用

    __proto__属性的作用就是当访问一个对象的属性时,如果该对象内部不存在这个属性,那么就会去它的__proto__属性所指向的那个对象(父对象)里找,一直找,直到__proto__属性的终点null,然后返回undefined,通过__proto__属性将对象连接起来的这条链路即我们所谓的原型链

    【constructor】

    定义

    对象的构造函数

    补充

    作用

    可以用于判断的对象的类型(但是不是最好的方法)

    其他一些补充

    js构造对象的2中方式——对象字面量和new 的方式
    对象字面量

    就像下面这样的就是对象字面量构造函数的方式

    let obj = {
        name: 'wcx'
    }
    
    new的方式

    像下面这样的就是new的方式

    function Class1() {
        this.name = 'wcx'
    }
    let a = new Class1();
    

    构造函数总结(https://www.cnblogs.com/wyaocn/p/5815775.html这篇博文讲得非常好)

    定义

    用于创建的函数我们称之为构造函数或者构造器;

    方式

    对象字面量和new 的方式,上文中有提到过。

    原理(new的方式)

    主要做了4件事情

    function Class1() {
        this.name = 'wcx'
    }
    //new 做的4件事情
    let c1 = {};
    c1.__proto__ = Class1.prototype;
    Class1.call(c1);
    return c1
    
    补充

    一个函数要作为一个真正意义上的构造函数,需要满足下列条件:

    1、 在函数内部对新对象(this)的属性进行设置,通常是添加属性和方法。

    2、 构造函数可以包含返回语句(不推荐),但返回值必须是this,或者其它非对象类型的值。

    作用

    用于创建大量相同类型的对象,并使对象具备实现继承等高级特性的能力。

    参考文献

    https://www.cnblogs.com/libin-1/p/6014925.html
    https://blog.csdn.net/cc18868876837/article/details/81211729
    https://www.cnblogs.com/wyaocn/p/5815775.html

    相关文章

      网友评论

          本文标题:js中prototype,__protpo__,construc

          本文链接:https://www.haomeiwen.com/subject/ubarsqtx.html