Javascript 如果数组位置是从变量填充的，则后续比较是否会导致与变量名称或变量内容的比较

我相信答案就在那里，但我正在努力用术语来准确描述我的意思。我在一个游戏地图上循环，每个div中有很多SVG，我想知道Javascript是否在比较两个9个字符的字符串svgString和svgString（似乎是一个简短的比较），还是将变量中的数千个字符与数组中的数千个字符进行比较（这似乎是一个很长的比较，我可能会寻找不同的解决方案）

这是我的意思的一个例子。如果我经常这样做的话，对于可能连续500个不同的游戏单元，我觉得500 X 14个字符的比较是可以忍受的。但是数以百万计的角色比较让人觉得可能有点慢

代码复制如下，为了简单起见，我在代码和Fiddle中使用了更简单的SVG

<div id="rocket">

</div>
<div id="clicker" onclick="numCheck()">
  Click Me (if you want)
</div>

让svgString='0\
\
\
\
\
\
\
\
\
\
\
\
'
设array1=[svgString，svgString，svgString，svgString，svgString]；
函数numCheck（）{
if（数组1[2]==svgString）{
document.getElementById（'rocket'）.innerHTML=array1[2]；
}否则{
//禁止
}
}

JavaScript中的值是对对象的引用（数字等基本类型除外）

当您执行

==

测试时，它首先检查两个值是否引用同一对象。这是一个非常快速的测试，它只是比较引用中的内存地址

如果它们不引用相同的对象，它可能会执行特定于类型的相等性检查；对于字符串，这将逐个字符比较字符串

---

在本例中，由于您从与之比较的同一变量中分配了数组元素，因此该数组包含对相同字符串对象的引用。因此，对象相等性的第一次测试将成功，并且不需要比较字符串中的文本（如果对象位于同一地址，则它们显然具有相同的内容）。

不考虑变量标识符。将比较字符串。如果想加快速度比较，请考虑生成哈希并比较它们。预计算散列，因为svg是稳定的。这很好。那么一个附带的问题。。。如果我如图所示设置

rocket

的innerHTML，然后再进行另一次比较<代码>如果（document.getElementById（'rocket'）.innerHTML===array1[2]）{…我从对象中设置的innerHTML是否也引用了相同的内存位置？这需要从DOM层次结构创建一个新字符串，因此它必须比较内容。DOM不包含原始字符串。当您分配给

innerHTML

时，它会将HTML解析为对象的层次结构。当您读取

InnerHTML

，它必须遍历所有DOM元素并创建一个新的字符串表示。谢谢。我将尝试保留指向同一对象的变量和数组位置的所有比较。

#rocket {
  width: 256px;
  height: 256px;
  background: red;
}
#rocket svg {
  width: 256px;
  height: 256px;
}
#clicker {
  width: 256px;
  height: 50px;
  background: blue;
}

let svgString = '<?xml version="1.0" encoding="utf-8"?>\
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">\
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"\
     width="256px" height="256px" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve">\
<g>\
    <g>\
        <g>\
            <path fill="#020202" d="M204.192,62.194c14.147-20.472,29.339-41.613,50.963-54.72c21.323,12.782,36.366,33.547,50.311,53.656\
                c32.847,49.754,52.929,109.515,48.878,169.578c10.615,8.898,21.537,17.441,31.994,26.521\
                c15.011,13.797,22.02,35.319,18.406,55.327c-5.036,25.275-9.876,50.607-15.206,75.813c-2.963,12.968-20.508,18.905-30.823,10.62\
                c-17.121-14.291-33.816-29.108-50.932-43.417c-12.95,12.462-30.153,20.772-48.214,21.773\
                c-20.791,1.466-41.375-7.156-56.448-21.242c-12.28,9.401-23.666,20.686-35.664,30.755c-5.799,4.66-10.621,10.784-17.484,13.966\
                c-10.64,4.565-24.342-2.248-26.747-13.685c-5.479-24.642-11.203-49.24-16.52-73.92c-4.321-20.878,3.332-43.61,19.419-57.607\
                c9.313-7.822,18.756-15.487,28.243-23.096c2.643-1.39,1.315-4.596,1.465-6.951C153.005,167.614,172.8,110.333,204.192,62.194z\
                 M220.995,138.526c-12.424,15.994-10.921,40.768,3.488,55.052c15.255,16.809,44.15,17.422,60.106,1.29\
                c12.317-11.253,16.482-30.146,10.603-45.671c-5.387-14.967-19.809-26.195-35.671-27.591\
                C244.873,119.92,229.706,126.659,220.995,138.526z"/>\
        </g>\
        <path fill="#020202" d="M198.263,407.819c-0.213-7.266,8.83-12.262,14.942-8.417c25.87,13.32,58.027,13.314,83.896-0.007\
            c5.937-3.645,14.736,0.733,14.955,7.803c0.087,15.432,0.105,30.88,0.024,46.317c0.119,7.533-9.832,12.337-15.681,7.626\
            c-4.452-3.926-8.467-8.341-12.75-12.461c-6.776,13.201-13.163,26.602-19.995,39.772c-3.281,6.275-13.533,6.318-16.877,0.105\
            c-6.87-13.195-13.213-26.676-20.121-39.858c-4.221,4.157-8.248,8.548-12.694,12.468c-5.824,4.734-15.756-0.162-15.675-7.647\
            C198.163,438.291,198.244,423.055,198.263,407.819z"/>\
    </g>\
    <circle fill="#020202" cx="254.831" cy="164.509" r="20.812"/>\
</g>\
</svg>'

let array1 = [svgString, svgString, svgString, svgString, svgString];

function numCheck() {
  if (array1[2] === svgString) {
    document.getElementById('rocket').innerHTML = array1[2];
  } else {
    //do nout
  }
}