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

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

javascript oop

如何在javascript上将对象属性绑定到此关键字？,javascript,oop,pixi.js,Javascript,Oop,Pixi.js,如何使用此关键字访问、更改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);

如何使用此关键字访问、更改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

更新

好的，我用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);

    }
}

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

您无法更改函数体中此所指的内容

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

可以将函数作为对象的属性调用（
```
obj.func（）
```
），以便将对象绑定到函数内的
```
this
```

您可以使用

new

从“类”实例化对象。这将把函数中的

This

绑定到一个对象，该对象的原型是您的function

prototype

属性，它也是

新表达式的（默认）返回值。（本质上，函数接收被构造为this
的对象，使其成为“构造函数”）


您可以使用函数的.bind（obj）
方法生成另一个函数，该函数在调用时始终将对象绑定为this
您可以使用.call（…）
或.apply（…）
方法，并在函数中作为this
传递所需的任何对象作为第一个参数


如您所见，所有这些都是确定此

在调用站点中引用了什么的方法（甚至在之前，在绑定的情况下），因此您无法在函数调用本身中更改此指向的内容

然而，您似乎在用JavaScript进行OOP操作方面有点困难，所以让我来谈谈您的担忧

您似乎正在使用

createEmoji

函数作为构造函数，但您正在

PIXI.Sprite

上返回一个实例。这似乎是造成混淆的主要原因：为什么要返回不属于此的内容？感觉不对

事实上，这并不是你真正想要的。相反，将

createEmoji

视为一个自由函数。如果您有Java背景，请考虑

static

方法。您将其命名为

var emoji=createEmoji（…）

并将其记录为返回一个

PIXI.Sprite

。它本质上是一种静态工厂方法。现在此调用中没有

此

，因此幸运的是，您现在有了更清晰的图像

另一个解决方案是将

createEmoji

转换为一个成熟的

Emoji

类，使精灵成为该类的成员（即，将其称为

this.sprite

而不是

）。在本例中，构造函数将您的新emoji实例设置为

this

，您不需要返回任何内容。除非你的表情符号需要它自己的表现和行为，不同于一个简单的精灵，否则我不会这样做，因为它的方式更复杂

tl；dr：不要将

createEmoji

用作构造函数，而是用作返回精灵的函数。就像那样，你所有关于这个e应该是什么的直觉都消失了，因为没有这个。

你不能改变这个在函数体中所指的内容