웹 프로그래밍/JavaScript

[JavaScript] 자바스크립트 내장 객체

0_TLS 2024. 11. 25. 23:03

객체 접근

Product['제품명'] -> '7D 건조 망고'

Product['유형'] -> '당절임'

Product['성분'] -> '망고, 설탕, 메타중아황산나트륨, 치자황색소'

Product['원산지'] -> '필리핀'

 

Product.제품명 -> '7D 건조 망고'

Product.유형 -> '당절임'

Product.성분 -> '망고, 설탕, 메타중아황산나트륨, 치자황색소'

Product.원산지 -> '필리핀'

 

객체 생성

 

객체와 반복문

for in 반복문을 사용해 객체에 반복문을 적용

name: 바나나

price: 1200

 

속성과 메소드

요소 -> 배열 내부에 있는 값 하나하나

속성 -> 객체 내부에 있는 값 하나하나

메소드 -> 객체의 속성 중 자료형이 함수인 속성

*객체라는 것을 사용할 때는 this를 사용

 

바나나의 가격은 1200원 입니다.

 

생성자 함수와 프로토타입

 

프로토타입

-생성자 함수로 만든 객체는 프로토타입 공간에 메소드를 지정해서 모든 객체가 공유하도록 함

-객체가 공유 하도록 함, 해당 함수를 생성자 함수로 사용했을 때만 의미가 있음

바나나의 가격은 1200원입니다.

사과의 가격은 2000원입니다.

배의 가격은 3000원입니다.

고구마의 가격은 700원입니다.

감자의 가격은 600원입니다.

수박의 가격은 5000원입니다.

 

기본 자료형과 객체 자료형의 차이

기본 자료형에 프로토타입으로 메소드 추가

//변수 생성
let primitiveNumber = 273;
//메소드 추가
Number.prototype.method = functioin(){
	return 'Primitive Method'
};

//메소드 실행
console.log(primitiveNumber.method());

=>Primitive Method

 

표준 내장 객체

Number 객체

자바스크립트에서 숫자를 표현할 때 사용

 

let numberFromLiteral = 273;

let numberFromConstructor = new number(273);

메소드 설명
toExponential() 숫자를 지수 표시로 나타낸 문자열을 리턴합니다.
toFixed() 숫자를 고정소수점 표시로 나타낸 문자열을 리턴합니다.
toPrecision() 숫자를 길이에 따라 지수 표시 또는 고정소수점 표시로 나타낸 문자열을 리턴합니다.

 

*toFixed() 메소드를 사용해 소수점 자릿수를 자르는 방법

//변수 선언
let number = 273.5210332;
//출력
console.log(number.toFixed(1));
console.log(number.toFixed(4));

 

*생성자 함수에 속성과 메소드 추가

//생성자 함수를 생성
function Constructor(){}
constructor.property = 273;
constructor.method = function() {};
//생성자 함수의 속성과 메소드를 출력
console.log(constructor.property);
console.log(constructor.method);

273

f(){}

 

Number 생성자 함수의 속성

속성 설명
MAX_VALUE 자바스크립트의 숫자가 나타낼 수 있는 최대 숫자
MIN_VALUE 자바스크립트의 숫자가 나타낼 수 있는 최소 숫자
NaN 자바스크립트의 숫자가 나타낼 수 없는 숫자
POSITIVE_INFINITY 양의 무한대 숫자
NEGATIVE_INFINITY 음의 무한대 숫자

 

String 객체

String 객체 생성

let stringFromLiteral = "안녕하세요";

let stringFromConstructor = new String("안녕하세요");

 

속성과 메소드

속성  설명
length 문자열의 길이를 나타냅니다

 

String 객체의 메소드는 변경된 값을 리턴함

 

String 객체 메소드

메소드 설명
charAt(position) position에 위치하는 문자를 리턴합니다.
charCodeAt(position) position에 위치하는 문자의 유니코드 번호를 리턴합니다.
concat(args) 매개 변수로 입력한 문자열을 이어 리턴합니다.
indexOf(searchString, position) 앞에서부터 일치하는 문자열의 위치를 리턴합니다.
lastIndex(searchString, position) 뒤에서부터 일치하는 문자열의 위치를 리턴합니다.
match(regExp) 문자열 안에 regExp가 있는지 확인합니다.
replace(regExp, Replacement) regExp를 replacemen로 바꾼 후 리턴합니다.
search(regExp) regExp와 일치하는 문자열의 위치를 리턴합니다.
slice(start, end) 특정 위치의 문자열을 추출해 리턴합니다.
split(separator, limit) separator로 문자열을 잘라 배열을 리턴합니다.
substr(start, count) start부터 count만큼 문자열을 잘라서 리턴합니다.
substring(start, end) start부터 end까지 문자열을 잘라서 리턴합니다.
toLowerCase() 문자열을 소문자로 바꾸어 리턴합니다.
toUpperCase() 문자열을 대문자로 바꾸어 리턴합니다.

 

**잘못된 String 객체의 메소드 사용

//변수 선언
let string = 'abcdefg'
//출력
string.toUpperCase();
console.log(string);

->abcdefg 

=> 자기자신을 변경하지 않고 리턴하는 것뿐이므로 소문자 상태로 출력

 

**올바른 String 객체의 메소드 사용

//변수 선언
let string = 'abcdefg'
//출력
string = string.toUpperCase();
console.log(string);

->ABCDEFG

 

메소드 활용

문자열 포함

 

*indexOf() 메소드

=>특정 문자열이 있는지 확인, 위치를 리턴함

=>문자열이 포함되어 있지 않을 때는 -1을 리턴

//변수 선언
let string = '안녕하세요. 좋은 아침입니다.';
//문자열 내부에 '아침'이라는 문자열이 있는지 확인
if (string.indexOf('아침') >= 0) {
	console.log('좋은 아침이에요...!');
}

->좋은 아침이에요...!

 

문자열 분해

split() 메소드를 사용하면 특정한 기호를 기반으로 문자열을 분해

//변수 선언
let string = '감자, 고구마, 바나나, 사과';
//문자열을 쉼표로 자르고 출력
let array = string.split(',');
console.log(array);

['감자', '고구마', '바나나', '사과']

 

Date 객체

메소드 활용

*Date 객체

=> getOO() 형태 메소드, setOO() 형태 메소드

-> FullYear, Month, Day, Hours, Minute, Seconds 등 사용