Каким образом этот объект jStorage отличается и почему?

Question

Я работаю над электронным магазином, где элемент, вставленный в корзину, вставлен в ключ jStorage с именем BasketItemNumber_I [где I - это int, а каждый другой элемент получает i ++ в имени].

пример: BasketItemNumber_1, BasketItemNumber_2 и т.д ..

Теперь мой клиент попросил меня, чтобы добавить вход, в котором количество штук элемента будет, так что клиент может изменить Int без необходимости используйте функции + 1 и - 1.

Предположим, у меня есть один предмет внутри корзины. Когда я повторяю этот пункт в консоли, это выглядит следующим образом:

Теперь цель состоит в том, чтобы изменить значение куска объекта к одному пользователю написал на вход, поэтому элемент имеет onfocusout функция, которая выглядит следующим образом:

function onFocusOutFunction(jStorageItemName, i) { 

console.log(jStorageItemName + " Focus Out"); 
var jStorageFocusedOutBasketPiece = $.jStorage.get(jStorageItemName); 

console.log("jStorageFocusedOutBasketPiece: " + jStorageFocusedOutBasketPiece[0].piece); 
var inputFocusedOutBasketPiece = document.getElementById('pieceInput_' + i).value; 
inputFocusedOutBasketPiece = inputFocusedOutBasketPiece.replace(/\D/g,''); 
console.log("inputFocusedOutBasketPiece: " + inputFocusedOutBasketPiece); 

function isNumber(obj) { return !isNaN(parseFloat(obj)) } 

console.log(isNumber(inputFocusedOutBasketPiece)); 


if (inputFocusedOutBasketPiece == jStorageFocusedOutBasketPiece[0].piece){ 
    console.log("Values are the same"); 
}else { 

    console.log("Values are not the same, therefore piece value will be changed"); 

    console.log("Before change"); 
    console.log(jStorageFocusedOutBasketPiece); 

    jStorageFocusedOutBasketPiece[0].piece = parseInt(inputFocusedOutBasketPiece); 

    $.jStorage.set(jStorageItemName, jStorageFocusedOutBasketPiece[0]); 
    $.jStorage.setTTL(jStorageItemName, 604800000); 

    console.log("After the change"); 
    console.log(jStorageFocusedOutBasketPiece); 

    console.log("After jStorage set"); 
    console.log(jStorageItemName); 
    console.log($.jStorage.get(jStorageItemName)); 

    window.location.assign('basket.php'); 

} 

} 

Но всякий раз, когда я изменить значение (так что эта функция может делать это дело). Выход BasketItemNumber_1 выглядит следующим образом:

пункт не указан в корзине больше, так как я должен проверить его с этой частью коды: (Я знаю, что я использую Eval и это плохая практика, я планирую изменить это позже, теперь мне нужно закончить доказательство концепции, а не фактический продукт).

for (var i = 1, len = jStorageIndex.length; i < len; i++){ 


jStorageItemContents = eval("$.jStorage.get('BasketItemNumber_" + i + "')"); 
jStorageItemName  = "BasketItemNumber_" + i 


if (typeof jStorageItemContents == "undefined" || ! (jStorageItemContents instanceof Array)) { 

console.log("An array is empty, skipping."); 

}else { 


if(jStorageItemContents[0].active == "true"){ 

... и так далее.

В принципе, я не вижу элемент, но я вижу «Массив пуст, пропуская» в консоли.

Я должен использовать вышеприведенную логику, поскольку иногда элементы BasketItems пусты (после того, как пользователь их удаляет, их пустые массивы иногда остаются в кеше), поэтому я хочу только отображать те, которые на самом деле что-то включают.

Поэтому я должен спросить: что, как и почему точно изменил способ представления объекта?

Я вижу, разница в том, как они в настоящее время outputed в консоли, более конкретно, в [] и {}, но я не понимаю, что сделал то, что изменить можно и как действовать:

Я предпочел бы изменить способ представления объекта после изменения значения куска в соответствии с форматом, который он когда-то имел, так что мне не нужно возиться с вышеописанной логикой typeof, так как есть другие вещи, которые зависят от него как Что ж.

Примечание: есть и кнопка + и -, которые изменяют значение штук соответственно.

Эти функции:

$(document).on('click', '#addPieceButton', function(){ 

var variable = $(this).attr('itemname'); 
var variable = variable.toString(); 

var basketItem = $.jStorage.get(variable); 


basketItem[0].piece = parseInt(basketItem[0].piece) + 1; 
console.log(basketItem[0].piece); 

    $.jStorage.set(variable, basketItem); 
    $.jStorage.setTTL(variable, 604800000); 

    console.log($.jStorage.get(variable)); 

    location.reload(true); 




}); 

$(document).on('click', '#removePieceButton', function(){ 

var variable = $(this).attr('itemname'); 
var variable = variable.toString(); 

var basketItem = $.jStorage.get(variable); 

basketItem[0].piece = parseInt(basketItem[0].piece) - 1; 

if(basketItem[0].piece == 0){ //If there is 0, we will show the warning 

    if (window.confirm("By changing the pieces to 0 the item will disappear? Do you want to continue?")) { 

     //This will change the active to false, thanks to which it will be no longer displayed 
     for (var i in basketItem) { 
     if (basketItem[i].active == "true") { 
      basketItem[i].active = "false"; 
      break; //Stop this loop, we've found it! 
    } 
    } 
     $.jStorage.set(variable, basketItem); 
     $.jStorage.setTTL(variable, 604800000); 

     console.log($.jStorage.get(variable)); 

     location.reload(true); 

    } 
    else { 
    console.log("User answered NO"); 
    location.reload(true); 
    } 

}else { 


console.log(basketItem[0].piece); 

    $.jStorage.set(variable, basketItem); 
    $.jStorage.setTTL(variable, 604800000); 

    console.log($.jStorage.get(variable)); 

    location.reload(true); 


    } 
}); 

и они работают отлично. Записав это, я как-то почувствую, что причина будет где-то в том, что я не использую jQuery для функции, с которой у меня проблема.

Answer 1

Хорошо, когда вы сохраняете новый пункт после того, как изменения, вы перезаписать исходный массив и ввод в элементе с индексом 0 (в следующей строке):

$.jStorage.set(jStorageItemName, jStorageFocusedOutBasketPiece[0]); 

Вот почему он перестает быть массивом в этой точке.
Возможно, вы захотите только заменить соответствующий элемент в хранилище и снова установить весь массив. Просто устранить индекс:

$.jStorage.set(jStorageItemName, jStorageFocusedOutBasketPiece); 

То, что происходит в том, что вы использовали, чтобы иметь список элементов, и вы переписали это будет только первый из этих пунктов позже.

Сторона Примечание: Вы правы в отношении eval, и, откровенно говоря, нет причин для того, чтобы вы не устранили его немедленно. Просто замените эту часть следующим образом:

jStorageItemName = 'BasketItemNumber_' + i; 
jStorageItemContents = $.jStorage.get(jStorageItemName);