객체 접근
Product['제품명'] -> '7D 건조 망고'
Product['유형'] -> '당절임'
Product['성분'] -> '망고, 설탕, 메타중아황산나트륨, 치자황색소'
Product['원산지'] -> '필리핀'
Product.제품명 -> '7D 건조 망고'
Product.유형 -> '당절임'
Product.성분 -> '망고, 설탕, 메타중아황산나트륨, 치자황색소'
Product.원산지 -> '필리핀'
객체 생성
객체와 반복문
for in 반복문을 사용해 객체에 반복문을 적용
name: 바나나
price: 1200
속성과 메소드
요소 -> 배열 내부에 있는 값 하나하나
속성 -> 객체 내부에 있는 값 하나하나
메소드 -> 객체의 속성 중 자료형이 함수인 속성
*객체라는 것을 사용할 때는 this를 사용
생성자 함수와 프로토타입
프로토타입
-생성자 함수로 만든 객체는 프로토타입 공간에 메소드를 지정해서 모든 객체가 공유하도록 함
-객체가 공유 하도록 함, 해당 함수를 생성자 함수로 사용했을 때만 의미가 있음
바나나의 가격은 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 등 사용
'웹 프로그래밍 > JavaScript' 카테고리의 다른 글
[JavaScript] 자바스크립트 예외처리 및 이벤트 처리 (1) | 2024.11.26 |
---|---|
[JavaScript] 브라우저 객체 모델 (0) | 2024.11.26 |
[JavaScript] 사용자 정의 자료형 활용 (2) | 2024.11.25 |
문서 객체 모델 DOM(Document Object Model) (1) | 2024.11.20 |
[JavaScript] 자바스크립트 구문 기초 (3) | 2024.11.19 |