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

Question

您好！

我对 Javascript 比较陌生。我更擅长 Java，所以我对 Javascript 的很多事情感到困惑。我创建了 class Clovek 有一些变量和函数。后来我创建了 array Lide ，里面有 MAX (100) 个 Clovek 对象。因此，当我稍后调用函数 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 空值数组。如果你使用推送，它会将它追加到数组中，所以使用 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 循环中，在定义变量 _tempclovek 时使用关键字 var，以便它在局部范围而不是全局范围内使用 _tempclovek。如果在js中定义变量时不使用var，则会创建一个全局变量，这会导致意想不到的结果。

3。作为字符串的对象
您对 createTextNode() 的调用应该是在您的 Clovek 对象上调用 vypis() 函数。否则，您将获得对象的默认字符串值，在 js 中为 [object Object]。

http://jsfiddle.net/pcbpa9p5/