Проблема с SessionStorage, сохраняющая данные умножения

Question

У меня есть приложение, которое собирает данные из полей ввода и добавляет их в таблицу. См. Мой код ниже. Что я делаю не так?

 function save(){ 

       var name=  $("#name").val(); 
       var email=  $("#email").val(); 
       var telephone= $("#tel").val(); 
       var street= $("#street").val(); 
       var city=  $("#city").val(); 
       var state=  $("#state").val(); 
       var zip=  $("#zip").val(); 


       var inputArray = [name, email, telephone, street, city, state, zip]; 

       var dataToStore = JSON.stringify(inputArray); 

       var uniqueID = ID(); 

       sessionStorage.setItem(uniqueID, dataToStore); 

       display(); 


    }; 


function display(){ 

    var myArraySerialized = sessionStorage.getItem(uniqueID); 
    var myArray = JSON.parse(myArraySerialized); 

    var restoredName = myArray[0]; 
    var restoredEmail = myArray[1]; 
    var restoredTel = myArray[2]; 
    var restoredStreet = myArray[3]; 
    var restoredCity = myArray[4]; 
    var restoredState = myArray[5]; 
    var restoredZip = myArray[6]; 


    //append filled information from the form to the table and 2 buttons - Update and Remove 
     $("#listContent table").append("<tr>"+          
              "<td>" + restoredName + "</td>"+ 
              "<td>" + restoredEmail + "</td>"+ 
              "<td>" + restoredTel + "</td>"+ 
              "<td>" + restoredStreet + "</td>"+ 
              "<td>" + restoredCity + "</td>"+ 
              "<td>" + restoredState + "</td>"+ 
              "<td>" + restoredZip + "</td>"+ 
              "<td>" + "<button>Update</button>" + "</td>" + 
              "<td>" + "<button>Remove</button>" + "</td>" + 
              "</tr>"); 
    }      

var ID = function() { 

    return '_' + Math.random().toString(36).substr(2, 9); 
}; 

Хотя консоль говорит, что uniqueID не определен, и я не понимаю, почему. Когда я использую любую другую переменную - имя, адрес электронной почты, улицу и т. Д. - она ​​прошла, uniqueID - нет. Что я делаю не так? Спасибо за помощь

Answer 1

вместо:

var ID = function() 

сделать:

function ID() 

иначе вы не сможете назвать его, так как переменная будет неопределенным в момент JS считывает код где вы пытаетесь вызвать его.

Чтобы понять разницу между декларациями функций, см. Это question.

отметить также, что var uniqueID = ID(); объявлен в области видимости функции save так display не сможет увидеть его, может быть, вы должны передать его в качестве параметра:

//... 
display(uniqueID); 
//... 

//... 
function display (uniqueID) { 
//... 

Для того, чтобы избежать путаницы, здесь что полный код будет выглядеть следующим образом:

function save() { 
    var name = $("#name").val(); 
    var email = $("#email").val(); 
    var telephone = $("#tel").val(); 
    var street = $("#street").val(); 
    var city = $("#city").val(); 
    var state = $("#state").val(); 
    var zip = $("#zip").val(); 
    var inputArray = [name, email, telephone, street, city, state, zip]; 
    var dataToStore = JSON.stringify(inputArray); 
    var uniqueID = ID(); 
    sessionStorage.setItem(uniqueID, dataToStore); 
    display(uniqueID); 
}; 


function display(uniqueID) { 
    var myArraySerialized = sessionStorage.getItem(uniqueID); 
    var myArray = JSON.parse(myArraySerialized); 
    var restoredName = myArray[0]; 
    var restoredEmail = myArray[1]; 
    var restoredTel = myArray[2]; 
    var restoredStreet = myArray[3]; 
    var restoredCity = myArray[4]; 
    var restoredState = myArray[5]; 
    var restoredZip = myArray[6]; 
    //append filled information from the form to the table and 2 buttons - Update and Remove 
    $("#listContent table").append("<tr>" + 
     "<td>" + restoredName + "</td>" + 
     "<td>" + restoredEmail + "</td>" + 
     "<td>" + restoredTel + "</td>" + 
     "<td>" + restoredStreet + "</td>" + 
     "<td>" + restoredCity + "</td>" + 
     "<td>" + restoredState + "</td>" + 
     "<td>" + restoredZip + "</td>" + 
     "<td>" + "<button>Update</button>" + "</td>" + 
     "<td>" + "<button>Remove</button>" + "</td>" + 
     "</tr>" 
    ); 
} 

function ID() { 
    return '_' + Math.random().toString(36).substr(2, 9); 
};