Получать количество товаров в корзине JS

Всем привет, никак не могу разобраться как получить текущее количество элементов в корзине. Так же были попытки добавить это значение в localStorage, получалось NuN. Так же не знаю, как после удаления заново получать это количество.

window.onload = function() {
    let cart = {};
    let goods = {};       

    function loadCartToStorage() {
        if (localStorage.getItem('cart') != undefined) {
            cart = JSON.parse(localStorage.getItem('cart'));
        }
    }
    loadCartToStorage();

    let getJSON = function(url, callback) {
        let xhr = new XMLHttpRequest();
        xhr.open('GET', url, true);
        xhr.responseType = 'json';
        xhr.onload = function() {
            let status = xhr.status;
            if (status === 200) {
                callback(null, xhr.response);
            } else {
                callback(status, xhr.response);
            }
        };
        xhr.send();
    }
    getJSON('https://spreadsheets.google.com/feeds/list/1jpfc_qA__UhF7zcqlS_axsn-qi9xr0r8DXFSr1M2f-Q/od6/public/values?alt=json', function(err, data) {
        console.log(data);
        if (err !== null) {
            alert('Error: ' + err);
        } else {
            data = data['feed']['entry'];
            console.log(data);
            goods = arrayHelper(data);
            console.log(goods);
            document.querySelector('.shop-field').innerHTML = showGoods(data);
            showCart();
        }
    });
    function showGoods(data) {
        let out = '';
        for(let i = 0; i < data.length; i++) {
            if (data[i]['gsx$show']['$t'] == 1) {            
                out += `<div class="col-lg-3 col-md-3 col-sm-2 text-center">`;
                out += `<div class="goods">`;
                out += `<h5>${data[i]['gsx$name']['$t']}</h5>`;
                out += `<img class="good-photo" src="${data[i]['gsx$image']['$t']}" alt="">`;
                out += `<p class="cost">Цена: ${data[i]['gsx$cost']['$t']}грн</p>`;
                out += `<p class="cost">На складе: ${data[i]['gsx$kg']['$t']}кг</p>`;
                out += `<p><button class="btn btn-success buy" type="button" data="${data[i]['gsx$id']['$t']}" name="add-to-cart">Купить</button></p>`
                out += `</div>`;
                out += `</div>`;
            }                                                                  
        }
        return out;
    }
    document.onclick = function(e) {
        let counter = document.querySelector('.counter');
        let counterVal = parseInt(counter.innerHTML);

        if (e.target.attributes.name != undefined) {
            if (e.target.attributes.name.nodeValue == 'add-to-cart') {
                addToCart(e.target.attributes.data.nodeValue);
            } else if (e.target.attributes.name.nodeValue == 'delete-goods') {
                delete cart[e.target.attributes.data.nodeValue];
                showCart();
                localStorage.setItem('cart', JSON.stringify(cart));
            } else if (e.target.attributes.name.nodeValue == 'plus-goods') {
                cart[e.target.attributes.data.nodeValue]++;
                showCart();
                localStorage.setItem('cart', JSON.stringify(cart));
            } else if (e.target.attributes.name.nodeValue == 'minus-goods') {
                if (cart[e.target.attributes.data.nodeValue] - 1 == 0) {
                    delete cart[e.target.attributes.data.nodeValue];
                } else {
                    cart[e.target.attributes.data.nodeValue]--;
                }           
                showCart();
                localStorage.setItem('cart', JSON.stringify(cart));
            }
        }                
    }
    function addToCart(elem) {
        if (cart[elem] !== undefined) {
            cart[elem]++;
        } else {
            cart[elem] = 1;
        }
        console.log(cart);
        showCart();
        localStorage.setItem('cart', JSON.stringify(cart));
    }
    function arrayHelper(arr) {
        let out = {};
        for (let i = 0; i < arr.length; i++) {
            let temp = {};
            temp['articul'] = arr[i]['gsx$articul']['$t'];
            temp['name'] = arr[i]['gsx$name']['$t'];
            temp['category'] = arr[i]['gsx$category']['$t'];
            temp['cost'] = arr[i]['gsx$cost']['$t'];
            temp['image'] = arr[i]['gsx$image']['$t'];
            out [arr[i]['gsx$id']['$t']] = temp;
        }
        return out;
    }

    function showCart() {
        let ul = document.querySelector('.cart');
        let total = document.querySelector('.final-prise');
        ul.innerHTML = '';
        sum = 0;
        for (let key in cart) {
            let li = '<li>';
            li += goods[key]['name'] + ' ';
            li += cart[key] + 'кг.' + ' ';
            li += goods[key]['cost'] * cart[key] + 'грн '; 
            li += `<div class="controls">`          
            li += `<button class="btn btn-success control" name="plus-goods" data="${key}">+</button> `;
            li += `<button class="btn btn-success control" name="minus-goods" data="${key}">-</button> `;
            li += `<button class="btn btn-success control" name="delete-goods" data="${key}">x</button> `;
            li += `</div>`
            li += '</li>'
            sum += goods[key]['cost'] * cart[key];
            ul.innerHTML += li;
        }
        total.innerHTML = 'Итого: ' + sum + 'грн';       
    }
}

Ответы (0 шт):