Question

如何使用此关键字访问，更改PIXI.Sprite（或其他对象）属性并将其绑定到函数范围。使用不同的名称而不是这个似乎很荒谬，但我无法理解。

在 javascript 上解决此类oop问题的正确方法是什么。

function createEmoji(x , y ) {
    let t = new PIXI.Texture.fromImage(`assets/image (${1+~~(Math.random()*80)}).png`);
    let i = new PIXI.Sprite(t);

    i.anchor.set(.5);
    i.angle = Math.random() * 360;
    i.mag = Math.random() * 3;
    i.x = x;
    i.vx = Math.cos(i.angle) * i.mag;
    i.rotation = i.angle;
    i.tint = Math.random() * 0xffffff;
    i.y = y;
    i.vy = Math.sin(i.angle) * i.mag;
    i.ax = 0;
    i.ay = 0;
    i.speed = Math.random() / 100;

    container.addChild(i);
    return i;
}

添加 i.bind（this）给出

Uncaught TypeError: i.bind is not a function
at new createEmoji

更新

Okey我用javascript所谓的class关键字理解这一点。

class createEmoji extends PIXI.Sprite {
    constructor(x, y) {
        super();
        this.texture = new PIXI.Texture.fromImage("assets/emoji.png");
        this.x = app.rw;//random position method for x and y
        this.y = app.rh;
        this.t = Vec(x, y, test, window);//another method returns ObservablePoint
        this.scale.set(.5 + Math.random() * .5);
        this.anchor.set(.5);

    }
}

这解决了我正在寻找的问题。

Answer 1

您无法更改this在函数体内引用的内容。

有四种方法可以确定this所指的内容：

您可以将函数作为对象（obj.func()）的属性调用，以便该对象绑定到函数内的this。
您可以使用new来实例化＆＃34;类＆＃34;中的对象。这会将函数内部的this绑定到具有函数prototype属性作为其原型的对象，该对象也将是new表达式的（默认）返回值。（本质上，函数接收构造为this的对象，使其成为＆＃34;构造函数＆＃34;）。
您可以使用函数的.bind(obj)方法生成另一个函数，该函数在调用时始终将对象绑定为this。
您可以使用.call(…)或.apply(…)方法，并将函数内作为this的任何对象作为第一个参数传递。

如您所见，所有这些都是确定this从呼叫网站中引用的方式的方法（或者甚至之前，在bind的情况下），所以您只是无法更改this在函数调用中指向的内容。

但是，您似乎在使用OOP处理JavaScript时遇到了一些困难，所以让我来解决您的问题。

您好像使用createEmoji函数作为构造函数，但是您正在PIXI.Sprite上返回一个实例。这似乎是混淆的主要原因：为什么你会在这里找回一些不是this的东西？感觉不对。

确实，这不是你想要的。相反，将createEmoji视为自由函数。如果您来自Java背景，请考虑static方法。您将其称为var emoji = createEmoji(...);并将其记录为返回PIXI.Sprite。它本质上是一种静态工厂方法。现在没有this参与这个电话，幸运的是你现在有一个更清晰的画面。

另一个解决方案是将createEmoji转换为完全成熟的Emoji类，使精灵成为类的成员（即，将其称为this.sprite而不是{{1 }}）。在这种情况下，构造函数会将您的新表情符号实例设为i，并且您不需要返回任何内容。除非你的表情符号需要它自己的表示和行为不同于一个简单的精灵，我不会这样，因为它的方式更复杂。

tl; dr ：不要使用this作为构造函数，而是作为返回精灵的函数。就这样，你所有关于createEmoji e应该消失的直觉，因为没有this参与。

如何在javascript上将对象属性绑定到此关键字？

1 个答案: