打字稿地图迭代失败

我正在使用下面的函数来比较两个地图。有趣的是 for 循环内的代码永远不会被执行。所以，console.log(key,val)代码永远不会被执行。当然，我确保我正在比较的映射不为空并且大小相同，以强制执行 for 循环内的代码。我犯了一个非常愚蠢的错误还是错过了一个深刻的概念？

private compareMaps(map1, map2) {
        var testVal;
        if (!(map1 && map2)) {
            return false;
        }
        if (map1.size !== map2.size) {
            return false;
        }
        for (var [key, val] of map1) {
            testVal = map2.get(key);
            console.log(key, val);
            if (testVal !== val || (testVal === undefined && !map2.has(key))) {
                return false;
            }
        }
        return true;
    }

有趣的是 for 循环内的代码永远不会被执行。我犯了一个非常愚蠢的错误还是错过了一个深刻的概念？

你忽略了这样一个事实：...

for...of不起作用Map在 ES6 之前的 TypeScript 中

当 TypeScript 编译器以 ES6 之前的 ECMAScript 为目标时，它会转译for...of语句变成for loop.

这段代码：

for (var [key, val] of map) {
    console.log(key);
}

就变成了这样的代码：

for (var _i = 0, map_1 = map; _i < map_1.length; _i++) {
    var _a = map_1[_i], key = _a[0], val = _a[1];
    console.log(key);
}

该怎么办？

Option 1：当我们必须以 ES6 之前的 ECMAScript 为目标时，forEach函数可以是一个合适的替代for...of环形。但要小心forEach有细微的差别for...of（例如提前退出、异步/等待）。

map.forEach((val, key) => { 
    console.log(key + ":" + val);
});

Option 2：当我们必须以 ES6 之前的 ECMAScript 为目标时，并且我们必须具有以下确切行为for...of, the 约翰·韦兹的回答 https://stackoverflow.com/a/45525426/1108891有道理：转换Map to an Array并迭代Array with for...of.

Option 3: 什么时候我们可以瞄准ECMAScript ES6 或更高版本 https://www.typescriptlang.org/docs/handbook/compiler-options.html， 使用for...of直接循环Map.

旁白：地图平等

如果要求是Map相等，考虑the every功能 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/every。这满足了需要break在迭代中，因为every当找到第一个时立即返回false.

如果顺序很重要为了进行比较，使用every像这样：

function areEqual<K,V>(map1: Map<K,V>, map2: Map<K,V>) { 
    if(!map1 || !map2) return false;
    const array1 = Array.from(map1.entries());
    const array2 = Array.from(map2.entries());
    return array1.every(([k1, v1], index) => {
        const [k2, v2] = array2[index];
        return k1 === k2 && v1 === v2;
    });
}

如果顺序不重要，那么我们想要设置相等；使用every像这样：

function areSetEqual<K, V>(map1: Map<K, V>, map2: Map<K, V>) { 
    if(!map1 || !map2) return false;
    const array1 = Array.from(map1.entries());
    const array2 = Array.from(map2.entries());
    return array1.length === array2.length &&
        array1.every(([k1, v1]) => map2.get(k1) === v1);
}

以下是正在运行的功能的演示：

const map1 = new Map([["key1", "val1"], ["key2", "val2"]]);
const map2 = new Map([["key1", "val1"], ["key2", "val2"]]);
const map3 = new Map([["key2", "val2"], ["key1", "val1"]]);

console.log(areEqual(map1, map2)); // true
console.log(areEqual(map1, map3)); // false
console.log(areSetEqual(map1, map2)); // true
console.log(areSetEqual(map1, map3)); // true