2024年Web前端最新【面试题】for(2)，2024年最新去面试拿什么文件袋

最后

如果你已经下定决心要转行做编程行业，在最开始的时候就要对自己的学习有一个基本的规划，还要对这个行业的技术需求有一个基本的了解。有一个已就业为目的的学习目标，然后为之努力，坚持到底。如果你有幸看到这篇文章，希望对你有所帮助，祝你转行成功。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

const john = new Person(‘John’);

for (const key in john) {
console.log(key, john[key]);
}

在上面的示例中，`for...in` 循环不仅遍历了 `john` 对象自身的属性（`name`），还遍历了其原型链上的属性（`age`）。


#### 1.3 按照随机顺序


`for...in` 循环不保证按照属性的顺序进行迭代。属性的顺序可能是随机的，这取决于 JavaScript 引擎的实现。

const colors = {
a: ‘red’,
b: ‘green’,
c: ‘blue’
};

for (const key in colors) {
console.log(key, colors[key]);
}

在上面的示例中，属性的遍历顺序可能是 `b`、`a`、`c` 或其他随机顺序。


#### 1.4 不能直接访问属性值


在 `for...in` 循环中，你需要通过属性的名称来访问属性的值，这可能会使代码看起来更加冗长。

const person = {
name: ‘John’,
age: 30,
};

for (const key in person) {
const value = person[key];
console.log(key, value);
}

在上面的示例中，我们需要使用 `person[key]` 来访问属性值，而不能直接访问。


### 2. `for...of` 循环


`for...of` 循环是一种用于遍历可迭代对象（如数组、字符串、Map、Set 等）的迭代方式。它的语法结构如下：

for (const element of iterable) {
// 执行代码
}

#### 2.1 遍历数组元素


`for...of` 循环非常适合遍历数组中的元素，它会将数组的每个元素作为迭代变量 `element` 的值。

const numbers = [1, 2, 3, 4, 5];

for (const num of numbers) {
console.log(num);
}

在上面的示例中，`for...of` 循环遍历了 `numbers` 数组的元素，并打印了每个元素的值。


#### 2.2 不遍历对象属性


与 `for...in` 循环不同，`for...of` 循环不会遍历对象的属性，它专门用于遍历可迭代对象。如果你尝试将对象用于 `for...of` 循环，将会得到错误。

const person = {
name: ‘John’,
age: 30,
};

for (const value of person) {
console.log(value);
}
// TypeError: person is not iterable

在上面的示例中，尝试遍历 `person` 对象会导致类型错误，因为对象不是可迭代的。


#### 2.3 按照顺序迭代


`for...of` 循环保证按照对象中元素的顺序进行迭代。这意味着遍历数组时会按照数组的顺序进行，不会出现随机顺序的情况。

const colors = [‘red’, ‘green’, ‘blue’];

for (const color of colors) {
console.log(color);
}

在上面的示例中，属性的遍历顺序是 `red`、`green`、`blue`。


#### 2.4 直接访问元素值


在 `for...of` 循环中，你可以直接访问可迭代对象的元素值，而不需要使用索引或属性名称。

const numbers = [1, 2, 3, 4, 5];

最后：

总结来说，面试成功=基础知识+项目经验+表达技巧+运气。我们无法控制运气，但是我们可以在别的地方花更多时间，每个环节都提前做好准备。

面试一方面是为了找到工作，升职加薪，另一方面也是对于自我能力的考察。能够面试成功不仅仅是来自面试前的临时抱佛脚，更重要的是在平时学习和工作中不断积累和坚持，把每个知识点、每一次项目开发、每次遇到的难点知识，做好积累，实践和总结。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

积累，实践和总结。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

[外链图片转存中…(img-WDFpSOmn-1715448015322)]