toString () ничего не показывает - PullRequest
0 голосов
/ 30 апреля 2018

я делаю проект для школы. В проекте мне нужно вызвать самодельный toString, чтобы показать все ключи и значения моего конструктора. Я должен заполнить форму и сохранить свой компьютер в localStorage.

Функция My 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));

My 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>

изображение страницы, которая имеет форму

Возвращается ноль, и я не знаю почему? Любая помощь будет принята с благодарностью.

1 Ответ

0 голосов
/ 30 апреля 2018

Вы сохраняете ordiConfigure как строку JSON в localStorage. Проблема состоит в том, что, если что-то строковое в виде JSON, оно не имеет связи с тем, из чего оно произошло (например, из класса с пользовательским методом toString). После повторного анализа JSON это просто простой объект Javascript, состоящий из пар ключ-значение и ничего более.

Если вы хотите иметь возможность вызывать свой пользовательский метод toString после извлечения элемента из localStorage, ваш метод toString должен быть доступен в то время, когда вы анализируете JSON обратно в объект. Например:

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);

Другим вариантом является преобразование объекта в строку HTML перед сохранением в localStorage.

(Примечание: document.getElementsByTagName('div')[0] не нужно. Лучше использовать querySelector, который выбирает отдельный элемент, чем использовать метод, который возвращает коллекцию, а затем выбирает первый элемент в этой коллекции)

...