Javascript 如何过滤数组，然后使用map方法输出它？
我正在尝试使用： 1..cards**.filter**方法查找cards number===TRUE，2..n然后使用cards**.map**方法到innerHTMLcards.symbol值，不带数字值 最终结果应该是在my index.html文件中显示9个div->Javascript 如何过滤数组，然后使用map方法输出它？,javascript,arrays,dictionary,filter,Javascript,Arrays,Dictionary,Filter,我正在尝试使用： 1..cards**.filter**方法查找cards number===TRUE，2..n然后使用cards**.map**方法到innerHTMLcards.symbol值，不带数字值 最终结果应该是在my index.html文件中显示9个div-> 1 2 3 4 5 6 7 8 9 //HTML <body> <h1>Filter Method</h1> <div class="container
123456789 <body>
<h1>Filter Method</h1>
<div class="container" id="filter-method"></div>
</body>
过滤法
const cards = [
{ symbol: '1', number: true},
{ symbol: '2', number: true},
{ symbol: '3', number: true},
{ symbol: '4', number: true},
{ symbol: '5', number: true},
{ symbol: '6', number: true},
{ symbol: '7', number: true},
{ symbol: '8', number: true},
{ symbol: '9', number: true},
{ symbol: '+', number: false},
{ symbol: '-', number: false},
{ symbol: '*', number: false}
];
const cardsContainer = document.querySelector('#filter-method');
const filteredCards = cards.filter((card) => {
if(card.number === true){
return '<div class="card">' + '<span>' + card.symbol + '<span>' + '</div>';
}
})
cardsContainer.innerHTML = filteredCards.join('\n');
const卡=[
{符号：'1'，编号：true}，
{符号：'2'，编号：true}，
{符号：'3'，编号：true}，
{符号：'4'，编号：true}，
{符号：'5'，编号：true}，
{符号：'6'，编号：true}，
{符号：'7'，编号：true}，
{符号：'8'，编号：true}，
{符号：'9'，编号：true}，
{符号：'+'，编号：false}，
{符号：'-'，编号：false}，
{符号：'*'，编号：false}
];
const cardsContainer=document.querySelector（“#filter method”）；
常量过滤器卡片=卡片。过滤器（（卡片）=>{
如果（card.number==true）{
返回'+''+卡。符号+'+''；
}
})
cardsContainer.innerHTML=filteredCards.join（'\n'）；
过滤器映射将其转换为html。我假设您也想保留
元素
const卡=[
{符号：'1'，编号：true}，
{符号：'2'，编号：true}，
{符号：'3'，编号：true}，
{符号：'4'，编号：true}，
{符号：'5'，编号：true}，
{符号：'6'，编号：true}，
{符号：'7'，编号：true}，
{符号：'8'，编号：true}，
{符号：'9'，编号：true}，
{符号：'+'，编号：false}，
{符号：'-'，编号：false}，
{符号：'*'，编号：false}
];
const cardsContainer=document.querySelector（“#filter method”）；
const filteredCards=cards.filter（card=>card.number）.map（card=>{
返回'+''+卡。符号+'+''；
})
cardsContainer.innerHTML=filteredCards.join（“\n”）
过滤器
应返回true或false以确定是否包含该项，然后可以使用映射
将其转换为html。我假设您也想保留
元素
const卡=[
{符号：'1'，编号：true}，
{符号：'2'，编号：true}，
{符号：'3'，编号：true}，
{符号：'4'，编号：true}，
{符号：'5'，编号：true}，
{符号：'6'，编号：true}，
{符号：'7'，编号：true}，
{符号：'8'，编号：true}，
{符号：'9'，编号：true}，
{符号：'+'，编号：false}，
{符号：'-'，编号：false}，
{符号：'*'，编号：false}
];
const cardsContainer=document.querySelector（“#filter method”）；
const filteredCards=cards.filter（card=>card.number）.map（card=>{
返回'+''+卡。符号+'+''；
})
cardsContainer.innerHTML=filteredCards.join（“\n”）
您可以使用以下工具一次性完成所有工作：
const卡=[
{符号：'1'，编号：true}，
{符号：'2'，编号：true}，
{符号：'3'，编号：true}，
{符号：'4'，编号：true}，
{符号：'5'，编号：true}，
{符号：'6'，编号：true}，
{符号：'7'，编号：true}，
{符号：'8'，编号：true}，
{符号：'9'，编号：true}，
{符号：'+'，编号：false}，
{符号：'-'，编号：false}，
{符号：'*'，编号：false}
];
const cardsContainer=document.querySelector（“#filter method”）；
cardsContainer.innerHTML=cards.reduce（（strHTML，card）=>{
if（card.number）strHTML+=`${card.symbol}`
返回strHTML；
}，“”）
过滤法
您可以使用以下工具一次性完成所有工作：
const卡=[
{符号：'1'，编号：true}，
{符号：'2'，编号：true}，
{符号：'3'，编号：true}，
{符号：'4'，编号：true}，
{符号：'5'，编号：true}，
{符号：'6'，编号：true}，
{符号：'7'，编号：true}，
{符号：'8'，编号：true}，
{符号：'9'，编号：true}，
{符号：'+'，编号：false}，
{符号：'-'，编号：false}，
{符号：'*'，编号：false}
];
const cardsContainer=document.querySelector（“#filter method”）；
cardsContainer.innerHTML=cards.reduce（（strHTML，card）=>{
if（card.number）strHTML+=`${card.symbol}`
返回strHTML；
}，“”）
过滤法
试试这个cards.filter（v=>v.number）.map（v=>
${v.symbol}）.join（'\n'）
试试这个cards.filter（v=>v.number）.map（v=>
${v.symbol}）.join（'\n'）很好，谢谢你抽出时间。这正是我想要实现的。Jamiec，我很难用多种方法来理解这个函数。const filteredCards=cards.filter（card=>card.number）.map（card=>{你能用最简单的方式给我解释一下吗？@PaulCfilter
和map
都是作用于数组并返回数组的方法。因此它们只是一个接一个地链接在一起。你也可以分多个步骤来完成-const filteredCards=cards.filter（…）
然后是const html=filteredCards.map（…）
。这更有意义吗？是的，非常感谢。可爱的，谢谢你的时间jamice。这正是我想要实现的。jamice，我很难用多种方法理解这个函数。const filteredCards=cards.filter（card=>card.number）。map（card=>{你能用最简单的方式给我解释一下吗？@PaulCfilter
和map
都是作用于数组并返回数组的方法。因此它们只是一个接一个地链接起来。你也可以分多个步骤来完成-const filteredCards=cards.filter（…）