如何使用javscript从JSON字符串获取特定值

Question

我正在使用JavaScript从API提取数据，所获得的结构如下所示：

[{
    "word":"gentleman",
    "score":42722,
    "tags":["syn","n"]
},
{
    "word":"serviceman",
    "score":38277,
    "tags":["syn","n"]
},
{
    "word":"human being",
    "score":34153,
    "tags":["syn","n"]
},
{
    "word":"valet",
    "score":31892,
    "tags":["syn","n"]
}
// etc...
]

我只想获取与键word关联的值，以便输出为：

绅士军人等...

请帮助我循环这些数据，以便仅获得所需的输出。

index.html：

<form id="initial-word-form">
    <input style="float: left;" type="text" name="test" id="synonyms" required>
</form>
<a href="#" id="related-word"></a>
<button id="myBtn" onclick="relatedWordClick()">Find Synonyms</button>
<p id="history"></p>

main.js：

function relatedWordClick (){
    event.preventDefault();
    const x = document.getElementById("synonyms").value;
    document.getElementById("history").innerHTML = x;
    fetch("https://api.datamuse.com/words?ml=" + x)
        .then((resp) => resp.json())
        .then (data =>
            {
                const obj = JSON.stringify(data);   
                document.getElementById("history").innerHTML = obj;
            })
        .catch(err => console.log(err));
    }

Answer 1

遍历每个数据对象，并将其word属性映射到另一个wordArr。

const wordArr = data.map(obj => obj.word)

wordArr如下所示：["gentleman", "human", "etc"]

Answer 2

这样做：

var data = [{"word":"gentleman","score":42722,"tags":["syn","n"]},{"word":"serviceman","score":38277,"tags":["syn","n"]},{"word":"human being","score":34153,"tags":["syn","n"]},{"word":"valet","score":31892,"tags":["syn","n"]}]
string = "";
data.forEach(function(d){
    string += d.word + " ";
});
string.trim();

Answer 3

解析json并获取word。

var data = JSON.parse($('span').text());
var sentence = '';
data.forEach(function(e) {
  sentence += e.word + ' ';
});
console.log(sentence);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span style="display:none;">[{"word":"gentleman","score":42722,"tags":["syn","n"]},{"word":"serviceman","score":38277,"tags":["syn","n"]},{"word":"human being","score":34153,"tags":["syn","n"]},{"word":"valet","score":31892,"tags":["syn","n"]},{"word":"human beings","score":31670,"tags":["syn","n"]},{"word":"mankind","score":31593,"tags":["syn","n"]},{"word":"humankind","score":31448,"tags":["syn","n"]},{"word":"piece","score":30848,"tags":["syn","n"]},{"word":"homo","score":30377,"tags":["syn","n"]},{"word":"human","score":30085,"tags":["syn","n"]},{"word":"military personnel","score":30014,"tags":["syn","n"]},{"word":"humanity","score":29957,"tags":["syn","n"]},{"word":"adult male","score":29404,"tags":["syn","n"]},{"word":"humans","score":29168,"tags":["syn","n"]},{"word":"isle of man","score":28451,"tags":["syn","n"]},{"word":"world","score":28083,"tags":["syn","n"]},{"word":"human race","score":27900,"tags":["syn","n"]},{"word":"military man","score":25225,"tags":["syn","n"]},{"word":"valet de chambre","score":25225,"tags":["syn","n","prop"]},{"word":"woman","score":25224,"tags":["n"]},{"word":"boy","score":21902,"tags":["n"]},{"word":"teenager","score":21552,"tags":["n"]},{"word":"guy","score":17920,"tags":["n"]},{"word":"person","score":17536,"tags":["n"]},{"word":"suspect","score":17199,"tags":["n"]},{"word":"victim","score":16764,"tags":["n"]},{"word":"thief","score":16719,"tags":["n"]},{"word":"someone","score":16322,"tags":["n"]},{"word":"fella","score":16219,"tags":["n"]},{"word":"lad","score":15642,"tags":["n"]},{"word":"dude","score":15559,"tags":["n"]},{"word":"soldier","score":15271,"tags":["n"]},{"word":"bloke","score":14957,"tags":["n"]},{"word":"businessman","score":14901,"tags":["n"]},{"word":"him","score":14814,"tags":["n"]},{"word":"feller","score":14748,"tags":["n"]},{"word":"gent","score":14425,"tags":["n"]},{"word":"boyfriend","score":14150,"tags":["n"]},{"word":"son","score":14071,"tags":["n"]},{"word":"kid","score":14020,"tags":["n"]},{"word":"old","score":13992,"tags":["adj"]},{"word":"father","score":13947,"tags":["n"]},{"word":"uncle","score":13924,"tags":["n"]},{"word":"intruder","score":13291,"tags":["n"]},{"word":"servant","score":13265,"tags":["n"]},{"word":"friend","score":13177,"tags":["n"]},{"word":"somebody","score":13172,"tags":["n"]},{"word":"murderer","score":13156,"tags":["n"]},{"word":"airman","score":12830,"tags":["n"]},{"word":"cousin","score":12657,"tags":["n"]},{"word":"monk","score":12625,"tags":["n"]},{"word":"driver","score":12501,"tags":["n"]},{"word":"madman","score":12431,"tags":["n"]},{"word":"lover","score":12422,"tags":["n"]},{"word":"perp","score":12310,"tags":["n"]},{"word":"brother","score":12249,"tags":["n"]},{"word":"cyclist","score":12215,"tags":["n"]},{"word":"dad","score":11996,"tags":["n"]},{"word":"male","score":11894,"tags":["n"]},{"word":"statesman","score":11871,"tags":["n"]},{"word":"males","score":11582,"tags":["n"]},{"word":"geezer","score":11516,"tags":["n"]},{"word":"husband","score":11391,"tags":["n"]},{"word":"hero","score":11309,"tags":["n"]},{"word":"player","score":11227,"tags":["n"]},{"word":"people","score":11213,"tags":["n"]},{"word":"bomber","score":11169,"tags":["n"]},{"word":"hombre","score":11127,"tags":["n"]},{"word":"wife","score":10980,"tags":["n"]},{"word":"anyone","score":10911,"tags":["n"]},{"word":"defendant","score":10733,"tags":["n"]},{"word":"homeboy","score":10710,"tags":["n"]},{"word":"assassin","score":10658,"tags":["n"]},{"word":"hunk","score":10571,"tags":["n"]},{"word":"waiter","score":10524,"tags":["n"]},{"word":"pal","score":10511,"tags":["n"]},{"word":"fellas","score":10497,"tags":["n"]},{"word":"buddy","score":10418,"tags":["n"]},{"word":"killer","score":10333,"tags":["n"]},{"word":"dead","score":10298,"tags":["adj"]},{"word":"anybody","score":10223,"tags":["n"]},{"word":"dog","score":10135,"tags":["n"]},{"word":"who","score":9954,"tags":["n"]},{"word":"gambler","score":9935,"tags":["n"]},{"word":"god","score":9904,"tags":["n","prop"]},{"word":"citizen","score":9892,"tags":["n"]},{"word":"cat","score":9831,"tags":["n"]},{"word":"dudes","score":9691,"tags":["n"]},{"word":"persons","score":9606,"tags":["n"]},{"word":"kidder","score":9582,"tags":["n","prop"]},{"word":"kingpin","score":9517,"tags":["n"]},{"word":"laddie","score":9420,"tags":["n"]},{"word":"kinsman","score":9121,"tags":["n"]},{"word":"lying","score":9032,"tags":["n"]},{"word":"baby","score":8935,"tags":["n"]},{"word":"bro","score":8896,"tags":["n"]},{"word":"cow","score":8848,"tags":["n"]},{"word":"mensch","score":8841,"tags":["n"]},{"word":"guys","score":8788,"tags":["n"]},{"word":"pup","score":8598,"tags":["n"]}]
</span>

Answer 4

如果您正在使用lodash之类的库，则可以使用_.map(yourData, "word"，否则可以遍历yourData并将所有单词附加到数组中。

对于普通的javascript，您可以使用yourData.map((item)=>item.word)两者都用小提琴编写，以供您在https://jsfiddle.net/mohithg/f2pcmdbj/2/上参考。