JS、Socket.io、Phaser3、未創建物件-有解無憂

我是 JS、phaser3 和 Socket.io 新手，我真的很想學習。

代碼背景關系：

Phaser3
套接字.io
socket連接前游戲房間加載狀態
生成 NPC 和玩家
當嘗試在創建的同一回呼中訪問 NPC（質量）精靈時失敗

問題：

無法訪問 sprite 屬性，通常看起來物件不是一開始就創建的

在連接到套接字服務器后，我在 Phaser3 的“create()”函式中監聽“universeState”的套接字。index.js：

this.socket.on('universeState',(universe)=>
    {
        console.log(`mass? ${JSON.stringify(universe.sys.mass[1].id)}`)
        for(let i = 0;i < universe.sys.mass.length; i  )
        {
            console.log(universe.sys.mass[i].id,universe.sys.mass[i].x,universe.sys.mass[i].y,universe.sys.mass[i].asset);
            this.utils.genMass(universe.sys.mass[i].id,universe.sys.mass[i].x,universe.sys.mass[i].y,universe.sys.mass[i].asset);
            console.log(`check: 3 ${JSON.stringify(this.state.state.mass)}`);
            this.state.state.mass[universe.sys.mass[i].id].sprite.setScale(0.5,0.5); //issue here
            console.log('check: 4');

            this.physics.add.collider(this.state.state.mass[universe.sys.mass[i].id].sprite, this.state.state.playerMass[this.state.id].sprite, function(mass, player) {
                mass.destroy();
                player.setScale(player.scaleX   0.03);
                let camera = this.cameras.main;
                camera.zoomTo(camera.zoom * 0.975);
            }, null, this);
        }

用于在 utils.js 中創建“質量”的函式：

genMass(id,x,y,tex)
{
    console.log(`creating sprite with operands: ${id},${x},${y},${tex}`);
    let sprite = this.scene.physics.add.sprite(50,50,tex)//needs to be a physics object
    if(id.substring(0,5)=='mass:')
    {
        console.log(`is equal`)
    }
    id.substring(0,4)=='mass:'?
    this.scene.state.state.mass[id] = {id:id,sprite:sprite,x:x,y:y}:
    this.scene.state.state.playerMass[id] = {id:id,sprite:sprite,x:x,y:y}; //generate an extra parameter argument for quantified mass
    console.log('check: 0');
    id.substring(0,4)=='mass:'?
    this.scene.physics.world.enable(this.scene.state.state.mass[id].sprite):
    this.scene.physics.world.enable(this.scene.state.state.playerMass[id].sprite); 
    console.log('check: 1');
    id.substring(0,4)=='mass:'?
    this.scene.state.state.mass[id].sprite.body.collideWorldBounds = true:
    this.scene.state.state.playerMass[id].sprite.body.collideWorldBounds = true;
    console.log('check: 2');

}

在第一個代碼片段中，所有內容首先出現錯誤，其中注釋為“issue here”。由于我使用的是 webpack，捆綁的檔案幾乎沒有幫助。安慰：

Player ID returned:null
bundle.min.js:1 connected to game
bundle.min.js:1 mass? "mass:3961482"
bundle.min.js:1 mass:7107097 19134 14999 arc_purple
bundle.min.js:1 creating sprite with operands: mass:7107097,19134,14999,arc_purple
bundle.min.js:1 is equal
bundle.min.js:1 check: 0
bundle.min.js:1 check: 1
bundle.min.js:1 check: 2
bundle.min.js:1 check: 3 {}
bundle.min.js:1 Uncaught TypeError: Cannot read properties of undefined (reading 'sprite')
    at Q.<anonymous> (bundle.min.js:1:978636)
    at Q.i.emit (bundle.min.js:1:40837)
    at Q.emitEvent (bundle.min.js:1:969227)
    at Q.onevent (bundle.min.js:1:969030)
    at Q.onpacket (bundle.min.js:1:968708)
    at et.i.emit (bundle.min.js:1:40837)
    at et.ondecoded (bundle.min.js:1:973286)
    at q.i.emit (bundle.min.js:1:40837)
    at q.add (bundle.min.js:1:964368)
    at et.ondata (bundle.min.js:1:973261)

問題：

Why is the object I created empty when logging it? How can I successfully create the object and access it?

Notes:

I have suspicions that it's some sort of callback behavior that you can't initialize something and access it in the same callback. I'm relatively new and I want to learn thanks.

uj5u.com熱心網友回復：

我們在評論部分談到了兩件事。

您的子字串需要包含冒號才能通過創建質量型別物件的測驗。
未創建 playerMass 的物件。

你在正確的軌道上。

uj5u.com熱心網友回復：

您無法訪問該屬性的原因是“容易”，因為該this.state.state.mass物件是空的。

由于 te 輸出：

...
bundle.min.js:1 check: 3 {}
bundle.min.js:1 Uncaught TypeError: Cannot read properties of undefined (reading 'sprite')

和代碼行：

console.log(`check: 3 ${JSON.stringify(this.state.state.mass)}`);

所以，如果this.state.state.mass是空的object/ {}，所以沒有propteryuniverse.sys.mass[i].id在object。

所以this.state.state.mass[universe.sys.mass[i].id]是undefined和undefined沒有財產sprite，這是錯誤訊息。

為什么如果沒有更多代碼undefined就很難說清楚，但是對于當前的共享代碼，我不得不猜測：在您正在使用的套接字函式和您正在使用this.state.state.mass的genMass函式中this.scene.state.state.mass，這可能是原因，因為這可能是不同的物件。

更新：
重新閱讀代碼后，您應該檢查substring與與比較的代碼部分'mass:'，因為這里只會執行if/else塊的第二部分，因為id.substring(0,4)字串長度為 4 并且'mass:'字串長度5 所以這些永遠不會匹配。

順便說一句：使用ternary operator ?:而不是if/else不是最好的選擇，并且會使代碼的可讀性降低。

    id.substring(0,4)=='mass:'?
        this.scene.state.state.mass[id] = {id:id,sprite:sprite,x:x,y:y}:
        this.scene.state.state.playerMass[id] = {id:id,sprite:sprite,x:x,y:y}; //generate an extra parameter argument for quantified mass
    console.log('check: 0');
    id.substring(0,4)=='mass:'?
        this.scene.physics.world.enable(this.scene.state.state.mass[id].sprite):
        this.scene.physics.world.enable(this.scene.state.state.playerMass[id].sprite); 
    console.log('check: 1');
    id.substring(0,4)=='mass:'?
        this.scene.state.state.mass[id].sprite.body.collideWorldBounds = true:
        this.scene.state.state.playerMass[id].sprite.body.collideWorldBounds = true;
    console.log('check: 2');

這更具可讀性：

    if(id.substring(0,4)=='mass:'){
        this.scene.state.state.mass[id] = {id:id,sprite:sprite,x:x,y:y};
        this.scene.physics.world.enable(this.scene.state.state.mass[id].sprite);
        this.scene.state.state.mass[id].sprite.body.collideWorldBounds = true;
    } else {
        this.scene.state.state.playerMass[id] = {id:id,sprite:sprite,x:x,y:y};
        this.scene.physics.world.enable(this.scene.state.state.playerMass[id].sprite);
        this.scene.state.state.playerMass[id].sprite.body.collideWorldBounds = true;
    }

這可能更清楚：

    let mass = {id:id,sprite:sprite,x:x,y:y};
    this.scene.physics.world.enable(sprite);
    sprite.body.collideWorldBounds = true;

    if(id.substring(0,4)=='mass:'){
        this.scene.state.state.mass[id] = mass;
    } else {
        this.scene.state.state.playerMass[id] = mass;
    }

轉載請註明出處，本文鏈接：https://www.uj5u.com/net/409888.html

標籤：

上一篇：你真的需要安全的隨機UUID嗎？

下一篇：為什么我的非阻塞原始套接字程式運行如此緩慢？