{}
다양한 값을 , 로 구분하여 등록
key : Value
값이름 :
Property Name : Property Value
[Property Name] 문자열 타입을 가지고 있음
' ' 생략하더라고 문자열로 형변환, 생략하여 작성
1. 첫번째 글자는 반드시
문자, 밑줄(_), 달러 기호($) 중 하나로 시작!
2. 띄어쓰기 금지!
3. 하이픈(-) 금지!
ex)
2nd : null (x) // 2는 숫자 시작
my-name (x) // 하이픈(-)은 따옴표로 감싸야 함
규칙 벗어날시 ' ' 따옴표로 감싸서 표시
'brand Name'
'born-Year'
{
brandName: '코드익',
bornYear: 2017,
isVeryNIce: true,
worstCourse: null,
bestCourse: {
title: '자바스크립트 프로그래밍 기초',
language: 'JavaScript'
}
})
typeof object (객체) 로 표시
# 객체에서 데이터 접근하기
let codeit = {
name: '코드잇',
'born Year': 2017,
isVeryNIce: true,
worstCourse: null,
bestCourse: {
title: '자바스크립트 프로그래밍 기초',
language: 'JavaScript'
}
};
// 대괄호 표기법 (objectName['propertyName'])
console.log(codeit['born Year']);
['born' + ' Year'] 도 가능
let propertyName = 'name';
console.log(codeit[propertyName]);
console.log(codeit. bestCourse.title);
console.log(codeit. bestCourse['title']); // 점표기로 할수 없는 경우
존재하지 않는 Property 접근하는 경우 undefined
// 점 표기법 (objectName.PropertyName)
console.log(codeit.name);
// 대괄호 표기법 (objectName['propertyName'])
console.log(codeit['born Year']);
ex) Voca
let myVoca = {
// 코드를 작성해 주세요.
function: '함수',
variable: '변수',
constant: '상수',
local: '지역의',
global: '전반적인',
};
console.log(myVoca);
console.log(myVoca.local);
console.log(myVoca.constant);
console.log(myVoca.function);
# 객체 다루기 (수정, 삭제)
let codeit = {
name: '코드잇',
'born Year': 2017,
isVeryNIce: true,
worstCourse: null,
bestCourse: {
title: '자바스크립트 프로그래밍 기초',
language: 'JavaScript'
}
};
console.log(codeit.name);
codeit.name = 'codeit'; // codeit.name value값 'codeit'로 변경
console.log(codeit.name)'
[객체 추가]
codeit.ceo = 'codeit'; // 없었던 새로운 객체 추가
[객체 삭제]
delete codeit.worstCourse;
[객체 확인]
console.log(codeit.name !== undefined);
// 'propertyName' in object (in 연산자) 불린값 출력
console.log('name' in codeit);
// in 연산자 불린값을 출력하므로 if 조건문에 활용하기 좋음
if ('name' in codeit) {
console.log(`name 값은 ${codeit.name}입니다.`);
} else {
console.log('name 프로퍼티는 존재하지 않습니다.');
}
ex)
let myVoca = {
function: '함수',
variable: '변수',
constant: '상수',
local: '지역의',
global: '전반적인',
};
// 1. 이미 외운 단어 3개를 삭제해 주세요.
// 여기에 코드를 작성해 주세요.
delete myVoca.function;
delete myVoca.constant;
delete myVoca.local;
console.log(myVoca);
console.log(myVoca.constant);
// 2. 오늘 외울 단어 4개를 추가해 주세요.
// 여기에 코드를 작성해 주세요.
myVoca.extend = '확장하다';
myVoca.export = '내보내다';
myVoca.import = '불러오다';
myVoca['default value'] = '기본값';
console.log(myVoca);
console.log(myVoca.export);
// 3. default value의 뜻을 출력해 주세요.
// 여기에 코드를 작성해 주세요.
console.log(myVoca['default value']);
# 메소드 (Method)
let greetings = {
sayHello: function () {
console.log('Hello!');
},
sayHi: function() {
console.log('Hi!');
},
sayBye: function() {
console.log('Bye!');
}
};
greetings.sayHello('Codeit');
greetings['sayHello']('Codeit');
let rectAngle = {
width: 30,
height: 50,
getArea: function () {
return rectAngle.width * rectAngle.height;
}
}
let triAngle = {
width: 15,
height: 40,
getArea: function () {
return triAngle.width * triAngle.height / 2;
}
}
property 값으로 함수를 정의, 함수 = 객체의 메소드
ex)
let myVoca = {
// 코드를 작성해 주세요.
addVoca: function (key, value) {
myVoca[key] = value;
},
deleteVoca: function (key) {
delete myVoca[key];
},
printVoca: function (key) {
console.log(`"${key}"의 뜻은 "${myVoca[key]}"입니다.`);
},
};
// addVoca메소드 테스트 코드
myVoca.addVoca('parameter', '매개 변수');
myVoca.addVoca('element', '요소');
myVoca.addVoca('property', '속성');
console.log(myVoca);
// deleteVoca메소드 테스트 코드
myVoca.deleteVoca('parameter');
myVoca.deleteVoca('element');
console.log(myVoca);
// printVoca메소드 테스트 코드
myVoca.printVoca('property');