이 기사에서는 for, foreach, for in, for of, .each, ().each 등 6가지 JS 배열 탐색 방법을 비교하고 차이점을 소개합니다. 도움이 필요한 친구들이 모두 참고할 수 있기를 바랍니다.
배열을 탐색하는 데 사용되는 Javascript의 for 루프
var arr = [1,2,3,4] for(var i = 0 ; i< arr.length ; i++){ console.log(arr[i]) } //1,2,3,4
9-9 곱셈표:
for ( var x = 1; x <= 9; x++) { var str=""; for ( var y = 1; y <= x; y++) { str+=x + "*" + y + " = " + (x * y)+" "; } console.log(str); }
forEach 루프를 사용하면 요소를 직접 얻을 수 있고 인덱스 값도 얻을 수 있습니다. 하지만 forEach에도 몇 가지 제한 사항이 있습니다. 루프를 종료하기 위해 계속 건너뛰거나 중단할 수 없습니다. 그리고 object
배열을 순회할 때 item은 인덱스 값을 나타내고, arr은 현재 인덱스 값 arr[item]에 해당하는 요소를 나타냅니다.객체, item은 키 값을 나타내고, arr은 키 값 obj[item]에 해당하는 값을 나타냅니다. 일반적으로 루프가 통과하는 것은 객체 자체의 모든 열거 가능한 속성을 탐색하는 객체의 속성입니다. 객체가 생성자 프로토타입에서 상속하는 속성
let arr = ['a', 'b', 'c', 'd'] arr.forEach(function (val, index, arr) { console.log('index:'+index+','+'val:'+val) // val是当前元素,index当前元素索引,arr数组 console.log(arr) }) //index:0,val:a //["a", "b", "c", "d"]0: "a"1: "b"2: "c"3: "d" //index:1,val:b //["a", "b", "c", "d"] //index:2,val:c //["a", "b", "c", "d"] //index:3,val:d //["a", "b", "c", "d"]
배열에 대한 반복:
[].forEach(function(value,index,array){ //do something }); 等价于: $.each([],function(index,value,array){ //do something })
var obj = {a:1, b:2, c:3};
for (let item in obj) {
console.log("obj." + item + " = " + obj[item]);
}
// obj.a = 1
// obj.b = 2
// obj.c = 3
var arr = ['a','b','c'];
for (var item in arr) {
console.log(item) //0 1 2
console.log(arr[item]) //a b c
}
循环一个 Set: 循环一个拥有enumerable属性的对象 循环一个生成器(generators): $.each(arr|obj, function(k, v)) $().each()在dom处理上面用的较多,主要是用来遍历DOMList。如果页面有多个input标签类型为checkbox,对于这时用$().each()来处理多个checkbox,例如: 推荐在循环对象属性的时候使用for in,在遍历数组的时候的时候使用for of; 跳出循环的方式有如下几种: 更多编程相关知识,请访问:编程视频!! 위 내용은 JavaScript 배열 탐색의 6가지 방법 비교의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!let iterable = new Map([["a", 1], ["b", 2], ["c", 3]]);
for (let [key, value] of iterable) {
console.log(value);
}
// 1
// 2
// 3
for (let entry of iterable) {
console.log(entry);
}
// [a, 1]
// [b, 2]
// [c, 3]
let iterable = new Set([1, 1, 2, 2, 3, 3]);
for (let value of iterable) {
console.log(value);
}
// 1
// 2
// 3
for of循环并不能直接使用在普通的对象上,但如果我们按对象所拥有的属性进行循环,可使用内置的Object.keys()方法:for (var key of Object.keys(someObject)) {
console.log(key + ": " + someObject[key]);
}
function* fibonacci() { // a generator function
let [prev, curr] = [0, 1];
while (true) {
[prev, curr] = [curr, prev + curr];
yield curr;
}
}
for (let n of fibonacci()) {
console.log(n);
// truncate the sequence at 1000
if (n >= 1000) {
break;
}
}
五、jQuery里面的$.each
可以用来遍历数组和对象,其中k表示索引值或者key值,v表示value值var arr = ['a','b','c']
$.each(arr, function(key, val) {
console.log(key, val);
})
//0 a
//1 b
//2 c
六、jQuery里面的$().each()
$(“input[name=’checkbox’]”).each(function(i){
if($(this).attr(‘checked’)==true){
//操作代码
}
结论:
for in循环出的是key,for of循环出的是value;
for of是ES6新引入的特性。修复了ES5的for in的不足;
for of不能循环普通的对象,需要通过和Object.keys()搭配使用。
return 函数执行被终止;
break 循环被终止;
continue 循环被跳过。