javascript 在调用函数之前分配变量
javascript assigning variables prior to function being called
编辑添加：***********
@melomene 不喜欢我调用的 roll 和 rollP 数组。但是，它们被声明为数组。我在下面添加了完整的 javascript 文件。
我有 2 个小数组：roll[] 和 rollP[]。他们每个只有 2 个项目。当函数'checkDouble6()'为运行时，roll的内容保存到rollP中，像这样
rollP = roll;
这是代码中唯一将 roll 的值分配给 rollP 的地方。
不知何故，这有时会在调用 checkDouble6() 函数之前发生，即使此语句在 checkDouble6() 函数中也是如此。
console.logs 试图解决这个问题让我发疯了。呵呵..
以下是玩家点击（导致虚拟骰子滚动）时发生的事情的代码块，checkDouble6() 函数，以及 'holding.' 持有的函数，当玩家决定保留时当前得分并允许下一位玩家轮到他们。
由于某些原因，当玩家第一次切换时，抢占式变量赋值不会发生。我认为这是因为 switchPlayer() 函数将 rollP 重新分配给 [0,0]。但在那之后，每次玩家掷骰子时，变量数组 rollP 在调用 checkDouble6() 函数之前获取 roll 的值。
document.querySelector('.btn-roll').addEventListener('click', function(){
if (isGamePlaying){
//1.Random number is generated
roll[0] = Math.floor(Math.random()*6) + 1;
roll[1] = Math.floor(Math.random()*6) + 1;
//2.Display the result
document.querySelectorAll('.dice').forEach(diceClass=>diceClass.style.display = 'block');
document.getElementById('dice1').src = 'dice-'+roll[0]+'.png';
document.getElementById('dice2').src = 'dice-'+roll[1]+'.png';
console.log('roll before checkDouble6: '+roll);
console.log('rollP before checkDouble6: '+rollP);
checkDouble6();
console.log('roll after checkDouble6: '+roll);
console.log('rollP after checkDouble6: '+rollP);
//3.Update the round score IF the rolled number is not a 1
if( roll[0]!== 1 && roll[1]!==1){
//Add score
roundScore += roll[0]+roll[1];
document.getElementById('current-'+activePlayer).textContent = roundScore;
}else{
//Next player's turn.
roundScore = 0;
switchPlayer();
}
}
});
function checkDouble6(){
if (roll[0]===6 &&(roll[1]===6 || rollP[0]===6 || rollP[1]===6)){
//lose whole global score. Next player's turn.
scores[activePlayer]=0;
console.log('roll during checkDouble6: '+roll);
console.log('roll during checkDouble6: '+rollP);
switchPlayer();
} else if (roll[1]===6 &&(rollP[0]===6 || rollP[1]===6)){
//lose whole global score. Next player's turn.
scores[activePlayer]=0;
console.log('roll: '+roll);
console.log('rollP: '+rollP);
switchPlayer();
} else{
//everything is fine
}
rollP = roll;
console.log('roll at end of checkDouble6 function: '+roll);
console.log('rollP at end of checkDouble6 function: '+rollP);
};
有这么多 console.logs 因为我想弄清楚这是怎么回事。下面是 'hold' 函数。同样，这不会在玩家回合切换后立即发生，可能是因为将 rollp 设置为 [0,0]。
document.querySelector('.btn-hold').addEventListener('click', function(){
if (isGamePlaying){
//Add current score to global score
scores[activePlayer] += roundScore;
//Update UI
document.getElementById('score-'+activePlayer).textContent = scores[activePlayer];
//Check if player won the game
if (scores[activePlayer]>=100){
//they won
document.getElementById('name-'+activePlayer).textContent = 'WINNER!';
document.querySelector('.dice').style.display = 'none';
document.querySelector('.player-'+activePlayer+'-panel').classList.remove('active');
document.querySelector('.player-'+activePlayer+'-panel').classList.add('winner');
isGamePlaying = false;
}else{
//they didn't win. Next player's turn.
switchPlayer();
}
}
});
这是全部内容：
var scores, roundScore, activePlayer, isGamePlaying;
var roll = new Array(2);
var rollP = new Array(2);
initializeGame();
//document.querySelector('#current-0').textContent = dice;
//document.querySelector('#current-'+activePlayer).innerHTML = '<em>'+dice+'</em>';
document.querySelector('.btn-roll').addEventListener('click', function(){
// This would be an anonymous function
if (isGamePlaying){
//1.Random number is generated
roll[0] = Math.floor(Math.random()*6) + 1;
roll[1] = Math.floor(Math.random()*6) + 1;
//2.Display the result
document.querySelectorAll('.dice').forEach(diceClass=>diceClass.style.display = 'block');
document.getElementById('dice1').src = 'dice-'+roll[0]+'.png';
document.getElementById('dice2').src = 'dice-'+roll[1]+'.png';
console.log('roll before checkDouble6: '+roll);
console.log('rollP before checkDouble6: '+rollP);
checkDouble6();
console.log('roll after checkDouble6: '+roll);
console.log('rollP after checkDouble6: '+rollP);
//3.Update the round score IF the rolled number is not a 1
if( roll[0]!== 1 && roll[1]!==1){
//Add score
roundScore += roll[0]+roll[1];
document.getElementById('current-'+activePlayer).textContent = roundScore;
}else{
//Next player's turn.
roundScore = 0;
switchPlayer();
}
}
});
document.querySelector('.btn-hold').addEventListener('click', function(){
if (isGamePlaying){
//Add current score to global score
scores[activePlayer] += roundScore;
//Update UI
document.getElementById('score-'+activePlayer).textContent = scores[activePlayer];
//Check if player won the game
if (scores[activePlayer]>=100){
//they won
document.getElementById('name-'+activePlayer).textContent = 'WINNER!';
document.querySelector('.dice').style.display = 'none';
document.querySelector('.player-'+activePlayer+'-panel').classList.remove('active');
document.querySelector('.player-'+activePlayer+'-panel').classList.add('winner');
isGamePlaying = false;
}else{
//they didn't win. Next player's turn.
switchPlayer();
}
}
});
function switchPlayer(){
// Set round scores to 0
roundScore = 0;
roll = [0,0];
rollP = [0,0];
document.getElementById('current-0').textContent = 0;
document.getElementById('current-1').textContent = 0;
// Toggle the visuals
document.querySelector('.player-0-panel').classList.toggle('active');
document.querySelector('.player-1-panel').classList.toggle('active');
//change active player from one to the other
console.log('Switch from player-'+activePlayer);
activePlayer === 1 ? activePlayer = 0 : activePlayer = 1;
console.log('to player-'+activePlayer);
};
document.querySelector('.btn-new').addEventListener('click', initializeGame);
function initializeGame(){
roll = [0,0];
rollP = [0,0];
roundScore = 0;
scores = [0,0];
activePlayer = 0;
document.querySelectorAll('.dice').forEach(diceClass => diceClass.style.display = 'none');
document.getElementById('score-0').textContent = '0';
document.getElementById('score-1').textContent = '0';
document.getElementById('current-0').textContent = '0';
document.getElementById('current-1').textContent = '0';
document.getElementById('name-0').textContent = 'Player 1';
document.getElementById('name-1').textContent = 'Player 2';
document.querySelector('.player-0-panel').classList.remove('winner');
document.querySelector('.player-1-panel').classList.remove('winner');
document.querySelector('.player-0-panel').classList.remove('active');
document.querySelector('.player-1-panel').classList.remove('active');
document.querySelector('.player-0-panel').classList.add('active');
isGamePlaying = true;
};
function checkDouble6(){
if (roll[0]===6 &&(roll[1]===6 || rollP[0]===6 || rollP[1]===6)){
//lose whole global score. Next player's turn.
scores[activePlayer]=0;
console.log('roll during checkDouble6: '+roll);
console.log('roll during checkDouble6: '+rollP);
switchPlayer();
} else if (roll[1]===6 &&(rollP[0]===6 || rollP[1]===6)){
//lose whole global score. Next player's turn.
scores[activePlayer]=0;
console.log('roll: '+roll);
console.log('rollP: '+rollP);
switchPlayer();
} else{
//everything is fine
}
rollP = roll;
console.log('roll at end of checkDouble6 function: '+roll);
console.log('rollP at end of checkDouble6 function: '+rollP);
};
当您执行 roll = rollP 时，您正在将引用从 rollP 复制到 roll，这意味着 roll 和 rollP 将指向相同的内存位置。
例如如果你在 roll 中推送一些东西，它在 rollP 中将完全相同，反之亦然。
如果我没看错，你只需要roll[0] = rollP[0]; roll[1] = rollP[1];
编辑添加：*********** @melomene 不喜欢我调用的 roll 和 rollP 数组。但是，它们被声明为数组。我在下面添加了完整的 javascript 文件。
我有 2 个小数组：roll[] 和 rollP[]。他们每个只有 2 个项目。当函数'checkDouble6()'为运行时，roll的内容保存到rollP中，像这样
rollP = roll;
这是代码中唯一将 roll 的值分配给 rollP 的地方。
不知何故，这有时会在调用 checkDouble6() 函数之前发生，即使此语句在 checkDouble6() 函数中也是如此。
console.logs 试图解决这个问题让我发疯了。呵呵..
以下是玩家点击（导致虚拟骰子滚动）时发生的事情的代码块，checkDouble6() 函数，以及 'holding.' 持有的函数，当玩家决定保留时当前得分并允许下一位玩家轮到他们。
由于某些原因，当玩家第一次切换时，抢占式变量赋值不会发生。我认为这是因为 switchPlayer() 函数将 rollP 重新分配给 [0,0]。但在那之后，每次玩家掷骰子时，变量数组 rollP 在调用 checkDouble6() 函数之前获取 roll 的值。
document.querySelector('.btn-roll').addEventListener('click', function(){
if (isGamePlaying){
//1.Random number is generated
roll[0] = Math.floor(Math.random()*6) + 1;
roll[1] = Math.floor(Math.random()*6) + 1;
//2.Display the result
document.querySelectorAll('.dice').forEach(diceClass=>diceClass.style.display = 'block');
document.getElementById('dice1').src = 'dice-'+roll[0]+'.png';
document.getElementById('dice2').src = 'dice-'+roll[1]+'.png';
console.log('roll before checkDouble6: '+roll);
console.log('rollP before checkDouble6: '+rollP);
checkDouble6();
console.log('roll after checkDouble6: '+roll);
console.log('rollP after checkDouble6: '+rollP);
//3.Update the round score IF the rolled number is not a 1
if( roll[0]!== 1 && roll[1]!==1){
//Add score
roundScore += roll[0]+roll[1];
document.getElementById('current-'+activePlayer).textContent = roundScore;
}else{
//Next player's turn.
roundScore = 0;
switchPlayer();
}
}
});
function checkDouble6(){
if (roll[0]===6 &&(roll[1]===6 || rollP[0]===6 || rollP[1]===6)){
//lose whole global score. Next player's turn.
scores[activePlayer]=0;
console.log('roll during checkDouble6: '+roll);
console.log('roll during checkDouble6: '+rollP);
switchPlayer();
} else if (roll[1]===6 &&(rollP[0]===6 || rollP[1]===6)){
//lose whole global score. Next player's turn.
scores[activePlayer]=0;
console.log('roll: '+roll);
console.log('rollP: '+rollP);
switchPlayer();
} else{
//everything is fine
}
rollP = roll;
console.log('roll at end of checkDouble6 function: '+roll);
console.log('rollP at end of checkDouble6 function: '+rollP);
};
有这么多 console.logs 因为我想弄清楚这是怎么回事。下面是 'hold' 函数。同样，这不会在玩家回合切换后立即发生，可能是因为将 rollp 设置为 [0,0]。
document.querySelector('.btn-hold').addEventListener('click', function(){
if (isGamePlaying){
//Add current score to global score
scores[activePlayer] += roundScore;
//Update UI
document.getElementById('score-'+activePlayer).textContent = scores[activePlayer];
//Check if player won the game
if (scores[activePlayer]>=100){
//they won
document.getElementById('name-'+activePlayer).textContent = 'WINNER!';
document.querySelector('.dice').style.display = 'none';
document.querySelector('.player-'+activePlayer+'-panel').classList.remove('active');
document.querySelector('.player-'+activePlayer+'-panel').classList.add('winner');
isGamePlaying = false;
}else{
//they didn't win. Next player's turn.
switchPlayer();
}
}
});
这是全部内容：
var scores, roundScore, activePlayer, isGamePlaying;
var roll = new Array(2);
var rollP = new Array(2);
initializeGame();
//document.querySelector('#current-0').textContent = dice;
//document.querySelector('#current-'+activePlayer).innerHTML = '<em>'+dice+'</em>';
document.querySelector('.btn-roll').addEventListener('click', function(){
// This would be an anonymous function
if (isGamePlaying){
//1.Random number is generated
roll[0] = Math.floor(Math.random()*6) + 1;
roll[1] = Math.floor(Math.random()*6) + 1;
//2.Display the result
document.querySelectorAll('.dice').forEach(diceClass=>diceClass.style.display = 'block');
document.getElementById('dice1').src = 'dice-'+roll[0]+'.png';
document.getElementById('dice2').src = 'dice-'+roll[1]+'.png';
console.log('roll before checkDouble6: '+roll);
console.log('rollP before checkDouble6: '+rollP);
checkDouble6();
console.log('roll after checkDouble6: '+roll);
console.log('rollP after checkDouble6: '+rollP);
//3.Update the round score IF the rolled number is not a 1
if( roll[0]!== 1 && roll[1]!==1){
//Add score
roundScore += roll[0]+roll[1];
document.getElementById('current-'+activePlayer).textContent = roundScore;
}else{
//Next player's turn.
roundScore = 0;
switchPlayer();
}
}
});
document.querySelector('.btn-hold').addEventListener('click', function(){
if (isGamePlaying){
//Add current score to global score
scores[activePlayer] += roundScore;
//Update UI
document.getElementById('score-'+activePlayer).textContent = scores[activePlayer];
//Check if player won the game
if (scores[activePlayer]>=100){
//they won
document.getElementById('name-'+activePlayer).textContent = 'WINNER!';
document.querySelector('.dice').style.display = 'none';
document.querySelector('.player-'+activePlayer+'-panel').classList.remove('active');
document.querySelector('.player-'+activePlayer+'-panel').classList.add('winner');
isGamePlaying = false;
}else{
//they didn't win. Next player's turn.
switchPlayer();
}
}
});
function switchPlayer(){
// Set round scores to 0
roundScore = 0;
roll = [0,0];
rollP = [0,0];
document.getElementById('current-0').textContent = 0;
document.getElementById('current-1').textContent = 0;
// Toggle the visuals
document.querySelector('.player-0-panel').classList.toggle('active');
document.querySelector('.player-1-panel').classList.toggle('active');
//change active player from one to the other
console.log('Switch from player-'+activePlayer);
activePlayer === 1 ? activePlayer = 0 : activePlayer = 1;
console.log('to player-'+activePlayer);
};
document.querySelector('.btn-new').addEventListener('click', initializeGame);
function initializeGame(){
roll = [0,0];
rollP = [0,0];
roundScore = 0;
scores = [0,0];
activePlayer = 0;
document.querySelectorAll('.dice').forEach(diceClass => diceClass.style.display = 'none');
document.getElementById('score-0').textContent = '0';
document.getElementById('score-1').textContent = '0';
document.getElementById('current-0').textContent = '0';
document.getElementById('current-1').textContent = '0';
document.getElementById('name-0').textContent = 'Player 1';
document.getElementById('name-1').textContent = 'Player 2';
document.querySelector('.player-0-panel').classList.remove('winner');
document.querySelector('.player-1-panel').classList.remove('winner');
document.querySelector('.player-0-panel').classList.remove('active');
document.querySelector('.player-1-panel').classList.remove('active');
document.querySelector('.player-0-panel').classList.add('active');
isGamePlaying = true;
};
function checkDouble6(){
if (roll[0]===6 &&(roll[1]===6 || rollP[0]===6 || rollP[1]===6)){
//lose whole global score. Next player's turn.
scores[activePlayer]=0;
console.log('roll during checkDouble6: '+roll);
console.log('roll during checkDouble6: '+rollP);
switchPlayer();
} else if (roll[1]===6 &&(rollP[0]===6 || rollP[1]===6)){
//lose whole global score. Next player's turn.
scores[activePlayer]=0;
console.log('roll: '+roll);
console.log('rollP: '+rollP);
switchPlayer();
} else{
//everything is fine
}
rollP = roll;
console.log('roll at end of checkDouble6 function: '+roll);
console.log('rollP at end of checkDouble6 function: '+rollP);
};
当您执行 roll = rollP 时，您正在将引用从 rollP 复制到 roll，这意味着 roll 和 rollP 将指向相同的内存位置。
例如如果你在 roll 中推送一些东西，它在 rollP 中将完全相同，反之亦然。
如果我没看错，你只需要roll[0] = rollP[0]; roll[1] = rollP[1];