当前位置 : 主页 > 网络编程 > JavaScript >

prototype __proto__ constructor

来源:互联网 收集:自由互联 发布时间:2021-06-28
js 原型继承方面的理解 js 原型继承方面的理解1.constructor 构造器 1.1 函数的构造器全部指向的是 Function eg: function Foo(param1, param2) { this.param1 = param1; this.param2 = param2; this.say = function () { c
js 原型继承方面的理解
js 原型继承方面的理解

1.constructor 构造器

    1.1 函数的构造器全部指向的是  Function
        eg:
            function Foo(param1, param2) {
                this.param1 = param1;
                this.param2 = param2;
                this.say = function () {
                    console.log(this.parma1, this.param2);
                }
            }
            console.log(Foo.constructor);  // ƒ Function() { [native code] }

            function foo() {
                console.log('this is a function');
            }
            console.log(foo.constructor);  // ƒ Function() { [native code] }

    1.2 函数的实例的构造器指向
        eg:
            function Foo(param1, param2) {
                this.param1 = param1;
                this.param2 = param2;
                this.say = function () {
                    console.log(this.parma1, this.param2);
                }
            }

            let f = new Foo('parma', 'param2');
            console.log(f.constructor); // 指向当前的Foo函数方法

            function foo() {
                console.log('this is a function');
            }
            console.log(foo.constructor);  // ƒ Function() { [native code] }

2.prototype

    2.1 当函数创建的时候,js就会自动创建一个protype
        eg:
            function Foo(param1, param2) {
                this.param1 = param1;
                this.param2 = param2;
                this.say = function () {
                    console.log(this.parma1, this.param2);
                }
            }
            console.log(Foo.prototype);  // Foo(param1, param2) 指向当前函数 原型

            function foo() {
                console.log('this is a function');
            }
            console.log(foo.constructor);  // foo() 指向当前函数

            // 创建完函数的prototype 都会指向 functionName.prototype,
            // 这个时候就可以往当前原型的基础之上添加属性和方法,也可以指向另一个对象来实现集成。
            Foo.prototype.trim = function() {
                console.log('the function on prototype');
            }
3.__proto__

    3.1 每个对象或者是函数都会存在 __proto__
        // javascript 可以通过prototype和__proto__,在两个对象之间建立一个联系,使当前对象可以访问另一个对象的方法和属性。
        // 这样的关联称之为原型链,用来实现集成和属性方法的共享。

    3.2 call 和  constructor
        // js 函数就会有这两个方法用来创建实例
            eg:
                function Foo(param1, param2) {
                    this.param1 = param1;
                    this.param2 = param2;
                    this.say = function () {
                        console.log(this.parma1, this.param2);
                    }
                }
                let f = new Foo('parma', 'param2');  // 通过constructor构造器来创建函数的实例


                function foo() {
                    console.log('this is a function');
                }

                // foo 函数的执行用两种方式的写法,但是是等价的

                3.2.1 常用的执行方式
                        foo(); // 执行当前函数
                3.2.2 call 执行函数
                        foo.call(); // 执行当前函数

    3.3 __proto__ 的指向问题
        eg:
            function Foo(param1, param2) {
                this.param1 = param1;
                this.param2 = param2;
                this.say = function () {
                    console.log(this.parma1, this.param2);
                }
            }
            let f = new Foo('parma', 'param2');
            console.log(f.___proto__) // Foo(param1, param2)  Foo.prototype
            console.log(Foo.___proto__) // Function.prototype


            function foo() {
                console.log('this is a function');
            }
             console.log(f.___proto__) // Function.prototype

4. 总结
    4.1
        let fo = new Foo('parma', 'param2');

        fo.__proto__ == Foo.prototype;
        fo.__proto__.__proto__ == Foo.prototype.__proto__ == Object.prototype;
        fo.__proto__.__proto__.__proto__ == Foo.prototype.__proto__.__proto__ == Object.prototype.__proto__ == null;


        Foo.__proto__ == Function.prototype;
        Foo.__proto__.__proto__ == Function.prototype.__proto__;
        Foo.__proto__.__proto__.__proto__ == Function.prototype.__proto__.__proto__ == Object.prototype.__proto__ == null;
网友评论