JS插件开发指南_IIFE模式封装

(function (global, factory) {
  // 插件逻辑写在这里
})(this, function (global) {
  // 实际的插件实现
});

(function (global, factory) {
  // 判断是否支持模块化（如CommonJS、AMD）
  if (typeof exports === 'object' && typeof module !== 'undefined') {
    module.exports = factory();
  } else if (typeof define === 'function' && define.amd) {
    define(factory);
  } else {
    global.MyPlugin = factory();
  }
})(this, function () {
  // 插件主体逻辑
  function MyPlugin(options) {
    this.settings = Object.assign({
      color: 'blue',
      size: 'medium'
    }, options);
    this.init();
  }

  MyPlugin.prototype.init = function () {
    console.log('插件已初始化', this.settings);
  };

  MyPlugin.prototype.setColor = function (color) {
    this.settings.color = color;
    console.log('颜色已设置为：' + color);
  };

  // 返回构造函数，供外部使用
  return MyPlugin;
});

<script src="myplugin.js"></script>
<script>
  const plugin = new MyPlugin({ color: 'red' });
  plugin.setColor('green');
</script>