Это снова я с той же карточной игрой, что и мой последний вопрос. Я добился некоторого прогресса, но на этот раз я хочу исправить код, чтобы одна карта в рандомизированной «руке» переключалась на другую случайную карту, которая не должна быть уже использованной картой. Это делается нажатием второй кнопки под кнопкой рандомайзера. В коде, который я сделал, кнопка изменения делает то же самое, что и кнопка рандомизации, но я намерен изменить ее.
function replace() {
var res = str.replace(this.state.cards, this.state.replacecards);
}
// what i intend to be the function that is used to replace the item
class App extends React.Component {
constructor(props) {
super(props);
this.state = {
cards: ["A♥", "A♠", "A♦", "A♣", "2♣", "3♣", "4♣", "5♣", "6♣", "7♣", "8♣", "9♣", "10♣", "K♣", "Q♣", "J♣", "2♦", "3♦", "4♦", "5♦", "6♦", "7♦", "8♦", "9♦", "10♦", "K♦", "Q♦", "J♦", "2♥", "3♥", "4♥", "5♥", "6♥", "7♥", "8♥", "9♥", "10♥", "K♥", "Q♥", "J♥", "2♠", "3♠", "4♠", "5♠", "6♠", "7♠", "8♠", "9♠", "10♠", "K♠", "Q♠", "J♠"],
hand: []
};
this.handleClick = this.handleClick.bind(this);
}
handleClick() {
const cards = this.state.cards;
const newHand = [];
function in_array(array, el) {
for (var i = 0; i < array.length; i++) if (array[i] == el) return true;
return false;
}
function get_rand(array) {
var rand = array[Math.floor(Math.random() * array.length)];
if (!in_array(newHand, rand)) {
newHand.push(rand);
return rand;
}
}
function sortcards(a, b) {
return a > b ? 1 : b > a ? -1 : 0;
}
for (var i = 0; i < 5; i++) {
get_rand(cards);
}
this.setState({
hand: newHand
});
newHand.sort(sortcards);
}
render() {
const { hand } = this.state;
return (
<div>
{hand
? hand.map(card => {
return <p>{card}</p>;
})
: null}
<button onClick = {this.handleClick}>Randomize</button>
<br />
<button onClick = {this.handleClick}>Change the first card</button>
</div>
);
}
}



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Вот что вам нужно bigboyopiro. Вполне уместно, что я также могу ответить на ваш второй вопрос :).
Вот песочница для справки: https://codesandbox.io/s/yv93w19pkz
swapOneCard = () => {
const currentHand = this.state.hand
//get random card to remove from current hand
const cardToRemove = currentHand[Math.floor(Math.random() * currentHand.length)];
//all cards
const allCards = this.state.cards
//unchoosen cards to choose from
const unchoosenCards = allCards.filter((card) => {
return !currentHand.includes(card)
})
//get random card from unchoosen cards
var cardToAdd = unchoosenCards[Math.floor(Math.random() * unchoosenCards.length)];
const newHand = currentHand.map((card) => {
if (card == cardToRemove){
return cardToAdd
} else {
return card
}
})
this.setState({
hand: newHand
})
}
Еще раз спасибо, хотя кажется, что это заменяет случайную карту, а не только первую карту. Я намерен сделать так, чтобы у каждой карты была кнопка, чтобы их можно было поменять местами.
@bigboyopiro о да! Я оставил для вас маленькую заметку об этом в песочнице. Просто установите cardToRemove = currentHand[0], если вы просто хотите поменять местами первую карту :)
Если я правильно понимаю ваш вопрос и ваш код, кнопка, которую вы собираетесь нажать, заменяет первую карту в вашей руке новой картой, которой еще нет в вашей руке. Если это так, вы можете использовать следующее для достижения этой цели:
getNewCard = () => {
let { cards, hand } = this.state;
let newCardIndex = Math.floor(Math.random()*cards.length);
let newCard = cards[newCardIndex];
while (hand.contains(newCard)) {
cards.splice(newCardIndex, 1);
newCardIndex = Math.floor(Math.random()*cards.length);
newCard = cards[newCardIndex];
}
hand[0] = newCard;
this.setState({ hand });
}Важная часть — цикл while. Он будет продолжать получать новую случайную карту в массиве до тех пор, пока случайная карта, которую мы получаем, не окажется в нашей руке. Если случайная карта находится в нашей руке, мы удаляем ее из массива карт. Это делается для того, чтобы мы случайно не получили одну и ту же карту снова.
Я скоро вернусь с твоим ответом, друг. Если вы помните меня из вашего последнего вопроса :)