正在加载...
数组遍历
songs 里放着 rain、tide 和 dusk，这一整页个数都锁着，因为 forEach 只负责挨个看，并不像上一课那样把列表加长或缩短。
长度不动
这一次走路是一次方法调用，索引也可以一起交给你，这和只交出值的 for...of 不一样。末尾不会再粘上标题，列表里也不会少掉标题。
你交出去的函数
你交出一个函数，每首歌跑一次，下面那张卡片就是这一页的约定。
📊 forEach 交给你什么
| 部分 | 什么时候到手 | 它不是 |
|---|---|---|
| 第一个参数 | 每一次到访 | 长度 |
| 第二个参数 | 只有你写下名字时 | 必填 |
| 调用的结果 | forEach 结束时 |
一个新数组 |
之后的 length |
你去读 songs.length 时 |
被这次到访改过 |
歌名是第一个参数，索引是第二个参数，你可以不写它。
控制台里的顺序
把每个标题都打印出来。先是 rain，然后 tide，最后是 dusk。
let songs = ["rain", "tide", "dusk"];
songs.forEach(function (title) {
console.log(title);
});
会出现三行，从数组前面走到后面。三个字符串还待在原来的格子里。
let songs = ["rain", "tide", "dusk"];
songs.forEach(function (title, i) {
console.log(i);
console.log(title);
});
零属于 rain，二属于 dusk，tide 夹在中间，坐在一上。
let songs = ["rain", "tide", "dusk"];
let result = songs.forEach(function (title) {
console.log(title);
});
console.log(result);
console.log(songs.length);
把这次调用放进变量再打印，你会看到 undefined，它既不是标题也不是长度。length 的打印仍然是 3。
let songs = ["rain", "tide", "dusk"];
songs.forEach(function (title) {
if (title === "tide") {
return;
}
console.log(title);
});
标题若是 tide 并且你立刻 return，这一行不会打印。走动并不停下，dusk 仍然会出现。
let songs = ["rain", "tide", "dusk"];
let seen = 0;
songs.forEach(function (title) {
seen = seen + 1;
});
console.log(seen);
console.log(songs.length);
你的计数停在 3，length 也是 3，可这笔账是你自己记的，调用并没有把总数交回来。
段落里的标题
做一条字符串，标题之间留一个空格，再写进段落。不要把长度写进这一行。
<!DOCTYPE html>
<html>
<head>
<title>array-iteration — page</title>
</head>
<body>
<p id="line">…</p>
<script>
let songs = ["rain", "tide", "dusk"];
let line = "";
songs.forEach(function (title) {
if (line !== "") {
line = line + " ";
}
line = line + title;
});
let box = document.getElementById("line");
box.textContent = line;
</script>
</body>
</html>
这一行会带空格显示三个标题，把 tide 改成 fog 再刷新，中间那个词会换掉。到访仍然盖住三个标题。
自己走一遍
- 把三个标题打印出来。确认
rain在最前 - 把每个索引打印出来，确认
rain在 0 - 把调用的结果存下来，在长度仍是 3 时看到
undefined - 遇到
tide立刻return，确认dusk仍会打印 - 每次到访给
seen加 1，确认结果是 3 - 读页面上的那一行，把
tide改成fog再刷新
容易读错
- 别指望调用把最后一个标题交回来。交回来的不是一首歌
- 别指望调用把长度交回来
- 别在函数里写
break，那是语法错误 - 别以为
tide之后的return也会拦住dusk - 别把第二个参数读成标题
- 别在这一页按值去搜索
带走这些
forEach从前走到后，挨个看每一项，第一个参数就是那一项- 第二个参数是索引
- 调用自己的结果是
undefined - 函数里的
return只跳过这一次到访 - 下一页按值来搜索
🧠 测试您的知识
准备开始
测试您的知识
通过这个互动测验挑战自己，看看你对这个主题的理解程度如何
8
问题
70%
及格要求
∞
时间
∞
尝试次数
📝 说明
- 仔细阅读每个问题
- 为每个问题选择最佳答案
- 您可以随时重新参加测验
- 您的进度将显示在顶部