JavaScript | substr(), substring() 에 대하여 ( + slice(), splice() )

앙두·2023년 6월 29일
0

JavaScript

목록 보기
20/21

substr(), substring()

substr(), substring()문자열 메서드

❗️주의❗️
substr()MDN 공식문서 🔗 에 나와있기를,
해당 메서드가 "하나 이상의 바람직하지 않은 특징을 갖고 있으며, 사용처가 없어질 경우 명세에서 제거될 것"이라고 한다. 그러니 사용을 지양하도록 하자! 👇🏻


✂️ String.prototype.substr()

substr()메서드는,
문자열에서 시작 인덱스에서 시작하여 정한 길이(optional)만큼문자들을 반환합니다.

substr(startIndex[, length])
substr(시작인덱스[, 자르고 싶은 길이])

const str = 'orange'

// 시작인덱스 '2' 부터 3개의 길이를 잘라 문자열을 반환합니다.
str.substr(2, 3) // 'ang'

// 시작인덱스 '5' 부터 끝까지 반환합니다.
str.substr(5) // 'e'

🚨 사용을 지양해주세요! 🚨

✂️ String.prototype.substring()

substring()메서드는
시작 인덱스로 부터 종료 인덱스(optional) 전 까지 문자열의 부분 문자열을 반환합니다.

substr(startIndex[, endIndex])
substr(시작인덱스[, 종료인덱스])

const str = 'orange'

// 시작인덱스 '0' 부터 종료인덱스 '3' 전까지의 문자열만 반환합니다.
str.substring(0, 3) // 'ora'

// 시작인덱스 '4' 부터 끝까지 반환합니다.
str.substring(4) // 'ge'

+ slice(), splice() 는 배열 메서드

slice(begin, end)
slice(시작인덱스, 종료인덱스)

  • begin(optional), end(optional)
  • 배열의 begin 부터 end 전까지 잘라 새로운 배열로 반환
  • 얕은 복사를 하여 그 복사본을 사용
  • 원본 배열 바뀌지 않음

splice(start, deleteCount, item1, item2, item3...)
splice(시작인덱스, 삭제할갯수, 추가할요소1, 추가할요소2, 추가할요소3...)

  • start, deleteCount(optional), item1,2,3...(optional)
  • 배열의 start 부터, deleteCount 숫자만큼 삭제
  • 삭제 후, 추가할 요소 item1 을 추가 및 변경
  • 배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가하여 배열의 내용을 변경
  • 원본 배열 바뀜

💁🏻‍♀️ Reference

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/substring

https://velog.io/@hye_rin/JavaScript-substring-substr-slice

profile
쓸모있는 기술자

0개의 댓글