toString()没有显示任何内容

时间:2018-04-30 01:50:01

标签: javascript json object local-storage tostring

我正在为学校做一个项目。在项目中,我需要调用一个自制的toString来显示我的构造函数的所有键和值。我应该填写表格并将我的电脑存放在localStorage中。

我的Logiciels功能

function Logiciels(ordiConfigure){
    //I start at one so I dont't get the first input which is text type
    for (var i = 1; i < document.forms[2].getElementsByTagName("input").length; i++) {
        if(document.forms[2].getElementsByTagName("input")[i].checked == true)
            ordiConfigure.Logiciels[i] = document.forms[2].getElementsByTagName('input')[i].value;

    ordiConfigure.Logiciels = ordiConfigure.Logiciels.filter(valeur => valeur !== null);
    return ordiConfigure.Logiciels;
}

我如何存放电脑

var ordiConfigure = new pcConfig();
    ordiConfigure.Logiciels = Logiciels(ordiConfigure);
    localStorage.setItem("ordinateur", JSON.stringify(ordiConfigure));

我的toString()

pcConfig.prototype.toString = function() {
    var caracteristiques = "<ul>";
    for (var proprieteOrdinateur in this){
        if(typeof(this[proprieteOrdinateur]) !== "function")
            caracteristiques += "<li>" + proprieteOrdinateur + " : " + this[proprieteOrdinateur] + "</li><br/>";
    }
    caracteristiques += "</ul>";
    return caracteristiques;
};

继承人的构造函数

function pcConfig(){
    this.Taille = document.forms[2].getElementsByTagName('select')[1].value;
    this.Systeme = document.forms[2].getElementsByTagName('select')[0].value;
    this.Identifiant = document.forms[2].getElementsByTagName('input')[0].value;
    //This an array for the softwares chosen
    this.Logiciels = logiciels; 
}

以及我的称呼方式

<script>
        document.getElementsByTagName('div')[0].innerHTML = JSON.parse(localStorage.getItem("ordinateur")).toString();
    </script>

picture of the page which possesses the form

它返回null,我不知道为什么?任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:0)

您将src="https://player.vimeo.com/video/255482396" width="100%" 存储为ordiConfigure中的JSON字符串。问题是,一旦将某些内容字符串化为JSON,它就无法连接到它的任何内容(例如来自具有自定义localStorage方法的类)。一旦JSON再次被解析,它只是一个由键值对组成的简单Javascript对象,而不是其他任何东西。

如果您希望在从toString检索项目后调用自定义toString方法,那么在将JSON解析回来时,您的localStorage方法需要可用一个东西。例如:

toString

另一种选择是在将对象存储到localStorage之前将对象转换为HTML字符串

(旁注:function ordinateurToString(ordinateur) { var caracteristiques = "<ul>"; for (var proprieteOrdinateur in ordinateur){ if(typeof(ordinateur[proprieteOrdinateur]) !== "function") caracteristiques += "<li>" + proprieteOrdinateur + " : " + ordinateur[proprieteOrdinateur] + "</li><br/>"; } caracteristiques += "</ul>"; return caracteristiques; } const ordinateur = JSON.parse(localStorage.getItem("ordinateur")); document.querySelector('div').innerHTML = ordinateurToString(ordinateur); 是不必要的。最好使用选择单个元素的document.getElementsByTagName('div')[0],而不是使用返回集合的方法,然后选择该集合中的第一个元素)< / p>