"Приложение с историями", вопрос с масивами?

Question

[SaberChazer]

Здравствуйте, вот сразу ссылка.
А вот теперь подскажите пожалуйста как в этом случае правильно можно было бы использовать js массивы (ну как по мне кажется что тут нужны именно массивы, так как писать в ручную (блоки с СМС) это очень долго и запутанно)

Comments

[Stalker_RED]

А какая цель у этого всего?
Зачем массивы? Что вообще должно происходить?

[SaberChazer]

Stalker_RED, сделать что-то чисто тех. похожее на "Взахлёб" (приложение есть такое)

[SaberChazer]

Stalker_RED, при каждом нажатии на кнопку (Enter) должно отображаться сообщения

[SaberChazer]

SaberChazer, типо
Hey, I'm Mickey, what's your name?
* нажал на Enter *
- hi, I'm Nelly
* нажал на Enter *
beautiful name, how old are you?
* нажал на Enter *
- 20
и так далее...........

[Stalker_RED]

SaberChazer, слушайте нажатия на enter, выводите следующее сообщение.

[SaberChazer]

Stalker_RED, ну так мне нужно это автоматизировать, так как там будет диалог идти в 30 смс. Написать то в ручную можно, но, а зачем если это можно решить другим способом

Answer 1

[Анатолий Куликов]

Ну так все правильно думаешь. Варианты можно всякие придумать, например такой: нужно два массива, один со строками (или лучше даже с объектами, там можно будет для каждого сообщения много инфы тащить, типа имя отправителя, текст, аватарку и т.д.), а второй - пустой.

Далее сделать рекурсивную функцию, которая перекладывает первый элемент первого массива во второй, пока там что-то есть.

По красоте можно ещё задержку не константную сделать, а в зависимости от длины сообщения (узнать эмпирическим методом можно или прогуглить среднюю скорость натыкивания текста), но не меньше, чем x (чтобы короткие не устроили фейерверк).

Answer 2

[Stalker_RED]

document.addEventListener('keydown', function(evt) { // слушаем нажатия кнопок
  if (evt.code === 'Enter')
    showNextMsg();
});

const msg = function* () {
	yield* [ // генерируем сообщения
    { name: 'Вася', txt: 'Привет!' },
    { name: 'Петя', txt: 'И тебе привет!' },
    { name: 'Вася', txt: 'Как дела?' },
    { name: 'Петя', txt: 'Хреново, мой хомяк заболел' },
    { name: 'Вася', txt: 'Аха-ха-ха' },
    { name: 'Петя', txt: 'Василий, вы - бесчувственная скотина!' },
  ];
}();

function showNextMsg() {
  let m = msg.next(); // получаем следующее сообщение
  if (!m.done) { // выводим его
    userName.textContent = m.value.name;
    userMessage.textContent = m.value.txt;
  }
}

https://jsfiddle.net/Stalk/8gm3y9w7/