从公共方法访问私有对象变量

access private object variable from public method

本文关键字：对象 变量 访问 方法      更新时间：2023-09-26

如何访问函数loadImage中的ctx？我看到过这样的片段，但当我尝试时，它就是不起作用。它总是说"this"或"this.ctx"或"ctx"是未定义的。

var MyClass= function(canvasId){
  var canvas = document.getElementById(canvasId);
  var ctx = canvas.getContext("2d");
};
MyClass.prototype.loadImage = function(imageSrc){
    var image = new Image();
    image.src = imageSrc;
    //cannot access this or ctx
    image.onload = function(){
        this.ctx.drawImage(image,0,0);
    };
    //can't even access it here:
    ctx.drawImage(image,0,0);
};
//window.onload = function(){
 var myObject= new MyClass("myCanvas");
 myObject.loadImage('myImage.jpg');

如何在函数loadImage中访问ctx？

你不能。除非在构造函数的作用域内创建loadImage函数。请参阅Javascript：是否需要为对象中的每个变量放置this.var？详细信息。

我看到过与这个完全一样的片段

然后这些片段也不起作用。

从proptotype方法访问ctx的唯一方法是使用this关键字将其设置为实例属性。

var MyClass = function (canvasId) {
    this.canvas = document.getElementById(canvasId);
    this.ctx = this.canvas.getContext("2d");
};
MyClass.prototype.loadImage = function (imageSrc) {
    var image = new Image();
    image.src = imageSrc;
    var self = this;
    image.onload = function () {
        self.ctx.drawImage(image, 0, 0);
    };
    this.ctx.drawImage(image, 0, 0);
};

请注意，在映像onload处理程序中，您有不同的上下文：this不再指向MyClass实例，而是指向映像对象实例。例如，您可以通过在self等变量中保存对适当this的引用来克服它。

相关文章：