배열 메소드2

이용원·2022년 11월 3일
0

JAVASCRIPT

목록 보기
3/34

배열 메소드2

slice

slice메소드는 배열의 일부를 복사해준다.
얕은 복사를 한다.
원본값은 바꾸지 않고 새로운 배열로 가져온다.
end값을 정해주지 않으면 마지막 인덱스까지 복사

//시작점을 정해주지 않으면 0번째 인덱스부터 복사한다.
slice(startIndex, startIndex부터 입력한 인덱스를 제외한 인덱스까지);
1, 4라고 하면 1번 인덱스부터 sliceArray[1], sliceArray[2],sliceArray[3]까지 복사

let sliceArray = ['red', 'blue', 'black','pink'];

//0번째 인덱스(sliceArray[0]부터 3개를 복사
console.log(sliceArray.slice(0,3)); // [ 'red', 'blue', 'black' ];

//원본값에 영향을 주지 않고 새로운 배열생성
console.log(sliceArray); // [ 'red', 'blue', 'black', 'pink' ]; 원본array

//복사해 올 아이템의 갯수가 넘으면 배열 끝까지만 복사해온다.
let slicedNewArray = sliceArray.slice(1, 5);
console.log(slicedNewArray); // [ 'blue', 'black', 'pink' ];


//원본을 완벽하게 복사하는 방법
let slicedNewArray2 =sliceArray.slice();
let slicedNewArray3 =sliceArray.slice(0, sliceArray.length);

console.log(slicedNewArray2); // [ 'red', 'blue', 'black', 'pink' ]
console.log(slicedNewArray3); // [ 'red', 'blue', 'black', 'pink' ]


//인덱스를 음수로 쓰면 배열의 끝부터 복사해서 가지고 옴
console.log(sliceArray.slice(-1)); // [ 'pink' ];
console.log(sliceArray.slice(-2)); // [ 'black', 'pink' ]
console.log(sliceArray.slice(-3)); // [ 'blue', 'black', 'pink' ]

splice

원본값을 바꾼다.
배열의 값을 제거, 추가할 수 있다


let spliceArray = ["1th", "2nd", "3th", "4th", "5th", "6th", "7th"];

// spliceArray.splice(시작할 인덱스 숫자, 삭제할 데이터 갯수, 추가할 데이터 )

// param 1: 추가할 때는 0번째 인덱스에 // 삭제할 때는 0번째 인덱스에서부터
// parm 2: 삭제할 데이터의 갯수는 0개 
//parm 3: 추가할 데이터는 '8th'
spliceArray.splice(0, 0, "8th");

console.log(spliceArray); // ["8th", "1th", "2nd", "3th", "4th", "5th", "6th", "7th"]; //0번째 인덱스에 데이터 삭제 없이 '8th'값 추가됨

								
console.log(spliceArray); // ["8th", "1th", "2nd", "3th", "4th", "5th", "6th", 
"7th"]//원본 데이터				 0      1      2      3      4      5      6
  7
  
//데이터를 제거하는 방법
//0번째 인덱스에서부터 데이터 1개를 지운다
spliceArray.splice(0, 1);
console.log(spliceArray); ["1th", "2nd", "3th", "4th", "5th", "6th", "7th"];

//1번 인덱스부터 데이터 3개를 지운다.
spliceArray.splice(1, 3);
console.log(spliceArray); // [ '8th', '4th', '5th', '6th', '7th' ]

//spliceArray.splice(1, 3)의 return 값은 삭제된 데이터를 리턴한다.
console.log(spliceArray.splice(1,3); // [ '1th', '2nd', '3th' ];


//데이터를 제거하고 추가하는 방법
spliceArray = ["1th", "2nd", "3th", "4th", "5th", "6th", "7th"];

//인덱스 1번부터 ('2nd') 데이터 2개를 ('2nd', '3nd')를 삭제하고
입력받은 시작 인덱스에 값을 추가함
spliceArray.splice(1,2,'Delete : 2와 3을 삭제했다!');
console.log(spliceArray);


sort

배열을 정렬함
원본 배열 자체를 정렬함

기본정렬
숫자 작은 수부터 큰 수

문자 알파벳 순서

문자와 숫자가 같이 있다면 또는 배열 안에 또 배열이 있다면?


let soredArray = [1,2,3,6,4,5];
console.log(soredArray.sort()); //[ 1, 2, 3, 4, 5, 6 ]
console.log(soredArray); //[ 1, 2, 3, 4, 5, 6 ]

그럼 soredArray4를 sort하면 어떻게 될까??


let soredArray4 =[1, 5, 80, 100, 90, 101, -12, 2500, 340, 35];
console.log(soredArray4.sort()); // [-12, 1, 100, 101, 2500, 340, 35, 5, 80, 90];

예상과는 다르게 1다음 100이 오고  101다음 2500이 오고 2500 다음에 5가 오는 걸 볼 수 있다.
그 이유는 인수없이 sort()를 하게 되면 배열 안에 데이터를 stirng으로 변환하고
숫자인 경우에 첫번째 자리 숫자만 계산하기 때문이다.
34035를 비교할 때 첫번째 숫자는 3으로 동일하고 뒤에 글자는 4보다 5가 크기 때문에
정렬할 때 340 다음으로 35가 오는 걸 볼 수 있다.

이것을 해결하기 위해서는 sort()에 인수를 넣어주는 법이다.

//오름차순을 하는 방법
console.log(soredArray4.sort(function(a,b){
    return a-b;
})); // [-12, 1, 5, 35, 80, 90, 100, 101, 340, 2500];

//내림차순을 하는 방법
console.log(soredArray4.sort(function(a,b){
    return b-a;
})); // [2500, 340, 101, 100, 90, 80, 35, 5, 1, -12];

0개의 댓글

관련 채용 정보