How to pass PHP (index.php file ) Variable value to external JAVASCRIPT .js File?

You have jQuery tag in there, so I am going to give you this... use Ajax:

test.php

<?php

// Handle Ajax Request
if (isset($_GET['loadData']))
{
    // Query your db here, im building dummy data
    $results = array();
    for ($i = 0; $i < 10; $i++) {
        $results[] = 'Data '. $i;
    }

    // Return Data
    exit(json_encode($results));
}

?>

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">

// Load Data Via Ajax
$.getJSON("test.php?loadData", function(bookedSeats)
{
    console.log(bookedSeats);
});

</script>

When the page loads, we get the result like this:

<script>
  var bookedSeats = new Array();
  <?php foreach($reg_table as $key => $val)
  { ?>
    bookedSeats.push('<?php echo $val; ?>');
  <?php }?>
</script>

This can be greatly simplified and made immune to XSS:

<script>
  var bookedSeats = <?php echo json_encode(array_values($reg_table)); ?>;
</script>

You can now refer to bookedSeats in your external .js file, but only if that file is being run after this inline script has been placed. In other words, putting:

<script src="external.js"></script>

after the <script>...<?php ... ?>...</script> is okay, but putting it before is only okay if you are deferring its execution - it's just safer to put it after ;)

I have an alternative solution for you eventually even if Latheesan Kanes's one is right.

Mine is just given as a trivial exemple if you have access to a constructor in your Javascript object in the table.js file.

    <script>
  var bookedSeats = new Array();
person=new Object();
  <?php foreach($reg_table as $key => $val)
  { 
// here a javascript object
?>

person.firstname="John"; // of course replace firstname and John by your informations
  <?php }?>


    // then call table.js constructor
var objectInTableDotJS = new YourConstructor(person); // now in table.js you need to make modification :)