[딥다이브] 30장 Date / 31장 RegExp

주니·2023년 4월 11일
0

딥다이브

목록 보기
20/20

30. Date

Date 생성자 함수

표준 빌트인 객체인 Date는 날짜와 시간(연, 월, 일, 시, 분, 초, 밀리초)을 위한 메서드를 제공하는 생성자 함수이다.

new Date(); // -> Mon Jan 01 2023 00:00:00 GMT+0900 (대한민국 표준시)

Date 메서드

[Date.now](http://Date.now) : 1970년 1월 1일 00:00:00(UTC)을 기점으로 현재 시간까지 경과한 밀리초를 숫자로 반환한다.

이외에도 아래와 같이 원하는 결과값에 맞는 다양한 메서드를 활용할 수 있다. 메서드를 참고하여 필요에 따라 선택해 적용하자.

Date.parse, Date.prototype.getFullYear, Date.prototype.setFullYear
Date.prototype.getMonth, Date.prototype.setMonth
Date.prototype.getDate, Date.prototype.setDate
Date.prototype.getDay, Date.prototype.getHours Date.prototype.setHours
Date.prototype.getMinutes, Date.prototype.setMinutes
Date.prototype.getSeconds, Date.prototype.setSeconds
Date.prototype.getMilliseconds, Date.prototype.setMilliseconds
Date.prototype.getTime, Date.prototype.setTime

Date.prototype.getTimezoneOffset, Date.prototype.toDateString, Date.prototype.toTimeString, Date.prototype.tpISOSting, Date.prototype.toLocaleString, Date.prototype.toLocaleTumeString

Date를 활용한 시계 예제

(function printNow() {
	const today = new Date();
	
	const dayNames = [
		'(일요일)',
		'(월요일)',
		'(화요일)',
		'(수요일)',
		'(목요일)',
		'(금요일)',
		'(토요일)'
	];
	// getDay 메서드는 해당 요일(0~6)을 나타내는 정수를 반환한다.
	const day = dayNames[today.getDay()];
	const year = today.getFullYear();
	const month = today.getMonth() + 1;
	const date = today.getDate();
	let hour = today.getHours();
	let minute = today.getMinutes();
	let second = today.getSeconds();
	const ampm = hour >= 12 ? 'PM' : 'AM';

	// 12시간제로 변경
	hour %= 12;
	hour = hour || 12; // hour가 0이면 12를 재할당

	// 10분 미만인 분과 초를 2자리로 변경
	minute = minute < 10 ? '0' + minute : minute;
	second = second < 10 ? '0' + second : second;

	const now = `${year}${month}${date}${day} ${hour}:$[minute}:${second}${ampm}`;
	
	console.log(now);

	//1초마다 printNow 함수를 재귀호출.
	setTimeout(printNow, 1000);
}());

31. RegExp

정규 표현식이란?

  • Regular Expression. 일정한 패턴을 가진 문자열의 집합을 표현하기 위해 사용하는 형식 언어.

  • 패턴 매칭 기능 제공: 특정 패턴과 일치하는 문자열을 검색하거나 추출 또는 치환하는 기능.

  • 정규 표현식으로 전화번호 패턴 정의 예시

    const regExp = /^\d{3}-\d{4}-\d{4}$/;

정규 표현식의 생성

  • 정규 표현식 리터럴과 RegExp 생성자 함수를 사용할 수 있다.
  • 패턴과 플래그로 구성된다.
const target = 'Is this all there is?'

// 패턴: is
// 플래그: i => 대소문자를 구별하지 않고 검색한다.
const regexp = /is/i;

// test 메서드는 target 문자열에 대해 정규 표현식 regexp의 패턴을 검색하여
// 매칭 결과를 불리언 값으로 반환한다.
regexp.test(target); // -> true

RegExp 메서드

RegExp.prototype.exec : 인수로 전달받은 문자열에 대해 정규 표현식의 패턴을 검색하여 매칭 결과를 배열로 반환한다. 없는 경우null반환.

RegExp.prototype.test : 정규 표현식의 패턴을 검색하여 매칭 결과를 불리언 값으로 반환한다.

RegExp.prototype.match : 대상 문자열과 인수로 전달받은 정규 표현식과의 매칭 결과를 배열로 반환한다. g플래그가 지정되면 모든 결과를 배열로 반환한다.

플래그

패턴과 함께 정규 표현식을 구성. 정규 표현식의 검색 방식을 설정하기 위해 사용. 총 6개가 존재하며 자주 사용되는 다음의 세 가지를 살펴보자.

플래그의미설명
iignore case대소문자를 구별하지 않고 패턴 검색
gGlobal대상 문자열 내에서 패턴과 일치하는 모든 문자열을 전역 검색
mMulti line문자열의 행이 바뀌더라도 패턴 검색 계속

패턴

  • 문자열의 일정한 규칙을 표현하기 위해 사용.
  • /로 열고 닫으며 문자열의 따옴표는 생략
  • 어떤 문자열 내에 패턴과 일치하는 문자열이 존재할 때 ‘정규 표현식과 매치한다’고 표현

문자열 검색

앞서 살펴본 RegExp 메서드를 사용해 검색 대상 문자열과 정규 표현식의 매칭 결과를 구하면 검색이 수행된다.

임의의 문자열 검색

.은 임의의 문자 한 개를 의미. 여러개 사용 가능

반복 검색

{m,n} : 앞선 패턴이 최소 m번 최대 n번 반복되는 문자열 의미

{n} : {n,n}과 같다. n번 반복

{n,} : 앞선 패턴이 최소 n번 반복되는 문자열 의미

+ : {1,}과 같다.

? : {0,1}과 같다. 최대 한 번.

OR 검색

|는 or의 의미를 갖는다. /A|B/는 ‘A’ 또는 ‘B’를 의미.

분해되지 않은 단어 레벨로 검색하기 위해서는 +를 함께 사용 /A+|B+/

[]를 사용하여 간단하게 표현 /[AB]+/

범위를 지정하기 위해 [] 내에 - 사용

대문자 알파벳 검색 : /[A-Z]+/

대소문자 구별하지 않고 알파벳 검색 : /[A-Za-z]+/

숫자 검색 : /[0-9]+/ = \d, \D는 숫자가 아닌 문자

\w는 알파벳, 숫자, 언더스코어 = [A-Za-z0-9_], \W는 반대의미

NOT 검색

[…]내의 ^는 not의 의미

시작 위치로 검색

[…] 밖의 ^는 문자열의 시작을 의미

마지막 위치로 검색

$는 문자열의 마지막을 의미

결론
정규표현식은 일정한 규칙을 가진 텍스트 문자열을 지정하거나 검색하기 위해 사용한다.
필요에 따라 정규 표현식 문법을 활용해보자!!

0개의 댓글