Hide the data array from php in javascript [closed]

The problem – hide the data received from php array in a web-page and passed on to a hidden JavaScript.

Current html and JavaScript

<?php
  define('MyConst', TRUE);
  require_once( "/home/xxxxx/constants.php");

  // Create connection
  $conn = new mysqli(DB_HOST, DB_USER, DB_PASS, DB_NAME);
  $query = "SELECT `field1`, `field2` FROM `datarecords`";
  $stmt = $conn->prepare($query);
  $stmt->execute();
  $stmt->bind_result($field1, $field2);
  $resultdata = array();
  while($stmt->fetch()){
    $toto  = array();
    $toto['field1'] = $field1;
    $toto['field2'] = $field2;
    array_push($resultdata, $toto);
  }
  //print "<pre>";print_r($resultdata);print "</pre>";

 //CLOSE the connection
 $conn->close();
?>

<!DOCTYPE html>
<html>
<head>
<style>
  css code
</style>
</head>
<script>
  function execJS(){
    var jPass = <?php echo json_encode($resultdata); ?>;
    showStatus(jPass);
  }
</script>
<script type="text/javascript" src="script/js.js" language="javascript">
</script>

<body onload="execJS()">
<table id="stylewithcss">

</table>
    
</body>
</html>

When the page is loaded, the javascript gets executed in the order (this method helped me to hide the js.js) –> execJS() and then js.js and all expected results are shown. However on inspect (in Firefox browser), the data inside the ‘$resultdata’ is shown. Would like to hide this data. Any help / suggestion is appreciated.