How to prevent an array storing items from local storage from initializing each time

const input = document.querySelector('#task_list');
const btn = document.querySelector('.add');
const items = document.querySelector('.items');
let array_of_items = [];

btn.addEventListener('click', () => {
    if (input.value !== '') {
        let list_item = document.createElement('li');
        list_item.textContent = input.value;
        items.appendChild(list_item);
        array_of_items.push(list_item.textContent);
        console.log(array_of_items);
        localStorage.setItem('Tasks', JSON.stringify(array_of_items));
        input.value = '';
    }
})


function retrieveTasks () {
    if (array_of_items.length > 0) {
        for (let i = 0; i < retrieved_tasks.length; i++) {
            let list_item = document.createElement('li');
            list_item.textContent = retrieved_tasks[i];
            items.appendChild(list_item);
        }
    }
}

window.onload = retrieveTasks;


// The problem with this code is that the array is initialises to an empty array each time, I only overwriting previous tasks