在ES6中，for-of语句引入了一个简洁的方法来遍历迭代器对象和其他可迭代对象。而ES11则增加了一些功能和提高了可靠性，并且仍然有for-in语句在循环对象属性方面发挥作用。本文将探讨for-in和for-of循环之间的区别及其应用场景。
for-in 循环
for-in循环可用于枚举对象的属性。每次迭代时，它返回一个对象的键（属性名）而非值。 例如：
const obj = {a: 1, b: 2, c: 3};
for (const key in obj) {
console.log(key);
}以上代码将会输出 "a", "b" 和 "c"。
for-in循环通常与if语句结合使用，以过滤属性或仅仅处理需要的属性等。 例如：
const obj = {a: 1, b: 2, c: 3};
for (const key in obj) {
if (obj.hasOwnProperty(key)) {
console.log(key, obj[key]);
}
}以上代码输出 "a 1", "b 2" 和 "c 3"。
总体而言，for-in循环适用于遍历对象属性，但适用于复杂对象时可能导致一些问题。
for-of 循环
for-of循环可用于遍历可迭代对象中的值。ECMAScript标准定义了原始类型，字符串、数组、Set、Map和其他迭代器对象等为可迭代对象。 例如：
const arr = [1, 2, 3];
for (const val of arr) {
console.log(val);
}以上代码输出 "1", "2" 和 "3"。
for-of循环支持在异步迭代上使用await关键字，以便await处理一个异步操作时暂停迭代并等待结果并自动恢复迭代。
例如：
-- -------------------- ---- -------
----- -------- ----------- -
----- --- - ----- ---- -----
--- ----- ------ --- -- ---- -
-----------------
-
-
------------以上代码将会异步地输出 "a", "b", "c"。
总体而言，for-of循环适用于遍历值集合，特别是迭代器对象。
应用场景
for-in循环最适用于枚举对象属性，而对于数组或类似的值集合，应该使用for-of。然而，在某些情况下，或者使用自己定义的对象时，for-in循环比for-of更可靠。
当需要处理一个对象的所有属性时，使用for-in循环，如以下示例所示：
const obj = {a: 1, b: 2, c: 3};
for (const key in obj) {
console.log(key, obj[key]);
}当需要处理一个非对象的值集合时，使用for-of循环，如以下示例所示：
const arr = [1, 2, 3];
for (const val of arr) {
console.log(val);
}结论
总之，for-in和for-of是两种不同的迭代方式，各自有其适用的场景。在进行迭代时，选择正确的循环可以提高代码的效率和可读性，并减少出现错误的可能性。对于较为复杂的对象，建议使用for-in；对于值集合，建议使用for-of。
本文只是概述了两种循环以及它们的主要应用场景。因此，在实际编程中，请根据特定情况选择合适的迭代方法。
以上就是 ES11 中的 for-in 和 for-of
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/674aa53fa1ce006354994983