从数组中的对象继承/调用函数

Question

您好！

我对Javascript很新。我在Java方面比较好，所以我对许多关于Javascript的事情感到困惑。我创建了类 Clovek ，它有一些变量和函数。后来我创建了数组Lide ，其中包含 Clovek 的MAX（100）个对象。所以当我稍后调用函数 vypis 时，我只得到TypeError .. blah blah不是函数。但是当我写** console.trace（lide [1]）**时，它写的是Clovek的一个实例。我很困惑..

代码：

function makeid() {
    var text = "";
    var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";

    for( var i=0; i < 8; i++ )
        text += possible.charAt(Math.floor(Math.random() * possible.length));

    return text;
}

var odstavec = document.getElementById("test");

function Clovek(vek, pohlavi, jmeno) {
    this.vek = vek;
    this.pohlavi = pohlavi;
    this.jmeno = jmeno;
}

Clovek.prototype.vypis = function() {
    //console.log(this.vek+" "+this.pohlavi+" "+this.jmeno);
    //odstavec.innerHTML = this.vek+" "+this.pohlavi+" "+this.jmeno;
    return this.vek+" "+this.pohlavi+" "+this.jmeno;
};


var MAX = 100; // Maximální počet 

var lide = [MAX];

for( var i = 0; i < MAX; i++) {
    _tempclovek = new Clovek(i,"muz",makeid());
    lide.push(_tempclovek);
    console.log(_tempclovek.vypis());
};

var table = document.createElement("table");
var tbody = document.createElement("tbody");

for (var i = 0; i < MAX; i++) {
    var row = document.createElement("tr");
    var cell = document.createElement("td");
    _tempclovek = lide[i];
    console.trace(_tempclovek.vypis());
    var cellText = document.createTextNode(_tempclovek); 

    cell.appendChild(cellText);
    row.appendChild(cell);
    tbody.appendChild(row);
};


var body = document.getElementsByTagName("body")[0];
table.appendChild(tbody);
body.appendChild(table);
table.setAttribute("border", "2");

编辑 - 该代码位于HTML文档im <script>标记

中

Answer 1

从元素0开始循环lide，这是整数100而不是Clovek的实例。

Answer 2

您可以使用new Array(MAX)创建长度数组。 这将创建一个100空值的数组。如果您使用push，它会将其附加到数组，因此请改用lide[i]。

代码

function makeid() {
    var text = "";
    var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";

    for (var i = 0; i < 8; i++)
    text += possible.charAt(Math.floor(Math.random() * possible.length));

    return text;
}

var odstavec = document.getElementById("test");

function Clovek(vek, pohlavi, jmeno) {
    this.vek = vek;
    this.pohlavi = pohlavi;
    this.jmeno = jmeno;
}

Clovek.prototype.vypis = function () {
    //console.log(this.vek+" "+this.pohlavi+" "+this.jmeno);
    //odstavec.innerHTML = this.vek+" "+this.pohlavi+" "+this.jmeno;
    return this.vek + " " + this.pohlavi + " " + this.jmeno;
};

var MAX = 100; // Maximální počet 
var lide = new Array(MAX);

for (var i = 0; i < MAX; i++) {
    var _tempclovek = new Clovek(i, "muz", makeid());
    lide[i] = _tempclovek;
    //console.log(_tempclovek.vypis());
};


var table = document.createElement("table");
var tbody = document.createElement("tbody");

for (var i = 0; i < MAX; i++) {
    var row = document.createElement("tr");
    var cell = document.createElement("td");
    var _tempclovek = lide[i];
    console.log("Type Of: " ,typeof(lide[i]))
    console.log(lide)
    console.trace(_tempclovek.vypis());
    var cellText = document.createTextNode(_tempclovek.vypis()); 

    cell.appendChild(cellText);
    row.appendChild(cell);
    tbody.appendChild(row);
};


var body = document.getElementsByTagName("body")[0];
table.appendChild(tbody);
body.appendChild(table);
table.setAttribute("border", "2");

Answer 3

<强> 1。数组定义
使用var lide = [];代替var lide = [MAX];。 Javascript没有提供限制数组中元素数量的本机方法。 [MAX]只会为您提供一个包含一个元素的数组：数字MAX，或者在这种情况下为100。

<强> 2。可变范围
在for循环中，在定义变量var时使用关键字_tempclovek，以便它在本地范围而不是全局范围中使用_tempclovek。如果在js中定义变量时不使用var，则会创建一个全局变量，这会导致意外结果。

第3。对象为字符串
您拨打createTextNode()的电话应该是调用vypis()对象上的Clovek功能。否则，您将获得对象的默认字符串值，即js中的[object Object]。

http://jsfiddle.net/pcbpa9p5/