ES6 类中的 javascript 'this' 返回未定义

<分区>

我认为这是一个范围问题，但我不确定如何解决这个问题。这是我的代码:http://jsfiddle.net/9k9Pe/1498/

class FrameCreator{

    constructor(){
        this.createFrame();
    }
    createFrame(){
      var iframe = document.createElement('iframe');
      this.iframe = iframe;
      var frameLoaded=this.frameLoaded;
      iframe.onload = function () {
                    frameLoaded();
      };
      document.body.appendChild(iframe);
    }
    frameLoaded(){
            console.log("frame loaded");
    }
}

class CustomFrameCreator extends FrameCreator{
    addContent(){
            console.log(this); // returns the object
    }
    frameLoaded(){
            console.log(this); // returns undefined
    }
}

var frame=new CustomFrameCreator();
frame.addContent();

frameLoaded() 打印未定义，而 addContent 打印对象。

如何解决这个问题，以便在加载框架时我可以在此引用？

谢谢

最佳答案

.bind() 的另一种替代方法是使用 ES6 箭头函数来保留上下文:

iframe.onload = () => {
  this.frameLoaded();
};

class FrameCreator {
  constructor() {
    this.createFrame();
  }
  
  createFrame() {
    var iframe = document.createElement('iframe');
    this.iframe = iframe;
    
    iframe.onload = () => {
      this.frameLoaded();
    };

    document.body.appendChild(iframe);
  }
  
  frameLoaded() {
    console.log("frame loaded");
  }
}

class CustomFrameCreator extends FrameCreator {
  addContent() {
    console.log(this); // returns the object
  }
  frameLoaded() {
    console.log(this); // returns the object now
  }
}

var frame = new CustomFrameCreator();
frame.addContent();

关于ES6 类中的 javascript 'this' 返回未定义，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38273092/

上一篇：javascript - 如何使用 vanilla javascript 触发窗口调整大小事件？

下一篇：javascript - 基于 mapStateToProps 输出重新渲染 connect()ed 组件

相关文章：

javascript - 使用严格模式时无法检查范围变量

javascript - jQuery 解析后获取未定义的 JSON

javascript - 将 ES6 可迭代对象转换为数组

javascript - 无法读取 null 的属性 ____

javascript - sessionStorage 代理类作用域

javascript - 为什么忽略表格指定的水平尺寸？

javascript - 只用JS解析JS

javascript - 如何知道哪些导入和模块可用

javascript - 了解大括号的上下文 '{}'

javascript - JS继承在构造函数中覆盖？