javascript - 说明 - String.prototype 中的自定义方法

Question

我正在尝试使用 String.proptotype 添加一种自定义方法来比较字符串。看下面的代码

 String.prototype.compare = function(val) {
        return this === val;
 }

我正在比较两个值是否相等。请看下面的代码片段。

function getSelectValue() {
         var selectedValue = document.getElementById("dropdownList").value;
         if(selectedValue==="stackoverflow") {
              document.getElementById("name").value = "Stack Overflow";
         } else {
              document.getElementById("name").value = "Stack Community";
         }
 }

<select id="dropdownList" name="dropdownList" onchange="getSelectValue();">
    <option value="stackoverflow">overflow</option>
    <option value="stackcommunity">Community</option>
</select>
<input type="text" id="name" value="" disabled> 

上面的代码片段工作正常，比较所选值并将其显示在文本框中。我尝试使用自定义方法 compare 更改行 selectedValue==="stackoverflow" ，但它不起作用。它总是落入 else 部分。请看下面的代码片段。

function getSelectValue() {
        String.prototype.compare = function(val) {
              return this === val;
        }
        var selectedValue = document.getElementById("dropdownList").value;
        if(selectedValue.compare("stackoverflow")) {
            document.getElementById("name").value = "Stack Overflow";
        } else {
            document.getElementById("name").value = "Stack Community";
        }
 }

<select id="dropdownList" name="dropdownList" onchange="getSelectValue();">
      <option value="stackoverflow">overflow</option>
      <option value="stackcommunity">Community</option>
</select>
<input type="text" id="name" value="" disabled> 

不确定我在这里做错了什么？请澄清。

Answer 1

使用this.toString()进行比较。

function getSelectValue() {
        String.prototype.compare = function(val) {
                      return this.toString() === val;
        }
        var selectedValue = document.getElementById("dropdownList").value;
        if(selectedValue.compare("stackoverflow")) {
            document.getElementById("name").value = "Stack Overflow";
        } else {
            document.getElementById("name").value = "Stack Community";
        }
 }

<select id="dropdownList" name="dropdownList" onchange="getSelectValue();">
      <option value="stackoverflow">overflow</option>
      <option value="stackcommunity">Community</option>
</select>
<input type="text" id="name" value="" disabled>