CRUD - persistent storage application for a school to store students' data

Hello. I tried my hand on creating a persistent storage application for a school. It’s very simple: I wanted to achieve the basics. I’d be very appreciative of some feedback. Thanks.

let containerDataStudents = {};
console.log(containerDataStudents);


let clock = 0;
let n = [];
console.log(n);
let clockContainer = new Map([]);
console.log(clockContainer);

const add = () => {containerDataStudents[clock] = {name: '', age: 0}};
add();

const button = () => {insertData()};

const insertData = () => {
    
    let studentName = document.getElementById('name');
    if(studentName.value === '') {
        console.log('cannot leave empty');
        
    } else {
        containerDataStudents[clock].name = studentName.value; 
        clockContainer.set(containerDataStudents[clock].name = studentName.value, clock);
        console.log(clockContainer.get(studentName.value));
        
    };
    let studentAge = document.getElementById('age');  
    if((studentName.value || studentName.value === '') && (studentAge.value === '')) {
        console.log('cannot leave empty');
         
    } else {
        containerDataStudents[clock].age = studentAge.value;
        clockContainer.set(containerDataStudents[clock].age = studentAge.value, clock);
    };
    
    if(studentName.value && studentAge.value) {
        containerDataStudents[clock].id = Math.random(2).toFixed(2) * 1000;
        //n.push(Object.entries(containerDataStudents[clock]))
        n.push((containerDataStudents[clock]));
        add2();
        
    };
    //console.log(n[0][0][0])
};

const add2 = () => {clock++; containerDataStudents[clock] = {name: '', age: 0}; document.getElementById('name').value = ''; document.getElementById('age').value = '';};

let find2;
let find2Value;
function find() {
    find2 = document.getElementById('find');
    let foundName = n.find(({name}) => name === find2.value);
    let foundAge = n.find(({age}) => age === find2.value);
    //let foundId = n.find(({id}) => id === find2.value); Não consigo acessar o id

    if(typeof foundAge !== 'undefined' && typeof foundName !== 'undefined') {
        if(foundName.name !== find2.value) {
            console.log('This name does not exist');
        } else {
            console.log(foundName.name);
        };
        if(foundAge.age === find2.value) {
            console.log(foundAge.age);
        };
        
    };
    console.log(foundName);
    console.log(foundAge);        
};

let updateInfo
const modifyContent = () => {
    updateInfo = document.getElementById('update');
    
    let foo = prompt('Enter new data');
    for(let i = 0; i < n.length; i++) {
        for(keys in n[i]) {
        console.log(n[i][keys]);
            if(containerDataStudents[i][keys] === updateInfo.value) {
                //containerDataStudents.n[i].keys = updateInfo.value
                containerDataStudents[i][keys] = foo;
                console.log(containerDataStudents);
           };
        };
    };
};
   
function deleteContent() {
    deleteInfo = document.getElementById('delete');
    for(let i = 0; i < n.length; i++) {
        for(keys in n[i]) {
        //console.log(n[i][keys]);
            if(n[i][keys] === deleteInfo.value) {
                //containerDataStudents.n[i].keys = updateInfo.value
                delete n[i][keys];
                console.log(containerDataStudents);
           };
        };
    };
};

An object in memory isn’t persistent storage. You need a database. Or for faux persistent storage, you can use something like localStorage/sessionStorage.

I didn’t really look at the code and I’m not sure what you are asking here, but I do believe you want to avoid using bracket notation to interact with a Map.


As an aside, I would also think you may have to consider any laws surrounding saving this type of personal information. Not sure how old the students are or which country you are in.

Thanks for letting me know about the bracket notation and a Map.