时间戳

首页 > 解决方案 > 映射用户数据数组

javascript - 映射用户数据数组

问题描述

我对 JS 很陌生，并且在一个问题上停留了一段时间。我的项目是一个卡片生成器，它允许用户进入一个“困境”，随机抽取一张“策略”卡片，然后保存配对。我很难正确显示配对。

let dataStore = []

let dilemma = "";
    strategy = "";

function saveData() {
    newPair = {dilemma: userText.value, strategy: cardText.innerText};
    dataStore.push( newPair )
    displayData();
}

function doSmtElse( element ) {
 
    console.log( "element is here : " , element , element.dilemma , element.strategy)
 

    for (let index = 0; index < dataStore.length; index++) {
        const element = dataStore[index];
        doSmtElse(element )
    }
}

function displayData() {
 
    console.log( "dataStore is here : " , dataStore)
 

    for (let index = 0; index < dataStore.length; index++) {
        const element = dataStore[index];
        doSmtElse(element )
    }
}

对于该displayData函数，我认为我应该使用 map 方法来迭代数组，但到目前为止还没有成功。有小费吗？

发电机的图片。我已经通过控制台登录dataStore了该saveData功能，它显示了正确的信息，但我无法让它显示在“保存的信息”框中。这就是我希望该displayData功能完成的。让我知道我应该提供哪些其他信息，我对这个过程很陌生。

当用户单击“保存策略”时，我在 HTML 中添加了一个 onclick，它应该保存困境/策略配对并将其显示在下面的框中。如果您需要我的所有代码，请告诉我。

标签： javascriptarrays

解决方案

 

 
 
/* these lines are just for test purposes  */ 
var userText =  { value : "test" }
var cardText = { innerText : "test123"}
/* test end ... */ 


let dataStore = []
let dilemma = ""  //new Array();
    strategy = "" // new Array();

/*
* @param   
* @returns  
*/
function saveData() {
    newPair = {dilemma: userText.value, strategy: cardText.innerText};
   
    dataStore.push( newPair )
 //   dataStore = [...dataStore, newPair];
    displayData();
}
 
/*
* @param {element} obj1  
* @returns  
*/
function doSmtElse( element ) {
 
    console.log( "element is here : " , element , element.dilemma , element.strategy)
 
    return  '<p>' + element.dilemma  +  ":" +   element.strategy + '</p>'

 
}
/*
* @param   
* @returns  
*/
function displayData() {
 
    console.log( "dataStore is here : " , dataStore)
 
    content = "" 

    for (let index = 0; index < dataStore.length; index++) {
        const element = dataStore[index];
       content =  content + doSmtElse(element )
    }

    document.getElementById("body").innerHTML = content  
 
}


 
/* these lines are just for test purposes  */ 
test =  [  1,2,3  ]
for (let index = 0; index < test.length; index++) {
    const element = test[index];
    saveData()
}
 
/* ... */ 
 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
 

</head>
<body id="body">
    

 

</body>
</html>

推荐阅读