Javascript 为什么Bootstrap4在es6类中使用私有方法？

我在查看Bootstrap4的源代码时，发现它们使用的是es6类以及某种模块模式

下面是一个简化的示例，代码取自

---

这将导致暴露每个方法或属性，包括私有方法或属性。但是，这不会发生在最终产品中。例如，类似于

$（'#myModal'）.modal（''u getConfig'）

的东西不起作用。发生了什么？

它只是向jQuery原型添加了一个函数

\u jQueryInterface

：

  $.fn[NAME]             = Modal._jQueryInterface
  $.fn[NAME].Constructor = Modal
  $.fn[NAME].noConflict  = function () {
    $.fn[NAME] = JQUERY_NO_CONFLICT
    return Modal._jQueryInterface
  }

  return Modal

})(jQuery)

如果您查看

\u jQueryInterface

的代码，您将看到：

static _jQueryInterface(config, relatedTarget) {
  return this.each(function () {
    let data    = $(this).data(DATA_KEY)
    let _config = $.extend(
      {},
      Modal.Default,
      $(this).data(),
      typeof config === 'object' && config
    )

    if (!data) {
      data = new Modal(this, _config)
      $(this).data(DATA_KEY, data)
    }

    if (typeof config === 'string') {
      if (data[config] === undefined) {
        throw new Error(`No method named "${config}"`)
      }
      data[config](relatedTarget)
    } else if (_config.show) {
      data.show(relatedTarget)
    }
  })
}

如果我们仔细观察，您将看到类Modal的实例被保存为

数据

：

    if (!data) {
      data = new Modal(this, _config)
      $(this).data(DATA_KEY, data)
    }

您可以使用与脚本相同的方式访问它（但只能在第一次创建它之后）：

DATA\u键

是

bs.modal

编辑：

---

函数

\u getConfig

实际上正在被调用，只是函数正在返回jQuery对象，而不管

\u getConfig

的结果是什么。

可能

modal

会检查名称是否以下划线开头……正确，因此基本上这些私有方法实际上不是私有的

    if (!data) {
      data = new Modal(this, _config)
      $(this).data(DATA_KEY, data)
    }

let data    = $(this).data(DATA_KEY)

$('#myModal').modal('_getConfig');