Javascript：使用函数定义对象属性的值

我正在尝试创建一个简单的程序，它将根据一个人的经验量（totalTime）分配一个数字（riskLevel），并将其全部输入HTML的快速表格中

我对这个.riskLevel值有问题。我试图让它获取totalTime值，并使用if/else语句将一个整数赋值给riskLevel

当我调用getCrewmember（）函数（使用submit按钮）时，firstName、lastName和totalTime都正确地填充到HTML表中。riskLevel没有，它只是写出函数的整个代码

我做错了什么？此外，我希望能够在html文本输入字段中输入姓名，并在程序中显示该人员的姓名。如何告诉getCrewmember（）函数获取输入到文本feld中的值

代码如下：

function pilot(firstName, lastName, totalTime){
   this.firstName=firstName;
   this.lastName=lastName;
   this.totalTime=totalTime;
   this.riskLevel=function(){  
    if(this.totalTime >= 1000){
        riskLevel = 1;
    }else if(this.totalTime >=500){
    riskLevel = 2;
   }else if(this.totalTime >= 250){
    riskLevel = 3;
   }
}
}

var jdoe = new pilot("Jon", "Doe", 480)
function getCrewmember(){
  document.getElementById("firstName").innerHTML = jdoe.firstName;
  document.getElementById("lastName").innerHTML = jdoe.lastName;
  document.getElementById("totalHours").innerHTML = jdoe.totalTime;
  document.getElementById("riskLevel").innerHTML = jdoe.riskLevel;
}
</script>

<table>
    <thead>
        <th>First</th>
        <th>Last</th>
        <th>Total Hours</th>
        <th>Risk Level</th> 
    </thead>
    <tr>
        <td id="firstName">First Name</td>
        <td id="lastName">Last Name</td>
        <td id="totalHours">Total Hours</td>
        <td id="riskLevel">Risk Level</td>
    </tr>
    <tr>
        <td><input type="text" id="textField"></td>
    </tr>
    <tr>
        <td><input type="submit" value="Get Crewmember" onclick="getCrewmember()"></td>
    </tr>

</table>

函数引导（firstName、lastName、totalTime）{
this.firstName=firstName；
this.lastName=lastName；
totalTime=totalTime；
this.riskLevel=函数（）{
如果（this.totalTime>=1000）{
风险等级=1；
}否则如果（this.totalTime>=500）{
风险等级=2；
}否则如果（this.totalTime>=250）{
风险水平=3；
}
}
}
var jdoe=新飞行员（“Jon”，“Doe”，480）
函数getCrewmember（）{
document.getElementById（“firstName”）.innerHTML=jdoe.firstName；
document.getElementById（“lastName”）.innerHTML=jdoe.lastName；
document.getElementById（“totalHours”）.innerHTML=jdoe.totalTime；
document.getElementById（“riskLevel”）.innerHTML=jdoe.riskLevel；
}
弗斯特
最后
总小时数
风险水平
名字
姓
总小时数
风险水平

riskLevel

是一个函数，可以分配给不同的变量（包括DOM元素的

innerHTML

）。将其分配给DOM元素时，此函数将转换为字符串。您要做的是获取计算出的

riskLevel

，这意味着您需要调用函数（而不仅仅是分配函数）

首先，您需要返回

riskLevel

的值：

this.riskLevel = function() {
  // Create a local, rather than global
  // variable to hold the return value
  var riskLevel = 4;
  if (this.totalTime >= 1000) {
    riskLevel = 1;
  } else if (this.totalTime >=500) {
    riskLevel = 2;
  } else if (this.totalTime >= 250) {
    riskLevel = 3;
  }
  return riskLevel;
}

然后，您需要更改您的调用：

document.getElementById("riskLevel").innerHTML = jdoe.riskLevel(); // Invoke it

现在，每次调用

somePilot.riskLevel（）

时，您都会得到飞行员的当前风险级别。当飞行员的总时间发生变化时，他的风险水平也会发生变化

ECMAScript 5解决方案 如果您希望

riskLevel

看起来就像

totalTime

（例如，只是另一个属性），您可以使用在

pilot

构造函数中创建计算的getter：

Object.defineProperty(this, 'riskLevel', {
  get: function() {
    var riskLevel = 4;
    // Rest of riskLevel code goes here, along with return
  },
  writable: false
});

然后，您将能够获得

riskLevel

的值，就像它是任何其他属性（）一样，您将获得计算值。（也就是说，

.innerHTML=jdoe.riskLevel

将正常工作。）

替换此：

this.riskLevel=function(){  
    if(this.totalTime >= 1000){
        riskLevel = 1;
    }else if(this.totalTime >=500){
    riskLevel = 2;
   }else if(this.totalTime >= 250){
    riskLevel = 3;
  }
}

据此：

  if(this.totalTime >= 1000){
        this.riskLevel = 1;
  }else if(this.totalTime >=500){
        this.riskLevel = 2;
  }else if(this.totalTime >= 250){
        this.riskLevel = 3;
  }

---

您正在将变量分配给函数 试一试

或者是一个自动执行的函数

riskLevel = (function(){  
    if(this.totalTime >= 1000){
    return  1;
    }else if(this.totalTime >=500){
    return 2;
   }else if(this.totalTime >= 250){
    return 3;
   }
})();

或赋值给函数外部的变量

var riskLevel;
function setRisk(){  
    if(this.totalTime >= 1000){
    riskLevel =  1;
    }else if(this.totalTime >=500){
    riskLevel = 2;
   }else if(this.totalTime >= 250){
    riskLevel = 3;
   }
};
setRisk()

或者根本不给我们一个函数，只做if-else

if(this.totalTime >= 1000){
   riskLevel =  1;
}else if(this.totalTime >=500){
   riskLevel = 2;
}else if(this.totalTime >= 250){
   riskLevel = 3;
}

---

我想这就是你的意思：

this.riskLevel= function(){  
  if(this.totalTime >= 1000){
    return 1;
  }else if(this.totalTime >=500){
    return 2;
  }else if(this.totalTime >= 250){
    return 3;
  }
}

然后你会称之为：

document.getElementById("riskLevel").innerHTML = jdoe.riskLevel()

---

您希望调用方法：

jdoe.riskLevel（）

，并希望

返回1 | 2 | 3而不是分配给
风险级别
Awesome。我刚让它工作起来。另外，感谢您提供的多种解决方案，这有助于我了解正在发生的事情。谢谢肖恩。这是我的第一个HTML/CSS/JS项目的一小部分，我有很多东西要学习，并欣赏超快速的响应