第一句子网 - 唯美句子、句子迷、好句子大全
第一句子网 > js_遍历(不同的for) for for of for in forEach 相关实例

js_遍历(不同的for) for for of for in forEach 相关实例

时间:2019-02-24 13:22:51

相关推荐

js_遍历(不同的for) for  for of  for in  forEach 相关实例

文章目录

基础forfor 增强forfor offor in 遍历数组forfor offor inforEachforEach() and push() 例子1例子2(demo codes2)

基础for

for循环与 C 和 Java 中的相同:使用时可以在一行代码中提供控制信息。

for

for (var i = 0; i < 5; i++) {// 将会执行五次}

增强for

JavaScript 也还包括其他两种重要的 for 循环:

for offor in

for of

forof

for (let value of array) {// do something with value}

for in

常用于js对象的属性(字段)遍历

forin

for (let property in object) {// do something with object property}

遍历数组

for

可以通过如下方式遍历一个数组:

for (var i = 0; i < a.length; i++) {// Do something with a[i]}

for of

ES 引入了更加简洁的forof循环,可以用它来遍历可迭代对象,例如数组:

for (const currentValue of a) {// Do something with currentValue}

for in

不推荐此方式遍历数组

遍历数组的另一种方法是使用for...in循环, 然而这并不是遍历数组元素而是数组的索引。注意,如果哪个家伙直接向Array.prototype添加了新的属性,使用这样的循环这些属性也同样会被遍历。所以并不推荐使用这种方法遍历数组

for (var i in a) {// 操作 a[i]}

forEach

ECMAScript 5 增加了另一个遍历数组的方法,forEach

["dog", "cat", "hen"].forEach(function(currentValue, index, array) {// 操作 currentValue 或者 array[index]});

如果想在数组后追加元素,只需要:

a.push(item);

forEach() and push()

除了forEach()push(),Array(数组)类还自带了许多方法。建议查看 Array 方法的完整文档。

例子1

array = [1, 2, 3, 4];names_array = ["a", "b", "c", "d",];object = {name: "John",age: 30,city: "New York"};/* baisc for */for (var i = 0; i < 5; i++) {// 将会执行五次console.log(i);}/* for of遍历可迭代对象 */for (let value of names_array) {console.log(value);}for (let value of array) {// do something with valueconsole.log(value);}/* for in遍历key of object /index of array */// 检查对象的所有字段(key)for (let property in object) {// do something with object propertyconsole.log(property, ':', object[property]);}for (let index in names_array) {console.log(index, ':', names_array[index]);}/* forEach */names_array.forEach(element => {console.log(element);});

例子2(demo codes2)

let list1 = [11, 22, 33, 44];let list2 = [];const demoOfForEach = () => {list1.forEach((item) => {item += "miniProgram";list2.push(item);});console.log(list1, `expected no change in list1`);console.log(list2, `expected changes`);};const demoOfMap = () => {let list3 = list1.map((item) => {{return `${item}miniProgaming`;}});console.log(`${list3}`);};const demoOfForOf = () => {console.log(`this is list3:${list3}`);/* demo in for */console.log(`demo forOf`, `;👌element of the list are expected to print out `);for (const item of list1) {console.log(item);}};/* demo of for of */const demoOfForIn = () => {console.log(`demo forIn`, `;👌index is expected to be print out.`);for (const prop in list1) {console.log(prop);}};const list10 = [7, 8, 9];const demoOfExpend = () => {const newList = [...list1, ...list10];const size = newList.length;console.log(`${newList}`);console.log(`length:${newList.length}`);};/* test: */// demoOfForEach();按需调用相应函数查看结果demoOfExpend();

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。