如何在javascript中创建对象的子项?

时间:2016-02-28 15:59:49

标签: javascript

我真的很努力地找到非常简单和有效的例子(例如在MDN上),但这让我很生气。我不能简单地弄明白,我在哪里弄错了。我想有一个Array对象的祖先。这是样本。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Fiddling</title>
<script>


function Synthese() {
    //Array.call(this); 
    //Synthese.prototype = Object.create(Array.prototype);
    //Synthese.prototype.constructor = Synthese;

    this.prototype = Object.create(Array);
    //this.prototype.constructor = this;
    this.Make = function () {
        result = "";
        for (i=0; i<this.length; i++){
        result = result + this[i] + ".";    
        }   
        return result;
    }
}
var A = new Array();
A.push("A"); //OK
var S = new Synthese();
S.push("A"); //fails
S.push("B");
alert(S.Make());
</script>
</head>
<body>
</body>
</html>

如何使Synthese成为Array的子​​级? S.push( “A”);从不执行

2 个答案:

答案 0 :(得分:3)

您无法在ES5或更早版本中正确继承Array。这是继承机制的少数限制之一。

通过新的class关键字在ES2015(又名ES6)中修复了此问题:

// ES2015 and above only
class Synthese extends Array {
}

像Babel这样的转发器无法对此功能进行填充/填充(因为您无法在ES5中执行此操作,因此您需要一个JavaScript引擎在ES2015之前不具备的功能)。

Array问题无关,您实现派生构造函数的模式并不完全正确。如果您仍然需要在ES5中执行此操作并且未使用转换器,我已经编写了详尽的解释和示例in this answer

答案 1 :(得分:0)

你应该在构造函数

之后设置原型
..
    function Synthese() {
        //Array.call(this); 
        //Synthese.prototype = Object.create(Array.prototype);
        //Synthese.prototype.constructor = Synthese;

        this.prototype = Object.create(Array);
        //this.prototype.constructor = this;
        this.Make = function () {
            result = "";
            for (i=0; i<this.length; i++){
            result = result + this[i] + ".";    
            }   
            return result;
        }
    }
    Synthese.prototype = []; // HERE
    var A = new Array();
    A.push("A");
    console.log(Object.getPrototypeOf(S));
    S.push("A");
    S.push("B");
    alert(S.Make());
..