티스토리 뷰
[자바스크립트] 문자열함수
[자바스크립트] 문자열함수
![[자바스크립트] 문자열함수](https://t1.daumcdn.net/cfile/tistory/99038D3359DED62910)
문자형
문자열
□ ' '또는 ' ' 사이에 들어가는 특수 문자 및 모든 문자
□ 개행한다던가 문자열 안에 ', ' 기호를 넣고 싶을 때 사용
문자열에 삽입되는 특수 문자들
\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
'DEVELOPE > JAVASCRIPT' 카테고리의 다른 글
| 자바스크립트 [javascript] (0) | 2017.10.30 |
|---|---|
| 체크박스 하나만 선택하기 (0) | 2017.10.13 |
| 텍스트박스에 입력되는 문자의 바이트 수를 제한하는 스크립트 (0) | 2017.08.25 |
| [자바스크립트] 이벤트 핸들러 모음 (0) | 2017.01.31 |
- Total
- Today
- Yesterday
- APM 설치
- CentOS 설치
- 미디어쿼리
- 반응형 웹
- crontab
- 트위터 공유방법 및 소스
- ubuntu
- yum
- CentOS
- 리눅스 명령어
- SQL 함수
- 페이스북 공유소스
- Q6600
- mariadb 백업
- 카카오스토리 url 공유
- 트위터 url 공유
- 우분투 다운로드
- 에디트플러스
- 부트스트랩
- centos 7
- 우분투 usb 설치
- MySQL
- SQL 정렬
- 트위터 sns 공유
- mysql 백업
- 카카오스토리 sns 공유
- 우분투
- MYSQL 명령어
- 트위터 공유소스
- 카카오스토리 공유소스
| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | 5 | 6 | 7 |
| 8 | 9 | 10 | 11 | 12 | 13 | 14 |
| 15 | 16 | 17 | 18 | 19 | 20 | 21 |
| 22 | 23 | 24 | 25 | 26 | 27 | 28 |
| 29 | 30 | 31 |