How do I get JSON data from an external file in jQuery and ensure the data is loaded before the remainder of the script

see documentation on getJson

if you want it should run and other section should wait, you can set ‘asysn’ : false
but it is not a good idea, since the code after the ajax will wait until it completes.

OR

// check the meaning of done, fail, always
    $.getJSON( "url", function() {
    
    }).done(function(){
    
        // your rest of the code
        
    });

or you may try custom trigger event

$(function(){

    $.getJSON( "url", function() {

    }).done(function(){
        $( document ).trigger( "jsonSuccess", [ "bim", "baz" ] );
    });

    $( document ).on( "jsonSuccess",function(event, var1, var2){
        // will execute after the 'getJSON' success 
    });
    
    // other codes can be execute from here, it will not wait

});