JavaScript 프로그램의 Array 배열 객체 확장 기능 예

문자열 공백 제거, 배열 정렬 등 문자열, 함수 및 배열의 ​​프로토타입에 사용자 정의 확장 함수를 추가하는 경우가 많습니다.

오늘은 Array 객체를 확장하는 방법에 중점을 두겠습니다

1. Array.prototype에서 직접 확장

2. 자신만의 방법을 사용하여 배열 객체를 확장합니다.

Array.prototype에서 직접 확장하고 DOM 객체에서 직접 사용할 수 없습니다. 예: document .getElementsByTagName('div')가 nodeList를 얻었음);

또한 결벽증이 있는 학생들을 위한 원래 생태 환경을 깨뜨립니다. )

먼저 배열을 작동하는 몇 가지 방법을 살펴보겠습니다. yui, 여기서는 간단히 소스 코드를 제거하고 변경했습니다

(function(){
var YArray;

YArray = function(o,idx,arraylike){
var t = (같은 배열) ? 2 : YArray.test(o),
l, a, start = idx || 0;
if (t) {
try {
return Array.prototype.slice .call(o, start); //Array 기본 메서드를 사용하여 원자를 JS 배열로 변환
} catch(e) {
a = [];
l = o.length;
for (; 시작a.push(o[start]);
}
return a;
}
} else {
return [o] ;
}

}

YArray.test = function(o){
var r = 0;
if (o && (typeof o == 'object' | |typeof o == '함수')) {
if (Object.prototype.toString.call(o) === "[객체 배열]") {
r = 1;
} else {
시도해 보세요 {
if (('length' in o) && !o.tagName && !o.alert && !o.apply) {
r = 2;
}
} catch (e) {}
}
}
return r;
}

YArray.each = (Array.prototype.forEach) ? //먼저 브라우저가 지원되는지 확인하세요. , 사용 가능한 경우 기본
함수 (a, f, o) {
Array.prototype.forEach.call(a || [], f, o || Y);
return YArray;
} :
함수 (a, f, o) {
var l = (a && a.length) || 0, i;
for (i = 0; i f.call(o || Y, a[i], i, a);
}
return YArray;
};

YArray.hash = function(k, v) {
var o = {}, l = k.length, vl = v && v.length, i;
for (i=0; iif (k[i]) {
o[k[i]] = (vl && vl > i) ? v[i] : true;
}
}

return o;
};

YArray.indexOf = (Array.prototype.indexOf) ?
function(a, val) {
return Array. 프로토타입.indexOf.call(a, val);
} :
function(a, val) {
for (var i=0; iif (a[i] === val) {
return i;
}
}
return -1; //상황을 찾을 수 없음
};

YArray.numericSort = function(a, b) {
return (a - b); //작은 것부터 큰 것까지 정렬, return (b - a); 큰 것부터 작은 것
};

YArray.some = (Array.prototype.some) ?
함수 (a, f, o) {
return Array.prototype.some.call(a, f, o);
} :
함수 (a, f, o) {
var l = a.length, i;
for (i=0; iif ( f.call(o, a[i], i, a)) {
참을 반환;
}
}
거짓을 반환;
};

}) ();

Array 기본 메서드를 사용하여 Atom을 JS 배열로 변환하는 다른 메서드(Dom 개체는 허용되지 않고 순회만 가능)

Array.apply (null,인수);
[].slice.call(인수,0);
[].splice.call(arguments,0,arguments.length);
[].concat.apply( [],arguments);
...

YArray 함수는 배열 객체뿐만 아니라 nodeList 객체에서도 작동할 수 있습니다.
YArray(document.getElementsByTagName ( "div"));
dom 객체를 탐색하여 배열로 다시 조립합니다. )

a = [];
l = o.length ;
for (; starta.push(o[start]);
}
return a;

YArray .each
는 배열을 순회합니다. 함수가 전달되면 콜백

YArray.each([1,2,3],function(item ){
alert(item);// 3번 실행됨, 1,2,3
});

YArray.hash
배열 Assembling 키-값 쌍은 json 객체
YArray.hash(["a", "b"], [1,2])

YArray.indexOf
return(생각해 보세요)으로 이해될 수 있습니다. 동일한 값을 찾으려면) 값은 배열의 인덱스 값에 있습니다.

YArray.indexOf([1,2],1)
YArray.numericSort
배열을 작은 것부터 정렬합니다. Large
[3, 1, 2].sort(YArray.numericSort);
YArray.some
배열의 요소 중 콜백 처리를 통과한 요소가 있습니까? 있으면 즉시 true를 반환합니다. 없으면 false를 반환합니다

YArray.some([3, 1, 2], function(el) {
return el })

배열에 대한 javascript 1.6 -1.8 확장을 살펴보고 동일한 기능을 구현하는 방법을 알아봅시다
모든
필터
forEach
indexOf
lastIndexOf
map
some
reduce
reduceRight

Array.prototype.every

if (!Array.prototype.every)
{
Array.prototype.every = function(fun /*, thisp*/)
{
var len = this.length >>> 0;
if (typeof fun != "function")
throw new TypeError();
var thisp = 인수[1];
for ( var i = 0; i {
if (i in this &&
!fun.call(thisp, this[i], i, this))
false 반환 ;
}
true 반환;
};
}

배열의 모든 요소가 콜백으로 처리되었나요? 만약 그렇다면 true를 반환하고, 그렇지 않으면 즉시 false를 반환합니다
이것은 방금 언급한 일부 YUI 함수와 매우 유사합니다. :) 함수는 정반대입니다

배열 .prototype.filter

Array.prototype.filter = function (block /*, thisp */) { //필터, 추가하기 쉬움, 판단 및 필터링용
var 값 ​​= [] ;
var thisp = 인수[1];
for (var i = 0; i if (block.call(thisp, this[i]))
values.push(this[i]);
반환 값;
};

사용법

var val=number.filter(function(t){
return t })
alert(val);

forEach, indexOf 및 일부는 위의 yui 코드를 참조할 수 있으며 다시 반복되지 않습니다.
lastIndexOf와 indexOf는 비슷한 코드를 가지고 있지만 끝에서 순회됩니다. >

'맵'에 대해 이야기해보자

Array.prototype.map = function(fun /*, thisp*/) {

var len = this. length >>> 0;
if (typeof fun != "function")
throw new TypeError();
var res = new Array(len);
var thisp = 인수 [1];
for (var i = 0; i < ; len; i++) {
if (i in this)
res[i] = fun.call(thisp, this[i], i, this);
}
return res;
};

배열 순회, 함수 실행, 배열 반복, 각 요소는 다음과 같습니다. callBack 메소드를 실행하기 위한 매개변수로 사용되는 callBack 메소드는 각 요소를 처리한 후 최종적으로

varnumbers=[1,4,9];
varroots=number.map(function 이후의 배열 처리로 돌아갑니다. (a){return a * 2});

Array.prototype.reduce

Array.prototype.reduce = function(fun /*, 초기 */) {

var len = this.length >>> 0;
if (typeof fun != "function")
throw new TypeError();
if (len = = 0 && 인수.길이 == 1)
throw new TypeError();
var i = 0;
if (arguments.length >= 2) {
var rv = 인수[1 ];
} else {
do {
if (i in this ) {
rv = this[i++];
break;
}
if (++i >= len)
throw new TypeError();
} while (true );
}
for (; i if (i in this)
rv = fun.call(null, rv, this[i], i, this );
}
return rv;
};

배열 요소가 주어진 함수를 순차적으로 호출하고 최종적으로 값, 즉 주어진 함수를 반환하도록 합니다. 반환 값

Array.prototype.reduceRight

을 이름은 오른쪽에서 왼쪽으로

Array.prototype.reduceRight = function(fun /*,initial*/) {

var len = this.length > >> 0;
if (typeof fun != "function")
throw new TypeError()
if (len == 0 &&args.length == 1)
throw new TypeError();
var i = len - 1;
if (arguments.length >= 2) {
var rv = 인수[1];
} else {
do {
if (i in this) {
rv = this[i--];
break;
}
if (--i throw new TypeError( );
} while (true);
}
for (; i >= 0; i --) {
if (i in this)
rv = fun.call( null, rv, this[i], i, this);
}
return rv;
} ;

이 외에도 일반적으로 사용되는 toString

Array.prototype.toString = function () {

return과 같이 사용하려는 메서드를 Array.prototype

에 추가할 수 있습니다. this.join('');
};

알겠습니다. Json, uniq, Compact, reverse 등에 추가하세요.