Javascript继承:未启用父属性

Javascript inheritance : parent property not enabled

本文关键字:属性 启用 继承 Javascript      更新时间:2023-09-26

这是我实现继承的代码:

<html lang="en">
<head>
    <title>JavaScript Patterns</title>
    <meta charset="utf-8">
</head>
<body>
    <script>
        /* Title: Classical Pattern #5 - A Temporary Constructor (a pattern that should be generally avoided)
         Description: first borrow the constructor and then also set the child's prototype to point to a new instance of the constructor
         */

        /* Basic */
        /*function inherit(C, P) {
         var F = function () {};
         F.prototype = P.prototype;
         C.prototype = new F();
         }*/

        /* Storing the Superclass */
        /*function inherit(C, P) {
         var F = function () {};
         F.prototype = P.prototype;
         C.prototype = new F();
         C.uber = P.prototype;
         }*/

        /* Resetting the Constructor Pointer */
        /*function inherit(C, P) {
         var F = function () {};
         F.prototype = P.prototype;
         C.prototype = new F();
         C.uber = P.prototype;
         C.prototype.constructor = C;
         }*/

        /* in closure */
        var inherit = (function () {
            var F = function () {
            };
            return function (C, P) {
                F.prototype = P.prototype;
                C.prototype = new F();
                C.uber = P.prototype;
                C.prototype.constructor = C;
            }
        }());

        function Parent(name) {
            this.nameParent = name || 'Adam';
            this.parentName = "parent";//this.nameParent;
        }

        // adding functionality to the prototype
        Parent.prototype.say = function () {
            return this.nameParent;
        };

        // child constructor
        function Child(nameChild) {
            console.log("parentprop:" + this.parentName);
        }
        inherit(Child, Parent);

        var kid = new Child();
        console.log(kid.name); // undefined
        console.log(typeof kid.say); // function
        kid.nameParent = 'Patrick';
        console.log(kid.parentName);
        console.log(kid.say()); // Patrick
        console.log(kid.constructor.nameParent); // Child
        console.log(kid.constructor === Parent); // false


        // reference
        // http://shop.oreilly.com/product/9780596806767.do
    </script>
</body>

我需要 Child 控制台.log显示继承的父类中的"parent",但现在,它只显示未定义。

我不知道为什么它不继承父属性。

提前感谢您的帮助。

因为你从不调用函数 Parent ,这是设置属性的原因。如果你仔细观察你的inherit函数,你正在使用Pprototype属性,但你永远不会调用P  ——这是一件好事;Child谁应该打电话给P

function Child(nameChild) {
    Parent.call(this);
    console.log("parentprop:" + this.parentName);
}

显然,这样做的缺点是您必须在多个地方 列出Parent - 无论是在inherit调用中,还是在Child中。您可以通过在子函数上设置父构造函数来缓解这种情况 inherit

var inherit = (function () {
    var F = function () {
    };
    return function (C, P) {
        F.prototype = P.prototype;
        C.parent = P;          // <==== The new bit
        C.prototype = new F();
        C.uber = P.prototype;
        C.prototype.constructor = C;
    }
}());

。那么Child就变成了:

function Child(nameChild) {
    Child.parent.call(this);
    console.log("parentprop:" + this.parentName);
}

如果你有兴趣彻底地做层次结构(支持调用"超级"方法等(,你可能想看看我的Lineage工具包。这是一个小工具包,可以自动化很多这些东西,但如果你想了解这些东西是如何工作的,源代码可能会成为有趣的阅读。那里还有一个 wiki 页面,显示了不使用Lineage的多层、全功能继承(作为将其与使用 Lineage 进行比较的一种手段(。