TIL24 .Slice( )와 친구들

slice()함수와 slice와 헷갈리는 함수에 대해서 알아보자.

slice함수 사용해서 원하는 주소 자르기

주어진 주소가 어느 도시인지를 찾아내서, 해당 주소에서 도시 부분만 삭제한 새로운 주소를 리턴해보자.("도"와 "시"는 주소에 한번 밖에 포함되어 있지 않는다.)

function sliceCityFromAddress(address) {
  
  let findSi = address.indexOf("시");
  let findDo = address.indexOf("도");
  if (findSi !== -1 && findDo !== -1) {
    address = address.slice(0, findDo+2) + address.slice(findSi+2, address.length);
  }else if (findSi !== -1 && findDo === -1) {
    address = address.slice(findSi+2, address.length);
  }
  return address
}
sliceCityFromAddress("경기도 성남시 분당구 중앙공원로 53");
//expected output "경기도 분당구 중앙공원로 53"

목표

'시'와 '도'가 들어간 부분을 찾고, 기준으로 삼아 새로 넣을 부분을 slice를 이용해서 담아준다.

코드 진행과정

1.‘시’ 와 ‘도’ string을 indexOf를 통해 찾고, 변수로 할당해준다.
2.시 부분 앞 2글자를 포함시킨다.
3. 만약 둘 다 있다면, address를 시작문자부터 '도'까지 + '-시'가 끝나는 부분부터 문자열길이만큼까지로 지정해준다.
4.'시'만 있고, '도'는 없는 경우도 지정해준다.

❓❗️

• let findSi = address.indexOf("시")만 찾으면 안되는 이유:
  ex)'서울특별시 중구 을지로1가'와 같이 '시'만 있는 케이스가 있기 때문에 오류가 발생했었다.

slice와 splice 비교

둘다 배열을 다룰 때 자주 사용하는 함수이다. 스펠링도 비슷하고, 언뜻 보기에는 비슷한 기능을 하는 것처럼 보이지만 차이점이 존재한다.

slice(start[,end])

slice() 메소드는 시작점부터 끝점 전까지의 복사본을 새로운 배열 객체로 반환하여, 원본 배열은 수정되지 않는다.
end: optional. end를 제외하고 그 전까지의 요소만 추출한다. 지정하지 않을 경우 배열의 끝까지 slice가 진행되고, 음수의 경우 배열의 끝에서부터 길이를 나타낸다.

const number = [1, 2, 3, 4, 5];
const num1 = number.slice(1,3) // [2, 3] 
const num2 = number.slice(-2); // [4, 5]

splice(start[, deleteCount[, item1[, item2[, ...]]]])

splice() 메소드는 배열의 기존 요소를 삭제, 교체, 추가하여 배열의 내용을 변경한다. 이 메소드는 원본 배열 자체를 수정한다.
start: 배열의 변경을 시작할 인덱스.
delateCount: 배열에서 제거할 요소의 수. 0이하의 수를 지정하면 어떤 요소도 제거되지 않는다.
item1,...: optional. 배열에 추가할 요소.

const number = [1, 2, 3, 4, 5];
const num1 = number.splice(1); // [2, 3, 4, 5]
number // [1]

const arr = [1, 2, 3, 4, 5];
const add = arr.splice(1, 1, 'add'); 
arr //[1,'add', 3, 4, 5]
add // [2]

*split

string.split(separator, limit)

문자열에서 배열을 만들어주는 메소드이다.
seperator: Optional.배열 요소들을 구분해주는 구분자. 생략하게되면, 문자열 전체가 리턴되어 배열에는 한가지 요소만 있는 셈이다.
limit: Optional. 배열의 전달받고 싶은 요소의 갯수를 정한다.

const alphabet = 'a, b, c, d';
const res = alphabet.split(',');	// ["a", "b", "c", "d"]

res = alphabet.split(',', 2);	//["a", "b"]