variable is not getting defined even though the code works somwhere else

Question

I am building a game in three js and trying to make it multiplayer through socket.io so I am loading all of my characters into an array called players on my server side

and then I pass it to each client when they connect like so

socket.on('addPlayer', function(username) {
    players.push(username)
    console.log(username + " joined")
    console.log("online Users " + players)
    socket.broadcast.emit('syncPlayers', players)
    socket.emit('syncPlayers', players)
})

and on my client syncPlayers looks like this

socket.on('syncPlayers', function(players) {
    players.forEach(function(value) {
        if (value == username) {
            console.log("not adding " + value + " thats you ")
            loadPlayerdata(username)
        } else {
            console.log("player Online " + value);
            newplayer = value;
            loadPlayerdata(newplayer)
            addPlayer(newplayer)
        }
    });
})

then it calls this which sends the server data

function loadPlayerdata(playerName) {
    console.log(playerName)
    console.log("phase1")
    socket.emit('loadPlayerdata', playerName)
}

then this is called and it retrieved the player name and the data of the players location this is were my problem lies

socket.on('loadPlayerdata', function(data, username) {
    toMove = threeObjects[username + "Char"]
    if (data == "null" || "") {
        console.log(username + " is new")
    } else {
        console.log(username + " Exists")
        console.log(toMove)
        toMove.position.set(world.spawnPointx, world.spawnPointy, world.spawnPointz)
    }

I keep getting

Uncaught TypeError: Cannot read property 'position' of undefined

even though I can use this

function addPlayer(playerName) {

    var charObjectName = playerName + "Char"
    var threeObject = models.tent1.mesh.clone();
    scene.add(threeObject)



    //threeObject.position.set(world.spawnPointx, world.spawnPointy, world.spawnPointz)
    // set reference
    threeObjects[charObjectName] = threeObject;
}

by the way I have an object

   var threeObjects = {};

can someone please explain why it won't work and how to fix it?

Answer 1

You can read this answer to understand the difference between dot and brackets notation.

You are getting error because, tomove seems to be undefined and dot notation will throw error if any new user joins and if the object is empty.

Check if this helps. This will assign the object key as username and position as an value which will be array like this, {"usernamechar": {"position": [x,y,z]}}

socket.on('loadPlayerdata', function(data, username) {
    if (data == "null" || "") {
        console.log(username + " is new")
    } else {
        console.log(username + " Exists")
        threeObjects[username + "Char"]["position"] = [world.spawnPointx, world.spawnPointy, world.spawnPointz] 
    }
}