자바스크립트 객체

이소미·2020년 5월 9일
0

자바스크립트 객체(object)

객체란

객체는 프로퍼티의 모음이며, 프로퍼티는 이름(name 또는 key)과 (value)의 연결로 이루어진다 .

프로퍼티 생성

//case 1. myCar 라는 이름의 객체를 생성하고, make/model/year 라는 프로퍼티 추가
var myCar = new Object();
myCar.make = "Ford";
myCar.model = "Mustang";
myCar.year = 1969;
//case 2. myCar 라는 이름의 변수에 make/model/year 라는 프로퍼티를 가진 object 할당
var myCar = {
    make:"Ford",
    model:"Mustang",
    year:1969
}
//case other. myCar 라는 이름의 객체를 생성하고, 대괄호를 이용한 표기법으로 프로퍼티 추가
var myCar = new Object();
var str = "keyName";
myCar["date created"]   = "String with space"; //빈칸을 포함한 프로퍼티도 가능
myCar[str]              = "String value"; //변수도 가능
myCar[""]               = "Even an empty string"; //빈문자열도 가능
  • 대괄호를 이용한 표기법은 자바스크립트 식별자로 적합하지 않을 경우 또는 프로퍼티 이름이 런타임 시점에 결정되는 경우에 사용할 수 있음을 참고하자.(생성뿐만 아니라 접근도 마찬가지!)

프로퍼티 접근

var myCar = {
    make:"Ford",
    model:"Mustang",
    year:1969
}

//case 1. Dot notation(도트 표기법)
myCar.make; //'Ford'

//case 2. Bracket notation(대괄호 표기법)
myCar['make']; //'Ford'

프로퍼티 나열(ECMAScript 5 기준)

var myCar = {
    make:"Ford",
    model:"Mustang",
    year:1969
}

// for...in - 루프객체에 열거 가능한 모든 프로퍼티 순회
for(key in myCar){
    //console.log(myCar.key); //error는 아니지만, 결과가 undefined로 보여짐
    console.log(myCar[key]); //key 는 변수이므로 대괄호를 이용한 표기법 사용
}
  • 실행결과
Ford
Mustang
1969

프로퍼티 삭제

// 새 객체 myobj를 두 개의 속성 a, b 와 함께 생성
var myobj = new Object;
myobj.a = 5;
myobj.b = 12;

// 속성을 삭제. myobj 에는 속성 b 만 남게 됨.
delete myobj.a;
console.log ("a" in myobj) // "false"

*in 연산자를 사용해서 해당키가 있는지 확인

참고사이트
- MDN web docs

profile
웹개발자

0개의 댓글