How to make values ​​from array-object for attributes dynamic from multiple choices?

Question

JavaScript

1. There is json where all the data is for the basket.
2. There are two objects: var cart = {}; and var cart1 = { 2021: 0, 2022: 0, 2023: 0, 2024: 0 };
3. I extract data:

$.getJSON('goods.json', function (data)
for (var key in data) {
if ((cart) != undefined) {
out1 += '<button class="minus" data-art="' + key + '"">-</button>';
            out1 += '<button class="number" data-art="' + key + '">' + cart1[key] + '</button>';
            } else {
            out1 += '<button class="number" data-art="' + key + '">' + cart[key] + '</button>';
            }
out1 += '<button class="plus" data-art="' + key + '">+</button>
}
function plus() {
    var articul = $(this).attr('data-art');
    if (cart[articul] != undefined) {
        cart[articul]++;
    }
    else {
        cart[articul] = 1;
    }
    localStorage.setItem('cart', JSON.stringify(cart)); 
    loadGoods();
};

When I remove the "cart1" object, the values ​​go to "undefined" but increase or decrease when clicked. When "cart1" is set, the values ​​for each attribute = 0 , and are in a static state, although the values ​​in localstorage come in as expected on a per-attribute basis. Another strange thing is that the values ​​from the "cart1" array are taken individually as expected, although the operation is not set for this. I'm sure there is an option just with my experience in programming I beat around the bush and can't put together this solution. I will be grateful for advice.