자바스크립트 리스트에서 아이템 삭제 방법
자바스크립트 초보인덴요.
아래와 같이 리스트를 선언하고 아이템을 하나 삭제하면
var a = ["a","b","c","d"];
delete a[2];
a를 찍어보면 ["a","b","","d"] 로 남아있는데요.
이걸 ["a","b","d"] 로 만드려면 어떻게 해야할까요?
JavaScript에서는 리스트를 delete 로 지으면 원소만 지워지고 해당 공간은 빈 공간으로 남아있게 됩니다.
대신 splice 함수로 삭제가 가능합니다.
구문은 아래와 같습니다.
array.splice(start[, deleteCount[, item1[, item2[, ...]]]])
start (필수): 배열의 변경을 시작할 인덱스입니다. 삭제라고 하지 않고 변경이라고 적은 이유는 이 함수는 삭제도 가능하지만 매개변수에 따라 원소의 추가도 가능하기 때문입니다.
deleteCount (옵션) : 배열에서 제거할 요소의 갯수입니다. 만약 생략하면 start 부터의 모든 요소를 제거합니다. 0 이하를 주게 되면 어떤 요소도 제거하지 않습니다.
item1, item2, ... (옵션) : start 설명시에 이야기한 배열에 추가할 요소를 지정할 수 있습니다. 아무 것도 지정하지 않으면 원소를 제거하기만 합니다.
현재 index가 2인 원소 하나만 지울 것이므로 아래와 같이 수행하면 됩니다.
a.splice(2, 1);index 가 2에서 1개의 원소를 제거하게 됩니다.
안녕하세요
자바스크립트 리스트(배열)에서 아이템를 삭제하는 방법은 여러가지가 있지만
질문해주신 것을 토대로는 splice를 사용해야 합니다.
splice는 배열의 원하는 위치에서 원하는 개수 만큼 아이템을 삭제할 수 있습니다.
사용 방법은
Array.splice(idx, count) 로
Array에 배열의 변수명을 적어주시고,
idx에는 삭제하고 싶은 아이템의 위치
count에는 idx부터 삭제하고 싶은 아이템의 개수 입니다.
예를 들어, 코드로 설명하면...
var a = ["a", "b", "c", "d"] // a 배열 선언 a.splice(2, 1); // a 배열의 2번째 아이템부터 1개만 삭제 => ["a", "b", "d"] var b = ["1", "2", "3", "4"] // b 배열 선언 b.splice(1, 2); // b 배열의 1번째 아이템부터 2개 삭제 => ["1", "4"]참고로 사용하신 delete는 배열에서 아이템이 undefined로 되는 것이지
배열의 아이템 자체가 삭제되는 것이 아니기 때문에,
배열의 길이는 그대로 유지되는 것도 알아두시면 좋을 것 같습니다!
- var a = ["a","b","c","d"];a.splice(2,1); // 2번째 index부터 // 1개 removeconsole.log(a); // ["a", "b", "d"] 여러방법이 있습니다. javascript splice를 사용하던지 lodash 라이브러리로도 가능합니다. lodash var a = ["a","b","c","d"]; var result = _.remove(a, function(n) { return n === "c"; });
lodash는 설치도 편하고 많은 기능들을 편하게 사용할 수 있습니다.
splice 함수를 사용하면 됩니다.
위 예제의 a 배열에서 2번째 인덱스의 요소를 삭제하려면 다음과 같은 코드를 사용하면 됩니다.
a.splice(2, 1)
위 코드를 설명하자면, 시작 인덱스 2에서 1개의 요소를 지운다는 뜻입니다.
실행 결과는 다음과 같습니다.
console.log(a);
Array ["a", "b", "d"]
좀 더 자세한 내용은 다음 주소를 참고하세요.
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/splice
답변 채택 부탁드립니다. 감사합니다.
자바스크립트 리스트에서 아이템 삭제 방법을 문의 주셨네요
해당 delete는 삭제하여도 요소는 그대로 남아있습니다.
splice 함수는 원하는 위치에 하나 이상의 요소를 추가할 수 있으며 반대로 삭제도 할 수 있습니다.
//array.splice("시작위치", "제거건수")
var a = ["a","b","c","d"];
a.splice(2, 1) // index 2 부터 1개의 요소('c')를 제거
console.log(a);
배열 중간의 요소를 추가 하거나, 삭제할 경우 함수를 사용하는 것이 편리합니다.
안녕하세요
delete 는 json 객체의 key 값을 삭제하는데 사용합니다
array 는 splice로 삭제할 수 있습니다
var a = ["a","b","c","d"]; /* 첫번째 argument : 시작 Index 위치 두번째 argument : 삭제할 데이터 건수 세번째 argument : (Option) 배열에 추가할 요소 */ a.splice(2, 1); console.log(a); // 출력 ["a", "b", "d"]delete a[2]; 는 배열의 인덱스를 삭제하는게 아닌 해당 배열의 값을 삭제하여 ["a","b","","d"] 처럼 출력됩니다.
배열에서 원하는 배열의 인덱스를 삭제하는 방법은 여러가지가 있는데요
저는 splice() 함수를 주로 사용합니다.
splice() 메소드는 배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가할 수 있는데요
slice()와는 다르게 기존 배열을 변경하는 함수입니다.
splice(변경시작 데이터 인덱스, 삭제할 데이터 개수, [추가할 데이터 목록]) 과 같은 방식으로 사용됩니다.
말씀하신 예를 소스로 나타내면 다음과 같습니다.
<실행소스>
const arr = ["a", "b", "c", "d"]; // 1) 삭제할 "c"의 인덱스 2, 추가 // 2) 시작 인덱스부터 삭제할 데이터 1개이므로 삭제 개수 1추가 // 3) 추가할 데이터 없기때문에 배열목록 없음 arr.splice(2, 1); // 기존 데이터가 변경되기때문에 arr가 수정됨 console.log(arr)<결과>
[ 'a', 'b', 'd' ] 실행시간: 60.34ms1. splice 함수 이용(https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/splice)
const a = ["a","b","c","d"]; a.splice(2, 1);이 방법은 원본 배열 a를 수정하게 돼요.
2. slice 함수 이용(https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/slice)
const a = ["a","b","c","d"]; const b = [...a.slice(0, 2), ...a.slice(3)];이 방법은 원본 배열을 수정하지 않고 새로운 배열 b를 만들어요.
저는 immutable(https://poiemaweb.com/js-immutability)하게 구현하는 걸 선호해서 특정 배열의 특정 인덱스를 제거할 때 2번 방법을 사용할 거 같아요.
- var a = ["a","b","c","d"];a.splice(2,1);
// 결과 캡처
Array.prototype.splice()
splice() 메서드는 배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가하여 배열의 내용을 변경합니다.
array.splice(start[, deleteCount[, item1[, item2[, ...]]]])매개변수start배열의 변경을 시작할 인덱스입니다.
배열의 길이보다 큰 값이라면 실제 시작 인덱스는 배열의 길이로 설정됩니다.
음수인 경우 배열의 끝에서부터 요소를 세어나갑니다(원점 -1, 즉 -n이면 요소 끝의 n번째 요소를 가리키며 array.length - n번째 인덱스와 같음).
값의 절대값이 배열의 길이 보다 큰 경우 0으로 설정됩니다.
deleteCount Optional배열에서 제거할 요소의 수입니다.
deleteCount를 생략하거나 값이 array.length - start보다 크면 start부터의 모든 요소를 제거합니다.
deleteCount가 0 이하라면 어떤 요소도 제거하지 않습니다.
이 때는 최소한 하나의 새로운 요소를 지정해야 합니다.
item1, item2, ... Optional배열에 추가할 요소입니다.
아무 요소도 지정하지 않으면 splice()는 요소를 제거하기만 합니다.
반환 값제거한 요소를 담은 배열. 하나의 요소만 제거한 경우 길이가 1인 배열을 반환합니다.
아무 값도 제거하지 않았으면 빈 배열을 반환합니다.
- 출처
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/splice
안녕하세요 4년차 자바 웹개발자입니다.
자바스크립트에서 리스트 요소를 제거하는 방법에대해 질문을 주셨는데요
질문자님께서 사용 하신 delete로 배열을 삭제할 경우 요소는 그대로 존재하며 값만 삭제 되어 질문 해주셨던거 처럼 요소는 존재하게 됩니다.
해당 요소까지 제거 하시려면 array.splice("시작위치", "제거건수") 를 사용하시면 원하는 위치에서 부터 하나 이상의 요소를 제거 할 수 있습니다.
또한 array.splice("시작위치", "제거건수", ["요소1", "요소2" ... ]) 요소를 제거 후 해당 위치에 새로운 요소를 추가할 수 있습니다.
감사합니다.
Array.prototypes.splice() 메서드를 사용하시면 됩니다.
관련 링크 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/splice
var a = ["a","b","c","d"]; a.splice(2,1) // 인덱스 2부터 1개 삭제 console.log(a) // ["a","b","d"];
