Javascript 在';如果';声明?

Javascript 在';如果';声明?,javascript,jquery,json,if-statement,getjson,Javascript,Jquery,Json,If Statement,Getjson,我正在为我的游戏服务器创建一个站点,并尝试使用Steam API显示用户信息 $.getJSON('/steamapi', function(data) { document.getElementById("staff-inner").innerHTML = `${data.response.players.map(function(player) { return ` <div class="player player-${player.steamid}"&

我正在为我的游戏服务器创建一个站点,并尝试使用Steam API显示用户信息

$.getJSON('/steamapi', function(data) {

  document.getElementById("staff-inner").innerHTML = `${data.response.players.map(function(player) {

    return `

      <div class="player player-${player.steamid}">
      <div class="name">${player.personaname}</div>
      <div class="avatar"><img src="${player.avatarfull}"></div>
      <div class="role"></div>
      </div>

    `;
  }).join('')}`;

});
$.getJSON('/streamAPI',函数(数据){
document.getElementById(“员工内部”).innerHTML=`${data.response.players.map(函数(播放器){
返回`
${player.personName}
`;
}).join(“”)};
});

上面的代码运行良好。但是,我试图做的(我认为这是最好的方法)是创建一个if语句,该语句说如果${player.steamid}是我的Steam ID,它在.role中打印“Owner”,如果是其他内容,则打印“版主”。看起来很简单,但我尝试的每件事都给我留下了一页空白。我不知道在这种上下文中如何或在何处编写它。

在模板字符串中,只允许使用表达式,不允许使用语句<代码>如果是语句;但是有一个条件运算符(
?:
)具有几乎相同的语义

`...
<div class="role">${player.steamid == 'Rex4748' ? 'Owner' : 'Moderator'}</div>
...`
`。。。
${player.streamid=='Rex4748'?'Owner':'Moderator'}
...`

您可以在return语句之前声明变量并调用引用

let role = player.steamid == '111' ? 'Owner' : 'Moderator'
然后

<div class="role">${role}</div>
${role}

我没有足够的时间用steamAPI测试这一点,但我认为它会起作用:

const appDiv = document.getElementById('app');

const my_steam_id = 'Rex4748';

const players = [{
  steamid: 'Rex4748',
  avatarfull: 'https://fakeimg.pl/50/',
  personaname: 'Joe Perez'
},{
  steamid: 'notYou',
  avatarfull: 'https://fakeimg.pl/50/',
  personaname: 'NewGuy'
}]

function getPlayers(){
  let info_collected = [];
  players.map((player)=> {
    console.log(player.steamid);
    info_collected.push(`
      <div class="player player-${player.steamid}">
        <div class="name">
          ${player.personaname}
        </div>
        <div class="avatar">
          <img src="${player.avatarfull}">
        </div>
        <div class="role">
          ${player.steamid == my_steam_id ? 
            'Owner' : 
            'Moderator'}
        </div>
      </div>
      <hr>
    `);
  })
  return info_collected.join('');
}

appDiv.innerHTML = getPlayers();
const-appDiv=document.getElementById('app');
const my_steam_id='Rex4748';
康斯特玩家=[{
steamid:'Rex4748',
阿凡达福尔:'https://fakeimg.pl/50/',
人名:“乔·佩雷斯”
},{
steamid:'不是你',
阿凡达福尔:'https://fakeimg.pl/50/',
人名:“新家伙”
}]
函数getPlayers(){
让信息_收集=[];
players.map((player)=>{
console.log(player.steamid);
信息推送(`
${player.personName}
${player.steamid==我的蒸汽id?
“所有者”:
“主持人”}

`); }) 已收集退货信息。加入(“”); } appDiv.innerHTML=getPlayers();
钢笔: