객체는 새로운 값을 가진 프로퍼티를 생성하고

생성된 프로퍼티에 접근해서 해당 값을 읽거나

원하는 값으로 프로퍼티를 갱신할 수 있다.


객체의 프로퍼티에 접근하려면 마침표나 대괄호를 사용한다.

대괄호 표기법에서는 접근하려는 프로퍼티의 이름을

문자열의 형태로 만든다.


객체 프로퍼티 읽기


var obj = {
name : 'Gil-dong',
age : 30
};

//객체 프로퍼티 읽기
//마침표 표기
console.log(obj.name);//-> Gil-dong
//대괄호 표기
console.log(obj['name']);//-> Gil-dong
//gender라는 객체가 없으므로
console.log(obj.gender);//-> undefined


객체 프로퍼티 갱신


var obj = {
name : 'Gil-dong',
age : 30
};

//객체 프로퍼티 갱신
//age의 기존 값을 변경
obj.age = 25;
console.log(obj.age);//-> 25
console.log(obj['age']);//-> 25


객체 프로퍼티 동적 생성


var obj = {
name : 'Gil-dong',
age : 30
};

//객체 프로퍼티 동적 생성
//객체가 생성된 후에도 프로퍼티를 생성해서 객체에 추가할 수 있다.
//gender라는 프로퍼티를 생성 후 male이라는 값을 추가.
obj.gender = 'male';
console.log(obj.gender);//-> male


객체 프로퍼티 삭제


//객체 프로퍼티 삭제
var obj = {
name : 'Gil-dong',
age : 30,
gender : 'male'
};

console.log(obj.gender);//-> male
//gender 프로퍼티 삭제
delete obj.gender;
console.log(obj.gender);//-> undefined

//obj 객체 삭제
delete obj;
console.log(obj.name);//-> Gil-dong
//delete연산자는 객체를 삭제하지 못한다.


대괄호 표기법만 사용해야 하는 경우


var obj = {
name : 'Gil-dong',
age : 30
};

//대괄호 표기법만 사용해야 하는 경우
//접근하려는 프로퍼티가 표현식이거나 예약어일 경우 사용
//아래와 같이 phone-number은 '-'가 있는 표현식
obj['phone-number'] = '010-1111';
console.log(obj['phone-number']);


객체 내 모든 프로퍼티 출력


//for in문을 사용하면 객체에 포함된
//모든 프로퍼티에 대해 반복 수행 가능

//객체 리터럴을 이용한 obj 객체 생성
var obj = {
name : 'Gil-dong',
age : 30,
gender : 'male'
};

//prop 변수 선언
var prop;

//prop변수에 obj객체의 프로퍼티가 하나씩 할당
for(prop in obj){
//prop에 할당된 프로퍼티 이름을 이용
//대괄호 표기법을 사용하여 값을 출력
console.log(prop, obj[prop]);
}


'프로그래밍 > JavaScript' 카테고리의 다른 글

참조 타입 객체 생성  (0) 2019.03.12
자바스크립트 기본 타입  (0) 2019.03.11

객체 : 키(key)와 값(value)의 쌍들을 저장하는 컨테이너


속성(Property) : 키와 값의 한 쌍

1) 언제든지 추가하거나 삭제가 가능.

2) 값으로 다른 객체의 참조를 가질 수 있다. 

3) 값으로 함수 객체를 가질 수도 있는데 이 속성을 메서드라 부른다


객체를 생성하는 방식

1) 객체 생성자 함수

2) 객체 리터럴

3) 생성자 함수



//생성자 함수를 사용한 객체 생성
//Object의 O는 대문자임을 주의
var obj = new Object();

//obj 객체 속성(property) 생성
obj.name = 'Gil-dong';
obj.age = 30;
obj.gender = 'male';

//obj 객체의 타입
console.log(typeof obj);//-> object 타입
//obj 객체의 속성 출력
console.log(obj);//-> 객체의 키와 값의 형태로 출력


//리터럴 : 표기법
//객체 리터럴 : 객체를 생성하는 표기법을 의미
//객체 리터럴 방식 obj 객체 생성
var obj = {
name : 'Gil-dong',
age : 30,
gender : 'male'
};
// {}로 객체를 생성하며 아무것도 적지 않으면 빈 객체가 생성
// "속성 이름" : "속성 값"형태로 표기

console.log(typeof obj);//-> object 타입
console.log(obj);//-> 객체의 키와 값의 형태로 출력

//생성자 함수 사용 추후..


'프로그래밍 > JavaScript' 카테고리의 다른 글

객체 프로퍼티  (0) 2019.03.12
자바스크립트 기본 타입  (0) 2019.03.11

기본(원시) 타입 :  Number, String, Boolean, undefined, null

참조 타입 : 기본타입을 제외한 모든 타입, 객체(배열, 함수, 정규표현식, Date, RegExp 등)


변수 선언 키워드 var


기본데이터 타입으로 만든 변수는 typeof연산자를 이용해 출력하면

데이터타입을 나타내는 문자열이 출력

//숫자 
var int = 10;
var float = 1.1;
//모든 숫자를 실수로 처리
//64비트 부동소수점 형태로 저장
console.log(typeof int, typeof float); //-> number, number

//문자
var singlech = 'single';
var doublech = "double";
//한번 정의된 문자는 변하지 않음
//정해진 문자열에 배열의 인덱스로 새로운 문자를 대입하여도 변하지 않음
//한번 생성된 문자열은 읽기만 가능하고 수정은 불가능
console.log(typeof singlech, typeof doublech); //-> string, string

//Bool
var booltype = true;
//''나 ""로 작성하지 않음에 주의
console.log(typeof booltype);//-> boolean 

//undefined 
var emptyspace;
//아무런 값이 할당되지 않을 때 사용
console.log(typeof emptyspace);//-> undefined의 하나의 데이터 타입

//null
var nullobject = null;
//명시적으로 값이 비어있음을 알려줄 때 사용
//null은 typeof로 확인이 안되며 아래와 같이 확인
console.log(nullobject === null);//-> true

console.log(typeof nullobject);//-> object


'프로그래밍 > JavaScript' 카테고리의 다른 글

객체 프로퍼티  (0) 2019.03.12
참조 타입 객체 생성  (0) 2019.03.12

+ Recent posts