문자열
□ " "또는 ' ' 사이에 들어가는 특수 문자 및 모든 문자
□ 개행한다던가 문자열 안에 ", ' 기호를 넣고 싶을 때 사용
문자열에 삽입되는 특수 문자들 |
\r |
리턴(Return) |
|
\n |
다음 줄로 이동(newline) |
\\ |
역슬래시(\) |
\t |
탭 문자 삽입(tab) |
\' |
작은 따옴표(') |
\b |
백스페이스(backspace) |
\" |
큰 따옴표(") |
문자스트링 타입(Character string types)
자바 스크립트 내장객체 -문자열을 다루는 메소드
메소드와 사용법 |
하는 일 |
charAt(index) |
지정된 위치에서 문자 찾기 |
indexOf(string) |
지정된 문자의 위치를 왼쪽부터 찾기 |
lastIndexOf(string) |
지정된 문자의 위치를 오른쪽부터 찾기 |
substring(index1, index2) |
지정된 위치에 있는 문자열 리턴 |
toLowerCase() |
소문자로 변환하기 |
toUpperCase() |
대문자로 변환하기 |
concat(string) |
두 문자열을 합치기 |
slice(start_index, end_index) |
문자열의 일부를 추출하기 |
split([분리자]) |
문자열을 분리하기 |
substr(start_index, length) |
문자열을 length만큼 잘라내기 |
charCodeAt([index]) |
문자열의 ISO Latin-1 값 알아내기 |
fromCharCode("n1", ..., "nn") |
ISO Latin-1 값의 문자열 알아내기 |
1) chart(index)
□ 매개변수로 입력된 숫자(index)가 지정하는 곳의 문자를 리턴
<HTML>
<HEAD>
<TITLE>charAt(index) 메소드</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
var tmp1, tmp2;
tmp1 = "Nanumi".charAt(0);
tmp2 = "Nanumi".charAt(4);
document.write("\"Nanumi\".charAt(0) returns " + tmp1);
document.write("<p>");
document.write("\"Nanumi\".charAt(4) returns " + tmp2);
// 자바스크립트 끝 -->
</SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>
결과보기
"webedu".charAt(0) returns w
"webedu".charAt(4) returns d
2) indexOf(string) / lastIndexOf(string)
□ indexOf / lastIndexOf 메소드는 string에 해당하는 부분이 문자열 어느 부분에 있는지 그
위치를 리턴해 주는 함수위치를 리턴해 주므로 리턴 값은 숫자
□ indexOf(string)은 왼쪽부터 검색을 하고 lastIndexOf(string)은 전체 문자열의 오른쪽부터
검색을 해서 첫번째 만나는 string에 해당하는 문자열의 위치를 리턴
□ 리턴해 주는 값은 모두 왼쪽부터 0, 1, ..., n으로 계산한 값이 리턴
<HTML>
<HEAD>
<TITLE>indexOf(string) / lastIndexOf(string) 메소드</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
var tmp1, tmp2;
tmp1 = "Nanumi is a helper".indexOf("a");
tmp2 = "Nanumi is a helper".lastIndexOf("a");
document.write("indexOf(\"a\") returns " + tmp1);
document.write("<p>");
document.write("lastIndexOf(\"a\") returns " + tmp2);
// 자바스크립트 끝 -->
</SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>
결과보기
indexOf("is") returns 10
lastIndexOf("is") returns 10
3) substring(index1, index2)
□ substring 메소드는 index1과 index2 사이에 있는 문자열을 리턴하는 메소드
<HTML>
<HEAD>
<TITLE>substring(index1, index2) 메소드</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
var tmp1, tmp2, tmp3, tmp4;
tmp1 = "Nanumi".substring(1,3);
tmp2 = "Nanumi".substring(3,1);
tmp3 = "Nanumi".substring(3);
tmp4 = "Nanumi".substring();
document.write("\"Nanumi\".substring(1,3) returns " + tmp1);
document.write("<p>");
document.write("\"Nanumi\".substring(3,1) returns " + tmp2);
document.write("<p>");
document.write("\"Nanumi\".substring(3) returns " + tmp3);
document.write("<p>");
document.write("\"Nanumi\".substring() returns " + tmp4);
// 자바스크립트 끝 -->
</SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>
결과보기
"webedu".substring(1,3) returns eb
"webedu".substring(3,1) returns eb
"webedu".substring(3) returns edu
"webedu".substring() returns webedu
4) toLowerCase() / toUpperCase()
□ toLowerCase() 메소드는 지정된 문자열을 모두 소문자로 만들 때 사용하고,
toUpperCase() 메소드는 지정된 문자열을 모두 대문자로 만들 때 사용
<HTML>
<HEAD>
<TITLE>toLowerCase() / toUpperCase() 메소드</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
var tmp1, tmp2;
tmp1 = "Nanumi".toLowerCase();
tmp2 = "Nanumi".toUpperCase();
document.write("\"Nanumi\".toLowerCase() returns " + tmp1);
document.write("<p>");
document.write("\"Nanumi\".toUpperCase() returns " + tmp2);
// 자바스크립트 끝 -->
</SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>
결과보기
"webedu".toLowerCase() returns webedu
"webedu".toUpperCase() returns WEBEDU
5) concat(string)
□ concat 메소드는 두 개의 문자열을 합쳐서 하나의 새로운 문자열을 만드는 메소드
□ concat(string) 메소드를 호출하는 문자열과 매개변수로 들어가는 string 이라는 문자열이
하나로 합쳐져 새로운 문자열을 만들어 낸다.
<HTML>
<HEAD>
<TITLE>concat(string) 메소드</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
document.write("Nanumi".concat(" 홈페이지 제작 도우미"));
// 자바스크립트 끝 -->
</SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>
결과보기
webedu 홈페이지 제작 도우미
6) slice(start_index, end_index)
□ slice 메소드도 앞에서 설명한 substring 메소드와 같이 문자열의 일부를 리턴
□ start_index는 추출할 문자열의 처음 위치를 숫자로 표시
<HTML>
<HEAD>
<TITLE>slice(start_index, end_index) 메소드</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
var tmp1, tmp2;
tmp1 = "Nanumi is good.".slice(2, 5); // ①
tmp2 = "Nanumi is good.".slice(2, -5); // ②
document.write("[" + tmp1 + "]<p>");
document.write("[" + tmp2 + "]");
// 자바스크립트 끝 -->
</SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>
결과보기
[bed]
[bedu is ]
7) split([분리자])
□ split 메소드는 입력되는 '분리자'를 기준으로 ','을 이용하여 문자열을 분리
<HTML>
<HEAD>
<TITLE>split([분리자]) 메소드</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
var str;
str = "Nanumi is good place on the web!"
document.write(str.split(" ") + "<p>");
document.write(str.split("oo") + "<p>");
document.write(str.split("a"));
// 자바스크립트 끝 -->
</SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>
결과보기
webedu,is,good,place,on,the,web!
webedu is g,d place on the web!
webedu is good pl,ce on the web!
8) substr(start_index, length)
□ substr 메소드 역시 substring, slice 메소드와 마찬가지로 문자열의 일부를 리턴
<HTML>
<HEAD>
<TITLE>substr(start_index, length) 메소드</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
var str;
str = "Nanumi is good place on the web!"
document.write("[" + str.substr(10, 4) + "]" + "<p>");
document.write("[" + str.substr(15, 5) + "]" + "<p>");
document.write("[" + str.substr(18, 5) + "]" );
// 자바스크립트 끝 -->
</SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>
결과보기
[good]
[place]
[ce on]
9) charCodeAt([index]) / fromCharCode(n1, n2, ..., nn)
□ charCodeAt 메소드는 문자열의 특정 위치에 있는 문자의 ISO-Latin-1 값을 알아내는데
사용하는 메소드 이고 fromCharCode 메소드는 그 반대
<HTML>
<HEAD>
<TITLE>charCodeAt / fromCharCode 메소드</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
var str;
str = "Nanumi is good place on the web!"
document.write(str.charCodeAt(0) + "<p>");
document.write(str.charCodeAt(1) + "<p>");
document.write(str.charCodeAt(2) + "<p>");
document.write(str.charCodeAt(3) + "<p>");
document.write(str.charCodeAt(4) + "<p>");
document.write(str.charCodeAt(5) + "<p>");
document.write(String.fromCharCode("78", "97", "110", "117", "109", "105"));
// 자바스크립트 끝 -->
</SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>
결과보기
119
101
98
101
100
117
Nanumi
출처: https://sixthgo.tistory.com/entry/자바스크립트-문자열-함수 [What Would Jesus Do]
'javascript' 카테고리의 다른 글
문자열을 배열로 변환, 배열을 문자열로 변환 (0) | 2020.09.11 |
---|---|
자바스크립트에서 파생된 ECMAScript사용 시 특징 (0) | 2019.10.22 |
javascript 소수점 버림, 올림, 반올림 (5) | 2019.03.12 |
array.push() / array.pop() / array.unshift() / array.shift() (0) | 2019.03.08 |
javascript 형식화 배열 (0) | 2019.03.08 |