javascript Array array object_javascript 기술의 확장 기능 코드-JS 튜토리얼-php.cn

javascript Array array object_javascript 기술의 확장 기능 코드

WBOY

풀어 주다： 2016-05-16 18:26:30

원래의

1101명이 탐색했습니다.

오늘은 Array 객체

를 확장하는 방법에 중점을 둘 것입니다. 1. Array.prototype에서

을 직접 확장합니다. 2. 자신만의 메서드를 사용하여 Array.prototype에서

을 직접 확장합니다. 프로토타입에서 확장된 배열은 DOM 객체(예: document.getElementsByTagName('div')에서 얻은 nodeList)에서 직접 사용할 수 없습니다.

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

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

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

 
(function(){ 
var YArray; 

YArray = function(o,idx,arraylike){ 
var t = (arraylike) ? 2: YArray.test(o), 
l, a, start = idx || 0 
if (t) { 
return Array .prototype.slice.call(o, start); //Array 네이티브 메소드를 사용하여 Atom을 JS 배열로 변환합니다. 
} catch(e) { 
a = 
l = o.length; 
for (; starta.push(o[start]) 
} 
return a 
} 
} else { 
return [o]; 

} 

YArray.test = function(o){ 
var r = 0 
if (o && (typeof o == '객체' |typeof o == '함수')) { 
if (Object.prototype.toString.call(o) === "[객체 배열]") { 
r = 1; >} else { 
try { 
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 =i 1) { 
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; i< l; i=i 1) { 
if (k[i]) { 
o[k[i]] = (vl && vl > i) ? v[i] : true; 
} 

return o; 
}; 

YArray.indexOf = (Array.prototype.indexOf) 
function(a, val) { 
return Array.prototype.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) ? 
function (a, f, o) { 
return Array.prototype.some.call(a, f, o); 🎜>} : 
함수 (a, f, o) { 
var l = a.length, i 
for (i=0; i if (f.call(o, a[i], i, a)) { 
return 
} 
} 
return 
}; })() ; 


 

객체를 JS 배열로 변환하려면 Array 기본 메서드를 사용하세요(Dom 객체는 탐색할 수 없으며 탐색만 가능) 




코드 복사


 코드는 다음과 같습니다.

 
Array.apply(null,arguments) 

[].slice.call(arguments ,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 
배열은 키-값 쌍으로 구성되며 json 객체로 이해될 수 있습니다. 
YArray.hash( ["a","b"],[1,2]); 

YArray.indexOf
(찾고 싶은 값) 배열의 동일한 인덱스 값을 반환합니다.

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

코드복사

코드는 다음과 같습니다 :

 
YArray.some([3, 1, 2],function(el){ 
el < 4; 
}을 반환 

Let 배열에 대한 JavaScript 1.6 -1.8 확장을 살펴보고 동일한 기능을
모든
필터
forEach
indexOf
lastIndexOf
map
일부
구현하는 방법을 알아봅니다. 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() 
for (var i = 0; i < len i ) 
{ 
if (i && 
!fun.call(thisp, this[i], i, this)) 
 false를 반환합니다. 🎜>} 
return true; 
}; 
} 

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

배열 .prototype.filter

코드 복사 코드는 다음과 같습니다. Array.prototype.filter = function (block /*, thisp */) { //필터, 추가하기 쉬움, 판단 필터링

var 값 = []

var thisp = 인수[1] 
for ( var i = 0; i < this.length; i ) 
if (block.call(thisp, this[i])) 
values.push(this[i]); 
}; 

 
사용법

코드 복사

코드는 다음과 같습니다. var val=number.filter(function(t){ return t < 5 ;

})

alert(val) 

 
forEach 그리고 indexOf와 일부는 위의 yui 코드를 참조할 수 있습니다. 다시 말씀드리자면 
lastIndexOf와 indexOf 코드는 비슷합니다. 끝에서 트래버스하세요. 

이제 'map'에 대해 이야기해 보겠습니다.

코드 복사

코드는 다음과 같습니다. 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 / *,initial*/) { var len = this.length >>> (typeof fun != "function") throw new TypeError();

if (len == 0 && 인수.length == 1)

throw new TypeError(); 0; 
if (arguments.length >= 2) { 
var rv = 인수[1] 
} else { 
do { 
if (i 있음) { 
rv = this[i ]; 
break; 
} 
if ( i >= len) 
throw new TypeError(); 
for (; i < len; i ) { 
if (i in this ) 
rv = fun.call(null, rv, this[i], i, this) 
} 
return rv; 
}; 

 
Let array 요소는 주어진 함수를 순차적으로 호출하고 최종적으로 값을 반환합니다. 🎜>
Array.prototype.reduceRight 
 이름에서 알 수 있듯이 오른쪽에서 왼쪽으로 




코드 복사

코드 다음과 같습니다.

 
Array.prototype.reduceRight = function(fun /*, 초기*/) { 
var len = this.length >>> 
if (typeof fun != " function") 
throw new TypeError(); 
if (len == 0 && 인수.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() 
} 
for (; i >= 0; i--) { 
if (i in this) 
rv = fun.call(null, rv, this[i], i, this); >} 
return rv; 
}; 

 
이 외에도 사용하려는 메서드를 Array.prototype에 추가할 수 있습니다. 

예를 들어 일반적으로 사용되는 toString

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

Array.prototype.toString = function() {

return this .join(''); 
}; 

 
Json, uniq, Compact, reverse 등에 추가할 수도 있습니다. 

배열 확장은 여전히 매우 유용합니다. 개발을 위해: )