본문 바로가기
Front-End/JavaScript

[JavaScript] 내장 객체

by 민바이민 2021. 1. 17.

JavaScript

 

내장 객체

 

 

Math 객체

: Math 객체는 수학에서 자주 사용하는 상수와 함수들을 미리 구현해 놓은 자바스크립트 표준 내장 객체입니다.

min() : 인수로 전달 받은 값 중에서 가장 작은 수를 리턴합니다. 인수가 전달되지 않으면 Infinity를 리턴합니다. 또한 비교할 수 없는 값이 포함되어 있으면 NaN을 리턴합니다.
max() : 인수로 전달 받은 값 중에서 가장 큰 수를 리턴합니다. 인수가 전달되지 않으면 -Infinity를 리턴합니다. 또한 비교할 수 없는 값이 포함되어 있으면 NaN을 리턴합니다.
round() : 인수로 전달 받은 값을 소수점 첫번째 자리에서 반올림하여 그 결과를 리턴합니다.
floor() : 인수로 전달받은 값과 같거나 작은 수 중에서 가장 큰 정수를 리턴합니다.(내림)
ceil() : 인수로 전달 받은 값과 같거나 큰 수 중에서 가장 작은 정수를 리턴합니다.(올림)
random() : 0보다 크거나 같고 1보다 작은 무작위의 소수를 리턴합니다.

String 객체

: 자바스크립트에서 문자열을 손쉽게 만들 수 있는 객체입니다. 또한 문자열을 쉽게 다룰 수 있습니다.

const str = 'JavaScript';
const strObj = new String('JavaScript');

위 두 문장은 같다. 

(str == strObj); // true
(str === strObj);  // false  타입은 다르기때문에 데이터 타입까지 물어보는 ===에서는 false가 나온다

* 문자열의 길이는 length 프로퍼티에 저장됩니다.
console.log(str.length);    // 10

String 객체 매소드

index() : 특정 문자나 문자열이 처음으로 등장하는 위치를 리턴합니다.
charAt() : 특정 문자열에서 전달 받은 인덱스에 위치한 문자를 리턴합니다.
includes() : 특정 문자열에서 전달 받은 문자열이 포함되어 있는지 여부를 리턴합니다.
subString() : 전달받은 시작 인덱스부터 종료 인덱스 바로 앞까지 문자열을 추출하여 새로운 문자열을 리턴합니다.
substr() : 전달받은 시작 인덱스부터 전달받은 개수만큼 문자열을 추출하여 새로운 문자열을 리턴합니다.
split() : 구분자를 기준으로 나눈 후 나뉜 문자열을 하나의 배열에 저장합니다.
replace() : 원본 문자열의 일부를 전달받은 문자열로 치환합니다.

문자열.replace(/정규식/
, '변할문자열');
문자열.replace(/변경될문자/g, '변환문자열');
g 는 global match의 약자로써 변경될문자를 하나만이 아니라 해당 문자열에서 중복이 된다면 모두 바꿔준다.


trim() : 문자열의 앞뒤 공백을 제거합니다.
toUpperCase() : 영문자 중 소문자를 모두 대문자로 변환합니다.
toLowerCase() : 영문자 중 대문자를 모두 소문자로 변환합니다.

split의 예시

const arr = "영화감상,야구,축구,쇼핑,게임,드라이브";
const hobby = arr.split(",");

arr[0] = "영화감상";
arr[1] = "야구";
arr[2] = "축구";
arr[3] = "쇼핑";
arr[4] = "게임";
...

 

문제.

prompt를 이용하여 주민등록번호를 입력받고 유효한지 확인하는 프로그램을 작성.
0010113068518

1. 주민등록번호 각 자리에 2,3,4,5,6,7,8,9,2,3,4,5 숫자를 곱합니다. (마지막 자리를 떼놓음)
001011306851          8
* * * * * * * * * *
234567892345

2. 곱한 값을 모두 더합니다.
0+0+4+0+6+7+24+0+12+24+20+5 = 102

3. 더한 값을 11로 나눈 나머지 값을 구합니다.
102 % 11 = 3

4. 나머지 값을 11에서 뺍니다.
11 - 3 = 8
(단, 11에서 나머지 값을 뺀 값이 2자리(10이상)라면 10으로 나눈 나머지 값을 구합니다.
ex) 11 - 1 = 10
      10 % 10 = 0

5. 11에서 뺀 값이 주민등록번호 마지막 자리와 일치하면 유효한 주민등록번호입니다.

 

Date 객체

: 날짜, 시간 등을 쉽게 처리할 수 있는 내장 객체입니다.

연도(year)
1. 2자리로 표현 : 1900 ~ 1999 (만약 201212로 적으면 1920년으로 생각한다.)
2. 4자리로 표현 : 2000 ~

월(month)
0(1월) ~ 11(12월)

일(day)
1일 ~ 31일

시(hour)
0( 시 ) ~ 23( 시 )

분(minute)
0( 분 ) ~ 59( 분 )

초(second)
0( 초 ) ~ 59( 초 )

 

Date 객체를 만드는 방법

1. new Date() : 현재 날짜 시간을 저장한 객체가 만들어집니다.
2. new Date("날짜 문자열") : 해당 특정 날짜와 시간을 가리키는 객체가 만들어집니다.
3. new Date("밀리초") : 1970년 1월 1일 0시 ~ 해당 밀리초만큼 지난 날짜 객체가 만들어집니다. (Timestamp)
4. new Date(년, 월, 일, 시, 분, 초, 밀리초) : 해당 특정 날짜 시간을 가리키는 객체가 만들어집니다.

console.log(new Date());
console.log(new Date(20,11,26));    //1920 , 12, 26
console.log(new Date(2000000000000));
console.log(new Date(2020, 11, 26, 16, 30, 0));

const date = new Date();
console.log(`현재 년도 : ${date.getFullYear()}`);
console.log(`현재 월 : ${date.getMonth()+1}`);
console.log(`현재 일 : ${date.getDate()}`);

 

브라우저 객체 모델(Browser Object Model) 👉🏻 비표준

웹 브라우저에 구현된 JavaScript 객체 모델을 의미하며 window  객체의 프로퍼티로 조회할 수 있습니다.

 

window 객체

현재 웹 브라우저의 창이나 탭을 표현하기 위한 객체들이며, 웹 브라우저는 window 객체를 이용하여 브라우저 창을 표현할 수 있습니다.

 

setTimeout() : 일정 시간이 지난 후 매개변수로 제공된 함수를 실행합니다.

const 함수 = function(){
	실행문;
}
const st = setTimeout(함수, 시간);

setInterval() : 일정 시간마다 매개변수로 제공된 함수를 실행합니다.

clearTimeout() : setTimeout()에서 실행된 함수를 중지합니다.

cleatTimeout(setTimeout 객체명);


clearInterval() : setInterval()에서 실행된 함수를 중지합니다.

 

location 객체

현재 브라우저에 표시된 HTML 문서의 주소를 얻거나, 브라우저에 새 문서를 불러올 때 사용합니다. 현재 URL과 관련이 있다.

href : 페이지의 URL 전체 정보를 반환합니다. URL을 지정하여 페이지를 이동할 수 있습니다.
protocol : 콜론을 포함하는 http, gttps, ftp등 프로토콜 정보를 반환합니다.
hostname : 호스트의 이름과 포트번호를 반환합니다.
pathname : URL 경로부분의 정보를 반환합니다.

https://www.naver.com/blog/meanbymin
-----        ----------------         ---------------
protocol    hostname         pathname 

 

screen 객체

장치의 디스플레이 정보를 담고 있는 객체입니다.

브라우저의 해상도, 색상 .. <- 시스템적인 것을 알아내는 객체.
CSS에 미디어쿼리가 있어서 사용을 안하게 되었다.

 

navigator 객체

브라우저 공급자 및 버전 정보 등을 포함한 브라우저에 대한 정보를 저장하는 객체입니다.
개인정보보호가 강화되면서 잘 사용되지 않게 되었다.

 

histroy 객체

브라우저의 히스토리 정보를 문서와 문서 상태 목록으로 저장하는 객체입니다. 자바스크립트는 사용자의 개인 정보를 보호하기 위해 이 객체의 접근하는 방법을 일부 제한하고 있습니다.

back() : 브라우저에서 뒤로 버튼을 누른 효과를 냅니다.
go() : 매개변수로 전달된 숫자만큼 히스토리에 적용된 페이지로 이동합니다.
goForward() : 브라우저에서 앞으로 버튼을 누른 효과를 냅니다.

댓글