javascript forEach 범용 루프 순회 방법_javascript 기술

코드 복사 코드는 다음과 같습니다.

var forEach = (function(){
/ /배열 및 의사 배열 탐색
var _Array_forEach = function (array, block, context) {
if (array == null) return
//문자열에 대한 특수 처리
if(typeof array = = 'string'){
array = array.split('');
}
var i = 0,length = array.length;
for (;i < length && block. call (context, array[i], (i 1), array)!==false; i ) {}
}//객체 순회
var _Function_forEach = 함수(객체, 블록, context ) {
for (객체의 var key) {
//로컬 속성만 순회
if (object.hasOwnProperty(key)&&block.call(context, object[key], key, object)= = =false){
break;
}
}
return function(object, block, context){
if (object == null) return; > if (typeof object.length == "number") {
_Array_forEach(객체, 블록, 컨텍스트)
}else{
_Function_forEach(객체, 블록, 컨텍스트)
> };
})()


기능 자체는 복잡하지 않지만 매우 섬세합니다. 몇 가지 간단한 설명을 추가했습니다. 모두가 이해할 수 있기를 바랍니다.
예제 살펴보기

코드 복사

코드는 다음과 같습니다. / /1:1 n 2:2 forEach([1,2,3,4,5],function(el,index){

if(index>2){

return false;
}
alert(index ":" el);
})
function print(el,index){
alert(index ":" el)
}
//a: a n b:b n c:c
forEach({a:'a',b:'b',c:'c'},print)
//1: 멍청한 n 2: 달걀 n 3: n 4: 좌석 n 5: 오른쪽 n 6: 비문
forEach("바보의 좌우명",print)
function Person(이름, 나이) {
this.name = 이름 "" ;
this.age = 연령 || 0;
Person.prototype = new Person;
var fred = new Person("jxl", 22); = " Chinese";//매우 늦은 바인딩
//name:jxl n age:22 n 언어:chinese
forEach(fred,print)


참고: 콜백에서 function 인덱스 매개변수 첨자는 1부터 시작합니다.
내장 forEach를 사용하면 어떨까요
getElementsByClassName과 마찬가지로 내장 forEach도 매우 효율적이지만 루프 중간에 종료할 수 없습니다. . forEach에서는 처리 함수 내에서 false를 반환하여 루프를 종료할 수 있으며 이는 보다 유연합니다.
특수 길이 속성
길이 속성은 배열을 보면 당연히 길이 속성이 있는 객체를 떠올리게 됩니다. 그렇다면 모두가 의사 배열(배열과 유사한)을 생각해야 합니다. 그렇다면 의사 배열이란 무엇입니까? 간단히 이해하면 Array.prototype.slice를 통해 실제 배열의 길이 속성을 가진 객체로 변환할 수 있다는 것입니다. JavaScript에서 가장 유명한 의사 배열은 인수 객체입니다. 의사 배열에 대해서는 많은 것들이 있으며 앞으로 이에 대한 블로그 게시물을 작성할 것입니다. 모두가 기억해야 할 점은, 의사 배열로 사용할 것이라는 점을 명확하게 알지 않는 한 객체에 길이 속성을 아무렇게나 할당하지 마십시오.

이 기능은 단순한 JavaScript 도구 라이브러리에 꼭 필요한 기능이라고 생각합니다. 이를 기반으로 재캡슐화하면 라이브러리를 더욱 강력하고 아름답게 만들 수 있습니다!