overwrite js file with another js file without webserver

Explanation:
I am working on a local web application which should use a local javascript file as database. Why? Because I dont want to use any database for this project as I want to avoid using a webserver, mainly to find out “what is possible“. So far so good, I am able to display the provided data in a html table.

Question:
How could I overwrite the existing data.js with this approach?

data = [
    {"firstname" : "Dagobert", "lastname": "Duck"},
    {"firstname" : "Daisy", "lastname": "Duck"},
    {"firstname" : "Mickey", "lastname": "Mouse"},
    {"firstname" : "Minnie", "lastname": "Mouse"}
  ];

<!DOCTYPE html>
<html lang="de">

<head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <!-- title -->
    <title>Example</title>

    <!-- jQuery -->
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

    <!-- Import JS-->
    <script type="text/javascript" src="data.js"></script>
</head>

<body>
    <table id="table">
        <tbody>
            <th>Firstname</th>
            <th>Lastname</th>
            <!-- filled by script -->
        </tbody>
    </table>
    <button id="overwrite">overwrite</button>
    
    <script>
        document.addEventListener("DOMContentLoaded", function() {
            let table = document.getElementById("table")
           
            data.forEach(item => {
                var row = `<tr>
                            <td class="name">${item.firstname}</td>
                            <td class="name">${item.lastname}</td>
                            </tr>`

                $("#table tbody").append(row)
            });
        })

        document.getElementById("overwrite").addEventListener("click", function() {
            console.log("change existing data.js")
            
            update = [
            {"firstname" : "Dagobert", "lastname": "Duck"},
            {"firstname" : "Daisy", "lastname": "Duck"},
            {"firstname" : "Mickey", "lastname": "Mouse"},
            {"firstname" : "Minnie", "lastname": "Mouse"},
            {"firstname" : "Cat", "lastname": "Karlo"},
            {"firstname" : "Gus", "lastname": "Goose"}
        ];

        })

    </script>
</body>

</html>