> 웹 프론트엔드 > JS 튜토리얼 > javascript 프레임워크 디자인_javascript 기술에서 읽기 노트 배열의 확장 및 복구

javascript 프레임워크 디자인_javascript 기술에서 읽기 노트 배열의 확장 및 복구

WBOY
풀어 주다: 2016-05-16 16:29:37
원래의
1229명이 탐색했습니다.

1.indexOf 및 lastIndexOf 메소드:

배열 객체에서 indexOf를 사용할 때 IE7에서는 오류를 보고하므로 호환성을 위해 다시 작성해야 합니다.

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

Array.prototype.lastIndexOf(항목,색인){
var n = this.length,i = (index==null||index>n-1)?n-1:index;
​if(i ​for(;i>=0;i--)
​​if(this[i] === item) //합동 판단, indexOf, lastIndexOf
   return i;
반환 -1;
}

2.shuffle 방법: 배열을 섞습니다.

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

함수 shuffle(대상){
var i = target.length, j ,temp;
for(;i>0;j=parseInt(Math.random() * i), x = target[--i],target[i] = target[j],target[j]=x){} 
//길이를 10으로 가정하고 Math.random()*10->[0,10), parsInt, [0,9] 다음에 배열의 마지막 항목과 교환할 항목을 무작위로 선택합니다. 두 번째 루프에서는 [0,8]이 배열의 두 번째 항목으로 교체됩니다.
복귀대상;
}

3. 배열 평면화: 평면화, 1차원 배열 반환

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

함수 flatten(arr){
var 결과 = [];
arr.forEach(함수(항목){
  if(Array.isArray(item)) result.concat(Flatten(item));
   else  result.push(item);
});
결과 반환;
}

4.독특한 방법: 어레이에 대한 중복 제거 작업

면접관들은 이 방법에 대해 가장 많이 묻고 싶어합니다. 구현 방법이 많고 가장 일반적인 방법은 두 개의 for 루프입니다. 가장 일반적으로 알려진 것은 객체 a를 사용한 다음 for 루프 배열 arr을 사용하는 것입니다. if (a[arr[i]])가 존재할 때마다, 존재하지 않으면 새로 정의된 배열 결과로 푸시됩니다. . 존재는 증명되고 반복되기 때문에 굳이 결과까지 밀어붙일 필요는 없다. 이 체계에서는 "123"과 123이 동일한 것으로 간주됩니다. 실제로 하나는 문자열이고 다른 하나는 숫자이므로 동일한 것으로 간주되어서는 안 됩니다.

따라서 다음 메소드가 나타납니다: [1,"1","1"]

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

if ((typeof obj[array[i]]) != (typeof array[i]) || obj[array[i]] != array[i]) {
a.push(배열[i]);
obj[배열[i]] = 배열[i];
}

//먼저 유형이 동일한지 확인하고, 값이 동일한지 확인하고, 동일하면 해당 값이 이미 존재한다는 것을 증명합니다. 전에.

유형이 동일하지 않은 경우에는 두 가지 상황이 있습니다.

첫 번째 경우, obj는 이전에 이미 이 데이터를 저장했습니다. 예: obj[123] = 123, 현재 array[i] = "123", 현재 typeof obj[array[i]])는 숫자이고 typeof array[i]는 문자열이므로 배열에 저장됩니다.

두 번째 경우는 obj가 이 데이터를 저장하지 않은 경우입니다. 예: array[i] = "123", obj["123"] = undefind, typeof obj[array[i]]) is typeof undefine = 정의되지 않았으며 배열[i] 유형과 같지 않으며 배열에 저장됩니다.

이 방법은 문자열과 숫자가 동일한 경우는 해결할 수 있지만, 객체가 동일한 경우는 해결할 수 없습니다. 예: a = {1:2}, b ={2:1};

처음 루프를 통과하면 typeof obj[a] = 정의되지 않음, typeof a = Object. obj[a] = a를 저장합니다. 실제로는 obj[Object] = a;

입니다.

두 번째 루프에서 typeof obj[b]는 typeof obj[Object]와 동일하며 실제로는 typeof a = object, typeof b = object입니다. 따라서 obj[array[i]] != array[가 됩니다. i]|, 즉 obj[b]->obj[Object]->a입니다! =b 그러니까 입금하세요

obj[b] = b; 즉, obj[Object] = b; 이전 obj[Object] = a;

이 경우 모든 개체에는 마지막 개체 값만 ​​저장됩니다.

물체에 대해 생각할 때 저는 다음과 같은 접근 방식을 사용합니다.

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

for(var i = 0; i for(var j = i 1; j If(온도[i] === 온도[j]){
temp.splice(j, 1);
j--;
|                 }
}
반납온도;

5. 배열 정렬: 정렬 방법, 객체를 정렬하려면 직접 비교(a,b){if(a.age>b.age) return 1;else return -1;}을 작성할 수 있습니다. .sort(비교).

6.min은 배열의 최소값을 반환합니다. return Math.min.apply(0,array);

7.unshift는 ie6 및 7에서 배열 길이를 반환하지 않습니다.

코드 복사 코드는 다음과 같습니다.
if([].unshift(1)!==1) //빈 배열에 앞부분의 항목을 추가합니다. 다른 브라우저는 1을 반환하지만 IE6 및 7은 배열 길이를 반환하지 않습니다. 그런 다음 if 문을 실행하세요
{
var _unshift = Array.prototype.unshift; //함수 하이재킹.
​Array.prototype.unshift = function(){
​​_unshift.apply(this,arguments);
이 길이를 반환하세요;
}
}

8. splice가 하나의 매개변수를 취하는 경우 IE8 이하 버전에서는 두 번째 매개변수를 기본적으로 0으로 설정하는 반면, 다른 브라우저는 배열 길이를 사용합니다.

코드 복사 코드는 다음과 같습니다.
if([1,2,3].splice(1).length == 0) //IE8 이하 버전은 0, 기타 버전은 3, if
입력 {
var _splice = Array.prototype.splice;
​Array.prototype.splice = 함수(a){
  if(arguments.length == 1) //매개변수가 하나만 있는 경우
  {
_splice.call(this,a,this.length)를 반환합니다.
  }그밖에{
_splice.apply(this,arguments)를 반환합니다.
  }
}
}

이 메서드는 배열의 옵션을 변경하므로 배열의 push, pop, Shift 및 unshift(이러한 메서드는 배열의 옵션도 수정함)가 모두 이 메서드를 호출하여 이를 구현합니다.

여기서 주의할 점이 있습니다:

코드 복사 코드는 다음과 같습니다.
var color = new Array('red','blue','yellow','black');
var color2 = color.splice(2,0,'brown','pink');
Alert(color); // 빨간색, 파란색, 갈색, 분홍색, 노란색, 검은색, 노란색 옵션에 대한 작업을 시작합니다. 삭제가 0이면 추가된 옵션이 노란색 앞에 삽입됩니다. 기억하다.


여기에서는 스플라이스와 슬라이스의 차이점, 반환 값, 원본 배열에 미치는 영향을 살펴보시기 바랍니다.
위 내용은 이 섹션의 내용을 요약한 것입니다. 비록 간결하지만 핵심 내용은 이 섹션을 읽는 모든 사람에게 도움이 되기를 바랍니다.

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿