4. 배열 요소 삭제 및 동시추가( .splice(시작인덱스 [, 삭제할 개수 ,추가할 값 ] ) )
말그대로 삭제와 동시에 추가가 되어서 원본에 변형이 일어납니다.
4-1 시작인덱스만 씀 (시작 인덱스부터 끝까지 추출해서 내뺌)
//console.log(method);//Array(5) [ 100, 200, 300, 400, 500 ] 현재상황
method_= method.splice(2);
console.log('원본배열:',method);
console.log('생성된배열:',method_);
4-2 시작인덱스와 삭제 할 개수 설정(시작인덱스 부터 몇 개 삭제?)
//console.log(method);//Array(5) [ 100, 200, 300, 400, 500 ] 현재상황
method_= method.splice(2,2); //2번 인덱스부터 2개 요소까지 삭제
console.log('원본배열:',method);
console.log('생성된배열:',method_);
4-3 시작인덱스 삭제 할 개수 + 추가까지!!
추가는 시작인덱스에서 부터 추가된당!
//console.log(method);//Array(5) [ 100, 200, 300, 400, 500 ] 현재상황
method_= method.splice(2,2,'삼백','사백','오백');
console.log('원본배열:',method);
console.log('생성된배열:',method_);
4-4 삭제없이 추가만하기!
역시 시작인덱스부터 추가가 된당
//console.log(method);//Array(5) [ 100, 200, 300, 400, 500 ] 현재상황
method_= method.splice(2,0,'오백'); // 삭제없이 추가만 되는데 지정한 위치에 추가가 되네!!
console.log('원본배열:',method);
console.log('생성된배열:',method_);
5.배열요소 찾기
console.log(method); // 현재상황 Array(6) [ 100, 200, "오백", "삼백", "오백", 500 ]
console.log('5.요소찾기')
console.log('오백의 인덱스번호(왼쪽):',method.indexOf('오백'));
console.log('오백의 인덱스번호(오른쪽):',method.lastIndexOf ('오백'));
console.log(method.indexOf('뷁'));
[ map 함수 ]
배열 내의 모든 요소 각각에 대하여 인자로 전달 된 콜백 함수를 적용하여 새로운 배열을 반환
배열의 모든 요소를 변경하는 함수 !!!
==> arr.map(callback(currentValue[,index[,array]]))[,thisArg]; 콜백함수는 내가 호출하는게 아녀,, 값의 수에 따라 알아서 호출 되는 겨 직접 보면 알껴
6. 배열의 요소 변경
var arr=[1,2,3,4,5];
var arr_ = arr.map(function(item,index) {
console.log('인덱스값 확인:',index);
return item*2; // arr의 요소들이 하나씩 item 으로 들어가서 연산 후 반환됨
});
console.log('원본배열:',arr);
console.log('새 배열:',arr_);
[ reduce 함수 ]
7.배열의 요소들 하나로 만들기
데이터의 차원을 줄이거나 결과값을 줄여주는 함수! 변환 값을 하나로!! ( 거의 누적함수네??)
==>arr.reduce(callback [,initialValue])
console.log('7.배열의 요소수를 하나로 만들기');
console.log('reduce 후 :',arr.reduce(function(pre,curr){return pre+curr}));
// 초기의 pre값은 0 요소들이 curr으로 차례로 들어가면 기존 요소는 pre로 빠지고
console.log('원본:',arr); // 원본값은 변하지 않는군
[ join ( [구분자]) ] : 구분자로 연결하기
8. 배열의 모든요소를 하나의 "문자열로" 만들기(줄이는 게 아님)
console.log('8.배열의 모든 요소를 하나의 "문자열"로 만들기');
console.log(arr.join()); // 구분자 없으면 그냥 통 째로 문자열이 됨
console.log('타입:',typeof arr.join())
console.log(arr.join('★'));
9.거꾸로 재배치(원본 변경O)
console.log('9.배열의 모든 요소를 거꾸로 재배치 하기');
console.log(arr.reverse());
console.log(arr);
10.배열 정렬하기 !!
sort([콜백함수]) - 배열 안의 요소들을 정렬하여 반환 (원본 변경o)
숫자일땐: - , 문자일땐: localeCompare
function(인자1,인자2) {return 인자1-인자2}; 오름차순
function(인자1,인자2) {return 인자2-인자1}; 내림차순
숫자먼저 적용해보자
console.log('10.배열 정렬하기');
var newArr = [5,7,3,0,1,2,6];
newArr.sort(); // 오름차순
console.log(newArr);
newArr.sort(function(x,y){return y-x;}); //내림차순
console.log(newArr);
문자열도 적용해보쟈
newArr=['가','소','구','차','퍼','허','삭'];
newArr.sort(); //오름차순
console.log(newArr);
//newArr.sort(function(x,y){return y-x;});이거 안됨
newArr.sort(function(x,y){return y.localeCompare(x);}); //compareTo는 없고 비슷한기능을 하는 이걸 쓰세염
console.log(newArr);
11 .배열의 여러 요소 한꺼번에 추가하기 .concat () (원본변경 X)
newArr.splice(0,newArr.length,5,8,4,9,2,7,1); // 새로 셋팅
console.log('newarr:',newArr);
newArr_ = newArr.concat(19,6,3,10); // 추가하고
console.log('newarr_',newArr_.sort(function(x,y){return x-y})); // 정렬까지
12.순회하며 배열 요소 출력하기
배열명.forEach()함수
이거 for문이랑 비슷하넴넴넴
console.log(newArr);
newArr.forEach(function(item /*,index*/){ // 인덱스 생략 가능!
console.log(item /*,index*/);
});
newArr.forEach(function(item ,index){
console.log('요소:%s,인덱스:%s',item,index);
});
'학원 > JS' 카테고리의 다른 글
10/31 32-9 [JS] switch문 (1) | 2022.10.31 |
---|---|
10/31 32-8 [JS] IF문 (0) | 2022.10.31 |
10/28 31-4 [JS] Array 주요 메소드 정리 (1) | 2022.10.29 |
10/28 31-3 [JS] Array (for~ in문) (0) | 2022.10.28 |
10/27 30-6 [JS] Array (1) | 2022.10.27 |