Случайные запятые появляются в массиве ReactJS - PullRequest
Новая
       16

Случайные запятые появляются в массиве ReactJS

0 голосов
/ 04 июня 2019

Я пытаюсь создать эту игру памяти в ReactJS, и я создал массив, в который я добавляю 4 случайных числа.Теперь каждый раз, когда я нажимаю на игру, мне нужно заполнить массив 4 случайными числами от 0 до 3, но я продолжаю получать случайные запятые, которые появляются из ниоткуда в массиве.Я новичок в React, поэтому любая помощь приветствуется.

Я пробовал разные способы заполнения массива, но запятые все равно появляются.Ps.keepArray был инициализирован непосредственно перед циклом for. 

for (let i = 0; i < 4; i++) {
      let rand = Math.floor(Math.random() * 4)
      keepArray = [...keepArray + rand]
      console.log(keepArray)
    }

Снимок экрана выполнения: http://prntscr.com/nx9sqg

Ответы [ 2 ]

3 голосов
/ 04 июня 2019

Решение:

Заменить:

keepArray = [...keepArray + rand]

с:

keepArray = [...keepArray, rand]

Пояснение:

Оператор распространения (...) буквально «расширяет» ваш массив, поэтому вам нужны запятые. Пример ниже может помочь визуализировать это: 

// Let's start with a simple array:
var myArray = [1, 2, 3];

// Now, we add another element to it using spread:
var updatedArray = [...myArray, 4];

// Here, ...myArray is translated to [1, 2, 3]
// That means that the above could be read as:
var updatedArray = [1, 2, 3, 4];

Ссылка: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax

Дополнительное объяснение поведения "+" см. В ответе Павана Бахугуни.

2 голосов
/ 04 июня 2019

Приведенный выше ответ действительно решает проблему, но настоящая причина такого поведения заключается в следующем:

Оператор + перегружен, чтобы служить как для сложения чисел, так и для объединения строк.Когда + получает объект (включая массив в вашем случае) для любого из операндов, он сначала вызывает абстрактную операцию ToPrimitive для значения, которая затем вызывает алгоритм [[DefaultValue]] с контекстной подсказкой числа.Какой стажер вызывает метод toString в массиве. 

var val = [1,2,3] + 1;
console.log(val); // "1,2,31"

И затем вы пытаетесь распространить эту строку в массиве следующим образом: 

var arr = [...val];
console.log(arr); // ["1", ",", "2", ",", "3", "1"]

Это реальная причина, почему вывидя эти запятые.

...