資料結構
網路
關係資料庫管理系統 (RDBMS)
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
服裝學
法學JavaScript迭代器函式的使用
本文將討論JavaScript中迭代器函式的重要性。我們可以使用迭代器函式來迭代陣列。除了顯式迭代之外，JavaScript還提供各種迭代函式，可用於迭代陣列。這裡，我們使用forEach()、filter()方法和map()方法來迭代陣列並執行所需的操作。
ForEach函式
此函式將一個函式作為引數，並在陣列中的每個物件上執行該函式。
語法
以下是forEach()方法的語法。
array.forEach(function(currentValue, index, arr), thisValue)
示例1
一個使用forEach()方法作為JavaScript中迭代器函式的示例
let people = ['Harry', 'Martha', 'John', 'Sam'] people.forEach(person => console.log(person.toUpperCase()));
示例2
在這個例子中，我們將討論forEach()方法的使用。在這裡，我們使用forEach()方法迭代陣列並顯示結果。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Iterator functions in JavaScript</title>
<div id="forEach"></div>
</head>
<body>
<script type="text/javascript">
let students = ["Harry", "Martha", "John", "Sam"];
students.forEach((mem) => document.write(mem.toUpperCase(), "<br>"));
</script>
</body>
</html>
Filter()函式
此函式對陣列中的每個物件執行傳遞給它的函式，並根據返回真值的值建立一個新陣列。
語法
以下是filter()方法的語法。
array.filter(function(currentValue, index, arr), thisValue)
示例1
在這個例子中，我們將討論filter()方法的使用。我們使用filter()方法迭代陣列並顯示結果。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Iterator functions in JavaScript</title>
</head>
<body>
<script type="text/javascript">
let students = ["Harry", "Martha", "John", "Sam"];
document.write(students.filter((mem) => mem[0] === "H"));
</script>
</body>
</html>
示例2
另一個使用filter()函式的迭代示例如下：
let people = ['Harry', 'Martha', 'John', 'Sam'] console.log(people.filter(person => person[0] === 'H'));
Map函式
此函式對陣列中的每個物件執行傳遞給它的函式，並根據返回的值建立一個新陣列。
語法
以下是map()方法的語法。
array.map(function(currentValue, index, arr), thisValue)
示例1
在這個例子中，我們將討論map()方法的使用。在這裡，我們使用map()方法迭代陣列並顯示結果。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Iterator functions in JavaScript</title>
<div id="map"></div>
</head>
<body>
<script type="text/javascript">
let students = ["Harry", "Martha", "John", "Sam"];
let upperCaseNames = students.map((mem) => mem.toUpperCase());
document.getElementById("map").innerHTML = upperCaseNames;
</script>
</body>
</html>
示例2
以下示例使用map()函式在JavaScript中執行迭代：
let people = ['Harry', 'Martha', 'John', 'Sam'] let upperCaseNames = people.map(person => person.toUpperCase()) console.log(upperCaseNames);
更新於：2022年12月16日
259 次瀏覽
廣告