01. at()
"문자열".at([위치값])
- at()메서드는 위치값(인덱스 값)을 받아 해당되는 자리의 요소를 반환합니다.
- 배열과 같이 0부터 첫번째 자리의 요소를 반환하며 -1은 마지막 자리의 요소부터 시작합니다.
{
"javascript reference".at(0); //j
"javascript reference".at(1); //a
"javascript reference".at(-1); //e
"javascript reference".at(-3); //n
}
02. charAt()
"문자열".charAt([위치값])
- charAt()메서드는 위치값(인덱스 값)을 받아 해당되는 자리의 요소를 반환합니다.
- 배열과 같이 0부터 첫번째 자리의 요소를 반환하며 -1부터는 빈 문자열을 반환합니다.
{
"javascript reference".charAt(0); //j
"javascript reference".charAt(1); //a
"javascript reference".charAt(4); //v
"javascript reference".charAt(-1); //빈문자열
"javascript reference".charAt(10); //빈문자열
}
03. charCodeAt()
"문자열".charCodeAt([위치값])
- charCodeAt()메서드는 위치값(인덱스 값)을 받아 해당되는 자리의 유니코드 값을 반환합니다.
- 유니코드(Unicode)는 전 세계 언어의 문자를 정의하기 위한 국제 표준 코드입니다. 즉 언어를 숫자로 표현하는 방식이라고 할 수 있습니다.
- 이 메서드는 문자열에서 특정 문자를 찾거나, 문자열을 비교하거나, 문자열을 분할하는 등 다양한 상황에서 사용될 수 있습니다.
{
"javascript reference".charCodeAt(0); //106
"javascript reference".charCodeAt(1); //97
"javascript reference".charCodeAt(4); //115
"javascript reference".charCodeAt(-1); //NaN
"javascript reference".charCodeAt(24); //NaN
"javascript reference".charCodeAt(10); //32
}
04. codePointAt()
"문자열".codePointAt([위치값])
- codePointAt()메서드는 위치값(인덱스 값)을 받아 해당되는 자리의 유니코드 값을 반환합니다.
- 유니코드 코드 포인트가 16비트를 초과하는 경우에는 codePointAt()를 사용하여 정확한 코드 포인트 값을 가져올 수 있습니다.
{
"javascript reference".codePointAt(0); //106
"javascript reference".codePointAt(1); //97
"javascript reference".codePointAt(4); //115
"javascript reference".codePointAt(-1); //undefined
"javascript reference".codePointAt(24); //undefined
"javascript reference".codePointAt(10); //32
}
05. concat()
"문자열".concat([문자열1],[문자열2])
- concat()메서드는 기존의 문자열과 입력한 문자열를 합친 값을 반환합니다.
- 공백이 2개라도 인식을 합니다
- 문자열이 여러개라도 다 합칠 수 있습니다.
{
"javascript".concat("reference"); //javascriptreference
"javascript".concat(" reference"); //javascript reference
"javascript".concat(" reference"); //javascript reference
"javascript".concat("reference","jQuery"); //javascriptreferencejQuery
"javascript".concat(" reference"," jQuery"); //javascript reference jQuery
}
06. includes() 🌳
"문자열".includes("검색값",[위치값])
- includes()메서드는 문자열 포함 여부를 검색하여, 불린(true, false)을 반환합니다.
- 대소문자를 구분합니다
{
"javascript reference".includes("javascript"); //true
"javascript reference".includes("j"); //true
"javascript reference".includes("a"); //true
"javascript reference".includes("reference"); //true
"javascript reference".includes("reference",11); //true
"javascript reference".includes("reference",12); //false
"javascript reference".includes("Javascript"); //false
}
07. indexOf() 🌳
"문자열".indexOf("검색값",[위치값])
- indexOf()메서드는 문자열을 검색하여, 주어진 값과 일치하는 첫 번째 위치값(index)을 반환합니다.
- 문자열을 검색하여, 주어진 값과 일치하는 것이 없으면 -1를 반환합니다
- 또한 대소문자를 구분합니다
{
console.log("javascript refercence".indexOf("javascript")); //0
console.log("javascript refercence".indexOf("javascripts")); //-1
console.log("javascript refercence".indexOf("j")); //0
console.log("javascript refercence".indexOf("J")); //-1
console.log("javascript refercence".indexOf("a")); //1
console.log("javascript refercence".indexOf("ja")); //0
console.log("javascript refercence".indexOf("jv")); //-1
console.log("javascript refercence".indexOf("refercence")); //11
console.log("javascript refercence".indexOf("r")); //6
}
08. lastIndexOf() 🌳
"문자열".lastIndexOf("검색값",[위치값])
- lastIndexOf()메서드는 문자열을 역순으로 검색하여, 주어진 값과 일치하는 첫 번째 위치값(index)을 반환합니다.
- 문자열을 역순으로 검색하여, 주어진 값과 일치하는 것이 없으면 -1를 반환합니다
- 대소문자를 구분합니다
{
"javascript reference".lastIndexOf("javascript"); //0
"javascript reference".lastIndexOf("javascripts"); //-1
"javascript reference".lastIndexOf("a"); //3
"javascript reference".lastIndexOf("j"); //0
"javascript reference".lastIndexOf("r"); //15
"javascript reference".lastIndexOf("reference",0); //-1
"javascript reference".lastIndexOf("reference",1); //-1
"javascript reference".lastIndexOf("reference",1); //-1
"javascript reference".lastIndexOf("reference",11); //11
"javascript reference".lastIndexOf("reference",12); //11
}
09. localeCompare()
"문자열".localeCompare([문자열])
- localeCompare()메서드는 문자열과 문자열을 비교하여 순서에 따라 값을 반환합니다.
- 비교되는 값이 비교할 값보다 앞에 있다면 -1를 반환하고
- 비교되는 값이 비교할 값과 같다면 0을 반환하며
- 비교되는 값이 비교할 값보다 뒤에 있다면 1을 반환합니다.
{
"a".localeCompare("b") //-1
"a".localeCompare("c") //-1
"a".localeCompare("a") //0
"b".localeCompare("a") //1
"c".localeCompare("a") //1
}
10. match() 🌳
"문자열".match(검색값)
"문자열".match(정규식표현)
"문자열".match(정규식표현)
- match()메서드는 문자열(정규식)을 검색하고, 위치값(문자)을 반환합니다.
- 문자열을 검색하여, 주어진 값과 일치하는 것이 없으면 null를 반환합니다
- 대소문자를 구분합니다
- match()는 문자값(배열)을 반환하고, search() 메서드는 위치값(숫자)를 반환하는 것이 다릅니다.
{
"javascript reference".match("javascript"); //"javascript"
"javascript reference".match("reference"); //"reference"
"javascript reference".match("r"); //"r"
"javascript reference".match("R"); //null
"javascript reference".match(/reference/); //reference
"javascript reference".match(/Reference/); //null
"javascript reference".match(/Reference/i); //reference
"javascript reference".match(/Reference/g); //null
"javascript reference".match(/r/); //r
"javascript reference".match(/r/g); //r r r
"javascript reference".match(/w/g); //null
}
12. normalize()
"문자열".normalize(정규화 방식)
"유니코드 문자열".normalize(정규화 방식)
"유니코드 문자열".normalize(정규화 방식)
- normalize()메서드는 문자열을 유니코드 정규화 방식(Unicode Normalization Form)에 따라 정규화된 형태로 반환합니다.
- 정규화 방식은 'NFC', 'NFD', 'NFKC', 'NFKD'가 있습니다.
{
"javascript".normalize("NFC") //javascript
"javascript".normalize("NFD") //javascript
"javascript".normalize("NFKC") //javascript
"javascript".normalize("NFKD") //javascript
"\u006a\u0061\u0076\u0061\u0073\u0063\u0072\u0069\u0070\u0074".normalize("NFC") //javascript
"\u006a\u0061\u0076\u0061\u0073\u0063\u0072\u0069\u0070\u0074".normalize("NFD") //javascript
"\u006a\u0061\u0076\u0061\u0073\u0063\u0072\u0069\u0070\u0074".normalize("NFKC") //javascript
"\u006a\u0061\u0076\u0061\u0073\u0063\u0072\u0069\u0070\u0074".normalize("NFKD") //javascript
}
13. padEnd()
"문자열".padEnd([문자열의 갯수],[채워넣을 문자열])
- padEnd()메서드는 현재 문자열에 다른 문자열을 문자열의 끝(우측)부터 채워넣어 주어진 길이를 만족하는 새로운 문자열을 반환합니다.
- 목표 문자열의 갯수가 현재 문자열의 길이보다 적다면 채워넣지 않고 그대로 반환합니다.
- 채워넣을 문자열이 너무 길어 목표 문자열의 길이를 초과한다면 좌측 일부를 잘라서 넣습니다.
- 기본값은 " "(빈문자열)입니다.
{
"javascript".padEnd(3) //javascript
"javascript".padEnd(3,"reference") //javascript
"javascript".padEnd(12,"reference") //javascriptre
"javascript".padEnd(17,"reference") //javascriptreferen
"javascript".padEnd(19,"reference") //javascriptreference
"javascript".padEnd(24,"reference") //javascriptreferencerefer
}
14. padStart()
"문자열".padStart([문자열의 갯수],[채워넣을 문자열])
- padStart()메서드는 현재 문자열에 다른 문자열을 문자열의 시작(좌측)부터 채워넣어 주어진 길이를 만족하는 새로운 문자열을 반환합니다.
- 목표 문자열의 갯수가 현재 문자열의 길이보다 적다면 채워넣지 않고 그대로 반환합니다.
- 채워넣을 문자열이 너무 길어 목표 문자열의 길이를 초과한다면 좌측 일부를 잘라서 넣습니다.
- 기본값은 " "(빈문자열)입니다.
{
"reference".padStart(15) // reference (앞에 빈 문자열이 생김)
"reference".padStart(3,"javascript") //reference
"reference".padStart(12,"javascript") //javreference
"reference".padStart(17,"javascript") //javascrireference
"reference".padStart(19,"javascript") //javascriptreference
"reference".padStart(24,"javascript") //javascriptjavasreference
}
15. repeat()
"문자열".repeat([반복할 횟수])
- repeat() 메서드는 문자열을 주어진 횟수만큼 반복해 붙인 새로운 문자열을 반환합니다.
- 음수 값을 입력한다면 RangeError가 뜹니다.
{
"javascript".repeat(-1) //RangeError 에러가 뜹니다
"javascript".repeat(1) //javascript
"javascript".repeat(0) //" "
"javascript".repeat(3) //javascriptjavascriptjavascript
"javascript".repeat(3.5) //javascriptjavascriptjavascript
}
18. search() 🌳
"문자열".search(검색값)
"문자열".search(정규식표현)
"문자열".search(정규식표현)
- search()메서드는 문자열(정규식)을 검색하고, 위치값(숫자)을 반환합니다.
- 문자열을 검색하여, 주어진 값과 일치하는 것이 없으면 -1를 반환합니다
- 또한 대소문자를 구분합니다
{
"javascript reference".search("javascript"); //0
"javascript reference".search("reference"); //11
"javascript reference".search("r"); //6
"javascript reference".search("a"); //1
"javascript reference".search("jv"); //-1
"javascript reference".search("J"); //-1
"javascript reference".search(/reference/); //11 //정규식 표현을 썼음
"javascript reference".search(/Reference/); //-1
"javascript reference".search(/Reference/i); //11 //i가 소문자로 인식해줌 reference
"javascript reference".search(/[a-z]/g); //0
"자바스크립트".search(/[a-z]/g); //-1
}
19. slice()
"문자열".slice(시작위치,종료위치)
- slice() 메서드는 시작 위치에서 종료 위치 값을 추출하여, 새로운 문자열을 반환합니다
{
"javascript".slice(0) //javascript
"javascript".slice(1) //avascript
"javascript".slice(2) //vascript
"javascript".slice(0,1) //j
"javascript".slice(1,2) //a
"javascript".slice(0,2) //ja
"javascript".slice(0,3) //jav
"javascript".slice(5,10) //cript
"javascript".slice(5,-1) //crip
"javascript".slice(5,-2) //cri
"javascript".slice(-1) //t
"javascript".slice(-2) //pt
"javascript".slice(-3) //ipt
"javascript".slice(-3,-1) //ip
"javascript".slice(-3,-2) //i
}
22. split()
"문자열".split(구분자,[제한])
- split() 메서드는 문자열을 구분자로 구분하고, 여러 개의 문자열(배열)을 반환합니다.
{
"javascript".split(""); //['j', 'a', 'v', 'a', 's', 'c', 'r', 'i', 'p', 't']
"java script".split(" "); //['java', 'script']
"java scr ipt".split(" "); //['java', 'scr', 'ipt']
"javascript".split(" ",1); //['j']
"javascript".split(" ",2); //['j', 'a']
"javascript".split(" ",3); //['j', 'a', ''v]
"java script".split(" ",1); //['java']
"java script".split(" ",1); //['java', 'script']
"javascript".split("j"); //['', 'avascript']
"javascript".split("a"); //['j', 'v', 'script']
"javascript".split("e"); //['javascript']
"java/scr/ipt".split("/"); //['java', 'scr', 'ipt']
"java&scr!ipt".split("&"); //['java', 'scr!ipt']
"java&scr!ipt".split("!"); //['java&scr', 'ipt']
"java&scr!ipt".split(/&|\!/); //['java', 'scr', 'ipt'] 정규식 표현을 활용한 구분자 2개사용
"javascript".split("").join(); //"javascript".split("").join()
"javascript".split("").join("*"); //j*a*v*a*s*c*r*i*p*t
"javascript".split("").reverse().join("*"); //t*p*i*r*c*s*a*v*a*j
"javascript".split("").reverse().join("/"); //t/p/i/r/c/s/a/v/a/j
}
30. trim()
"문자열".trim()
- trim() 메서드는 문자열의 앞/뒤 공백을 제거하고, 새로운 문자열을 반환합니다.
{
"javascript".trim(""); //javascript
"javascript ".trim(""); //javascript
" javascript".trim(""); //javascript
"java script".trim(""); //java script
}
31. trimEnd()
"문자열".trimEnd()
- trimStart() 메서드는 문자열의 뒤 공백을 제거하고, 새로운 문자열을 반환합니다.
{
"javascript ".trimEnd(""); //javascript
}
32. trimStart()
"문자열".trimStart()
- trimEnd() 메서드는 문자열의 앞 공백을 제거하고, 새로운 문자열을 반환합니다.
{
" javascript".trimStart(""); //javascript
}