JS 배열 지정 값 삭제 상용 방법 상세 설명
먼저 위험한 방식 을 본다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
window.onload = function() {
var arr = [1, 1, 2, 2, 3, 3, 4, 4, 5, 5];
console.log(` :${arr}`);
arr.forEach((item, i) => {
if (item == 3) {
arr.splice(i, 1); // i , 1
}
})
console.log(` :${arr}`);
}
</script>
</body>
</html>
출력 결과 에 서 는 3 만 삭 제 했 습 니 다.이것 은 splice 방법 으로 배열 의 지정 값 을 삭제 한 후에 배열 이 바 뀌 었 기 때 문 입 니 다.다음 값 은 앞으로 한 위 치 를 옮 겼 습 니 다.다음 순환 에서 뒤의 3 의 하 표 는 원래 의 5 에서 4 로 바 뀌 었 습 니 다.이 로 인해 삭제 작업 을 한 다음 에 5 로 표 시 된 값 을 찾 을 때 뒤의 값 3 을 찾 을 수 없습니다.그리고 값 이 4 인 요 소 를 이어서 옮 겨 다 니 며 삭제 할 값 이 1 개가 아 닐 때 이런 옮 겨 다 니 며 삭제 하 는 것 은 위험한 방식 이다.
1.splice 방법 으로 반복 해서 옮 겨 다 니 는 방식 으로 지정 한 값 을 삭제 하면 보험 의 방식 은 역방향 으로 옮 겨 다 니 는 것 입 니 다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
window.onload = function() {
var arr = [1, 1, 2, 2, 3, 3, 4, 4, 5, 5];
console.log(` :${arr}`);
for (let i = arr.length - 1; i > -1; i--) {
if (arr[i] == 3) {
arr.splice(i, 1);
}
}
console.log(` :${arr}`);
}
</script>
</body>
</html>
2.filter 방법 으로 지정 한 값 을 걸 러 내기:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
window.onload = function() {
var arr = [1, 1, 2, 2, 3, 3, 4, 4, 5, 5];
arr = arr.filter(item => item != 3); // 3,
console.log(`filter :${arr}`);
}
</script>
</body>
</html>
메모:filter 방법 은 원래 배열 을 바 꾸 지 않 고 새 배열 로 돌아 갑 니 다.
2.지정 한 값 삭제
삭제 할 값 이 하나 밖 에 없 는 것 이 확실 하 다 면,검색 삭제 외 에 도 some 방법 을 사용 할 수 있 습 니 다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
window.onload = function() {
var arr = [1, 2, 3, 4, 5];
arr.some((item, i) => {
if (item == 2) {
arr.splice(i, 1);
return true
}
})
console.log(` :${arr}`);
}
</script>
</body>
</html>
메모:some 방법 은 조건 에 맞 는 값 을 찾 아 수 동 으로 true 로 돌아 간 후 다시 옮 겨 다 니 지 않 습 니 다(some 를 foreach 로 바 꾸 면 return 은 작 동 하지 않 습 니 다).
그 밖 에 findIndex 방법 도 사용 할 수 있 습 니 다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
window.onload = function() {
var arr = [1, 2, 3, 4, 5];
console.log(` :${arr}`);
var a = arr.findIndex(item => item == 3);
arr.splice(a, 1);
console.log(` :${arr}`);
}
</script>
</body>
</html>
메모:findIndex 는 첫 번 째 조건 에 맞 는 아래 표 만 찾 고 찾 지 못 하면 되 돌아 갑 니 다-1;
자세 한 내용 은 MDN 에서 배열 에 대한 소 개 를 보십시오.
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array
이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
JS 판단 수조 네 가지 실현 방법 상세그러면 본고는 주로 몇 가지 판단 방식과 방식 판단의 원리를 바탕으로 문제가 있는지 토론하고자 한다. 예를 들어 html에 여러 개의 iframe 대상이 있으면 instanceof의 검증 결과가 기대에 부합되지 않을...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
