引用对象'；使用JavaScript从另一个函数中删除函数

我的代码中有以下JS对象：

var myLibrary = {
  name: "John",

  // Functions
  func1: function() {
    alert(this.name);
  },
  func2: function() {
    this.func1();
  },

  // On DOM loaded
  onDOMLoaded: function() {
    this.func1();
    this.func2();
  }
}

document.addEventListener('DOMContentLoaded', myLibrary.onDOMLoaded);

使用脚本标记引用此代码时，会出现以下错误（引用

func2

中的调用）：

这尤其奇怪，因为如果我从DOM中调用函数，它们工作得非常好。例如：

<button onclick="myLibrary.func1()">Func 1</button>
<button onclick="myLibrary.func2()">Func 2</button>

Func 1
职能2

点击按钮完全符合我的要求。我做错了什么？我如何解决这个问题？谢谢你的帮助

可以在这里找到一个演示：

您应该了解is JS

调用

myLibrary.func1（）

时，将使用

myLibrary

上下文调用该函数。但是，当您仅调用

func1

（即

func1=myLibrary.func1；func1（）

）时，将使用全局

窗口

上下文调用此函数

要解决您的问题，您可以使用方法创建与提供的上下文链接的新函数：

document.addEventListener（'DOMContentLoaded'，myLibrary.onDOMLoaded.bind（myLibrary））；

您应该了解is JS

调用

myLibrary.func1（）

时，将使用

myLibrary

上下文调用该函数。但是，当您仅调用

func1

（即

func1=myLibrary.func1；func1（）

）时，将使用全局

窗口

上下文调用此函数

要解决您的问题，您可以使用方法创建与提供的上下文链接的新函数：

document.addEventListener（'DOMContentLoaded'，myLibrary.onDOMLoaded.bind（myLibrary））；

我认为解决上下文问题的最简单方法是

document.addEventListener('DOMContentLoaded',() => { myLibrary.onDOMLoaded(); });

---

我认为解决上下文问题的最简单方法是

document.addEventListener('DOMContentLoaded',() => { myLibrary.onDOMLoaded(); });

---

您在文档中的何处插入引用外部库的

脚本
元素？@ScottMarcus请检查演示链接，该链接没有回答我要问的问题。在小提琴中，连接外部引用的方式与实际代码中不同。请告诉我们，在HTML文档中，您在HTML事件处理程序中包含了引用库的
脚本
元素。
myLibrary.ondomload.bind（myLibrary）
，
此
指接收事件的HTML元素，您在文档中插入引用外部库的
脚本
元素的位置？@ScottMarcus请检查演示链接，该链接没有回答我要问的问题。在小提琴中，连接外部引用的方式与实际代码中不同。请告诉我们，在HTML文档中，引用库的
script
元素包含在何处。
myLibrary.ondomload.bind（myLibrary）
在HTML事件处理程序中，
this
引用接收事件的HTML元素