VUE 循环的使用方法集锦

vue---循环方式以及跳出循环

在做VUE项目开发过程中，数据循环是常见的操作方式，以下是几种常见的数据循环方式：

一、for循环

let data = [1,2,3,4,5,6,7,8,9,10];
for(let i=0; i<data.length; ++i){console.log(data[i]);if(i>5){break;}
}

二、forEach循环

let data = [1,2,3,4,5,6,7,8,9,10];
data.map((item,key) => {console.log(item,key);
});

map循环会分配内存空间，存储新的数据并返回

三、forEach循环

let data = [1,2,3,4,5,6,7,8,9,10];
data.forEach((item,key) => {console.log(item,key);
});

四、filter循环

let data = [1,2,3,4,5,6,7,8,9,10];
let result = data.filter((item,index) => {return item < 5;
});
console.log(result); // 1 2 3 4

过滤不满足条件的元素，把满足条件的元素返回一个新的数组，不会改变原来的数组

五、every循环（return false跳出循环）

let data = [1,2,3,4,5,6,7,8,9,10];
let result = data.every((item,key) => {return item > 10;
});
console.log(result); // false

every遍历数组，当每一项为true时返回true，否则为false

六、some循环（return true跳出循环）

let data = [1,2,3,4,5,6,7,8,9,10];
data.some((item,key) => {if(item==5){return true;}
});