언어공부/JavaScript&jQuery

자바 스크립트(JavaScript) 기초 문법 - 내장 객체 (문자열 객체)

yeony 2021. 7. 25. 23:41

자바 스크립트(JavaScript) 기초 문법 

내장 객체

내장 객체(Built-in Object)란 브라우저의 자바스크립트 엔진에 내장된 객체를 말하며, 필요한 경우 객체를 생성해서 사용할 수 있다. 내장 객체로는 문자(String), 날짜(Date), 배열(Array), 수학(Math), 정규 표현 객체(RegExp Object)등이 있다.

 

문자열 객체

문자열 객체(String Object)는 문자형 데이터를 객체로 취급하는 것으로, 자바스크립트에서 가장 많이 사용한다. 문자열 객체 생성은 아래와 같이 2가지 방법이 있다.

 

<script>
var 참조변수=new String(문자형 데이터);
var test=new String("hi hello");//문자열 객체 생성 1

var 참조변수=문자형 데이터;
var test="hi hello";//문자열 객체 생성 2
</script>

 

문자열 객체의 메소드 및 속성

종류 설명
charAt(index) 문자열에서 인덱스 번호에 해당하는 문자를 반환한다.
ex) var str="hello"; str.charAt(4); >> "o"를 반환
indexOf("찾을 문자") 문자열에서 왼쪽부터 찾을 문자와 일치하는 문자를 찾아 제일 먼저 일치하는
문자의 인덱스번호를 반환. 만약 없으면 -1을 반환한다.
ex) var str="hello"; str.indexOf("l"); >> 2 반환
lastIndexOf("찾을 문자") 문자열에서 오른쪽부터 찾을 문자와 일치하는 문자를 찾아 제일 먼저 일치하는
문자의 인덱스번호를 반환. 만약 없으면 -1을 반환한다.
ex) var str="hello"; str.lastIndexOf("l"); >> 3 반환
match("찾을 문자") 문자열에서 왼쪽부터 찾을 문자와 일치하는 문자를 찾아 제일 먼저 일치하는
문자의 인덱스번호를 반환. 만약 없으면 null을 반환한다.
ex) var str="hello"; str.match("t"); >> null 반환
replace("바꿀 문자","새 문자") 문자열에서 왼쪽부터 바꿀 문자와 일치하는 문자를 찾아 제일 먼저 찾은 문자를
새 문자로 치환한다.
ex) var str="hello"; str.replace("h","c"); >> "cello"를 반환
search("찾을 문자") 문자열에서 왼쪽부터 찾을 문자와 일치하는 문자를 찾아 제일 먼저 일치하는 
인덱스 번호를 반환한다.
ex) var str="hello"; str.indexOf("l"); >> 2 반환
slice(a,b) a개의 문자를 자르고 b번째 이후에 문자를 자른 후 남은 문자를 반환한다.
ex) var str="hello"; str.slice(2,4); >> "ll"반환. 문자열에서 2글자 "he"를 자르고,
4번째 이후 글자인 "o"를 자른 후 나머지 "ll"을 반환.
ex) str.slice(1,-2) 인 경우 "el"반환. 문자열에서 1글자 "h"를 자르고, 
-2는 뒤에서부터 두 번째 글자를 가리켜 "lo"를 잘라 나머지 "el"을 반환.
substring(a,b) a인덱스부터 b 인덱스 이전 구간의 문자를 반환한다.
ex) var str="hello"; str.substring(1,3) >> "el" 반환. 인덱스 1부터 인덱스 3이전
구간의 문자를 반환한다.
ex) str.substring(2,-1)은 "he"를 반환. -1은 인덱스 0을 가리키므로 인덱스 0부터 
인덱스 2이전 구간의 문자를 반환한다.
substr(a, 문자 개수) 문자열에 a 인덱스부터 지정한 문자 개수만큼 문자열을 반환한다.
ex) var str="hello"; str.substr(2,2); >>"ll" 반환. 인덱스 2부터 2글자 반환.
split("문자") 지정한 문자를 기준으로 문자 데이터를 나누어 배열에 저장하여 반환한다.
ex)var str=""010-1111-1111"; var phone=str.split("-");
phone[0]에는 010, phone[1]에는 1111, phone[2]에는 1111이 저장된다.
toLowerCase( ) 문자열에서 영문 대문자를 모두 소문자로 바꾼다.
ex) var str="HELLO";  str.toLowerCase(); >>"hello" 반환
toUpperCase( ) 문자열에서 영문 소문자를 모두 대문자로 바꾼다.
ex) var str="hello";  str.toLowerCase(); >> "HELLO" 반환
length 문자열에서 문자의 개수를 반환한다.
ex) var str="hello"; str.length; >>5를 반환
concat("새로운 문자") 문자열에 새로운 문자열을 결합한다.
ex) var str="hello"; str.concat("javascript");>>"hellojavascript"를 반환
charCodeAt(index) 문자열 index에 해당 문자의 아스키 코드값을 반환한다.
ex) var str="ABC", str.charCodeAt(0); >> 65를 반환(A의 아스키 코드 값)
fromCharCode(아스키 코드 값) 아스키 코드값에 해당하는 문자를 반환한다.
ex) String.fromCharCode(65); >>"A"를 반환
trim( ) 문자의 앞 또는 뒤에 공백 문자열을 삭제한다.
ex) var str=" hello! "; str.trim(); >>"hello!"를 반환

 

위의 메소드를 응용해서 핸드폰 번호 뒤의 4자리를 "****"로 표시하고 싶다면 아래의 코드를 사용하면 된다.

 

<scirpt>
var phone="01011111111";
var result=phone.substring(0,phone.length-4)+"****";
//인덱스 0부터 phone 문자길이에서 4를 뺀 인덱스 이전구간까지 구하고
//"****"를 더해준다.
document.write(result);//0101111****가 출력된다.
</script>

 

또는 이메일 유효성 검사하는 코드도 작성할 수 있다.

 

<script>
var email="aaaa123@daum.net";
var url=[".com",".co.kr",".net",".go.kr",".or.kr"];

var check1=false, check2=false;

if(emailll.indexOf("@")>0) check1=true;
//email에 @가 있으면 check1=true;

for(var i=0;i<url.length;i++){
	if(email.indexOf(url[i])>0) check2=true;
    //email에 url배열 원소값이 있으면 check2=true;
}

if(check1&&check2){//check1,2모두 true이면
	document.write(email);
}else{
	alert("이메일 형식이 잘못됨!");
}
</script>