JavaScript中的循环结构和迭代器

翻滚的胖子
2023-06-17 09:40:45
JavaScript Python

什么是循环结构

循环结构是指在程序运行时，根据一定条件，重复执行相同或相似的代码段，直到满足退出循环的条件。在JavaScript中，常用的循环结构有for循环、while循环和do-while循环。

for循环

for循环是一种常用的循环结构，其基本语法如下：

for (初始化表达式; 条件表达式; 增量表达式) {
    代码块
}

其中，初始化表达式用于初始化计数器变量，条件表达式用于判断是否继续循环，增量表达式用于更新计数器变量。

下面是一个简单的for循环的代码案例：

for (var i = 0; i < 10; i++) {
    console.log(i);
}

上述代码将会输出0到9的数字。

while循环

while循环也是一种常用的循环结构，其基本语法如下：

while (条件表达式) {
    代码块
}

其中，条件表达式用于判断是否继续循环，如果条件表达式的结果为true，则继续执行循环体内的代码块，否则跳出循环。

下面是一个简单的while循环的代码案例：

var i = 0;
while (i < 10) {
    console.log(i);
    i++;
}

上述代码将会输出0到9的数字。

do-while循环

do-while循环也是一种常用的循环结构，其基本语法如下：

do {
    代码块
} while (条件表达式);

其中，先执行一遍循环体内的代码块，然后再判断条件表达式是否为true，如果为true，则继续执行循环体内的代码块，否则跳出循环。

下面是一个简单的do-while循环的代码案例：

var i = 0;
do {
    console.log(i);
    i++;
} while (i < 10);

上述代码将会输出0到9的数字。

什么是迭代器

迭代器是一种JavaScript对象，其作用是遍历一个集合，并把其中的每个元素按照一定的顺序依次访问。在JavaScript中，常用的迭代器有数组迭代器和Map迭代器。

数组迭代器

数组迭代器是一种用于遍历数组的迭代器，在JavaScript中，常用的数组迭代器有forEach()、map()、filter()、reduce()等函数。

forEach()

forEach()函数用于遍历数组中的每个元素，并对每个元素执行指定的操作。其基本语法如下：

arr.forEach(function (value, index, array) {
    代码块
});

其中，value表示当前元素的值，index表示当前元素的下标，array表示当前遍历的数组。

下面是一个简单的forEach()函数的代码案例：

var arr = [1, 2, 3, 4, 5];
arr.forEach(function (value, index, array) {
    console.log(value);
});

上述代码将会输出1到5的数字。

map()

map()函数用于遍历数组中的每个元素，并对每个元素执行指定的操作，最终返回一个新的数组。其基本语法如下：

var newArr = arr.map(function (value, index, array) {
    return value * 2;
});

其中，value表示当前元素的值，index表示当前元素的下标，array表示当前遍历的数组。

下面是一个简单的map()函数的代码案例：

var arr = [1, 2, 3, 4, 5];
var newArr = arr.map(function (value, index, array) {
    return value * 2;
});
console.log(newArr);

上述代码将会输出2、4、6、8、10这五个数字。

filter()

filter()函数用于遍历数组中的每个元素，并对每个元素执行指定的操作，最终返回一个新的数组，新数组中只包含符合条件的元素。其基本语法如下：

var newArr = arr.filter(function (value, index, array) {
    return value > 2;
});

其中，value表示当前元素的值，index表示当前元素的下标，array表示当前遍历的数组。

下面是一个简单的filter()函数的代码案例：

var arr = [1, 2, 3, 4, 5];
var newArr = arr.filter(function (value, index, array) {
    return value > 2;
});
console.log(newArr);

上述代码将会输出3、4、5这三个数字。

reduce()

reduce()函数用于遍历数组中的每个元素，并对每个元素执行指定的操作，最终返回一个累加的结果。其基本语法如下：

var sum = arr.reduce(function (prev, curr, index, array) {
    return prev + curr;
});

其中，prev表示上一个元素的值，curr表示当前元素的值，index表示当前元素的下标，array表示当前遍历的数组。

下面是一个简单的reduce()函数的代码案例：

var arr = [1, 2, 3, 4, 5];
var sum = arr.reduce(function (prev, curr, index, array) {
    return prev + curr;
});
console.log(sum);

上述代码将会输出15这个数字。

Map迭代器

Map迭代器是一种用于遍历Map对象的迭代器，在JavaScript中，常用的Map迭代器有forEach()、keys()、values()、entries()等函数。

forEach()

forEach()函数用于遍历Map对象中的每个元素，并对每个元素执行指定的操作。其基本语法如下：

map.forEach(function (value, key, map) {
    代码块
});

其中，value表示当前元素的值，key表示当前元素的键，map表示当前遍历的Map对象。

下面是一个简单的forEach()函数的代码案例：

var map = new Map();
map.set('name', 'Tom');
map.set('age', 18);
map.forEach(function (value, key, map) {
    console.log(key + ': ' + value);
});

上述代码将会输出name: Tom和age: 18这两个键值对。

keys()

keys()函数用于遍历Map对象中的每个键，并返回一个新的迭代器。其基本语法如下：

var keyIter = map.keys();

其中，keyIter表示一个新的迭代器，可以通过调用next()方法遍历其中的每个键。

下面是一个简单的keys()函数的代码案例：

var map = new Map();
map.set('name', 'Tom');
map.set('age', 18);
var keyIter = map.keys();
for (var key of keyIter) {
    console.log(key);
}

上述代码将会输出name和age这两个键。

values()

values()函数用于遍历Map对象中的每个值，并返回一个新的迭代器。其基本语法如下：

var valueIter = map.values();

其中，valueIter表示一个新的迭代器，可以通过调用next()方法遍历其中的每个值。

下面是一个简单的values()函数的代码案例：

var map = new Map();
map.set('name', 'Tom');
map.set('age', 18);
var valueIter = map.values();
for (var value of valueIter) {
    console.log(value);
}

上述代码将会输出Tom和18这两个值。

entries()

entries()函数用于遍历Map对象中的每个键值对，并返回一个新的迭代器。其基本语法如下：

var entryIter = map.entries();

其中，entryIter表示一个新的迭代器，可以通过调用next()方法遍历其中的每个键值对。

下面是一个简单的entries()函数的代码案例：

var map = new Map();
map.set('name', 'Tom');
map.set('age', 18);
var entryIter = map.entries();
for (var entry of entryIter) {
    console.log(entry[0] + ': ' + entry[1]);
}

上述代码将会输出name: Tom和age: 18这两个键值对。