JavaScript动态插入script的基本思路及实现函数

JavaScript动态插入script的基本思路是通过创建一个script标签，然后将其添加到文档中。具体的实现可以使用以下的函数：

function insertScript(url, callback) {
  var script = document.createElement('script');
  script.type = 'text/javascript';
  script.src = url;

  if (typeof callback === 'function') {
    script.onload = callback;
  }

  document.body.appendChild(script);
}

这个函数接受2个参数，第一个参数是所需要插入脚本的url，第二个参数是回调函数。

下面给出两个使用这个函数的示例：

示例1：动态加载第三方库并执行回调

insertScript('https://cdn.jsdelivr.net/npm/lodash@4.17.4/lodash.min.js', function() {
  // lodash已经被加载完成
  console.log(_.isArray([1,2,3])); // true
});

这个示例中，我们动态地将lodash库插入到文档中，当加载完成后，会执行回调函数。回调函数中，我们可以使用lodash中提供的方法，比如isArray。

示例2：动态加载Google Maps API

var map;

// 初始化地图
function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: -34.397, lng: 150.644},
    zoom: 8
  });
}

// 加载Google Maps API
insertScript('https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap');

这个示例中，我们动态地将Google Maps API插入到文档中，并且在加载完成后会执行名为initMap的回调函数。在回调函数中，我们可以使用Google Maps API中提供的方法来初始化地图。

总的来说，动态插入script标签的好处是可以让我们在需要的时候加载需要的脚本，而不是一次性加载所有的脚本，从而提高网页的加载速度。