속성은 JS 객체 중에 가장 중요한 내용이다.
속성은 JS 객체의 값에 관련된 것이다.
JS 객체는 명령되지 않은 속성의 집합이다.
속성은 대개 변하고, 더해지고, 삭제될 수 있고, 몇몇은 읽혀지기만 한다.
객체의 속석에 접근하는 문법:
objectName.property // person.age
or
objectName["property"] // person["age"]
or
objectName[expression] // x = "age"; person[x]
expression(표현)은 속성의 이름으료 표시해야한다.
Example 1
person.firstname + " is " + person.age + " years old.";
Example 2
person["firstname"] + " is " + person["age"] + " years old.";
객체의 속성을 사용한 JS for...in
반복문
Syntax
for (let variable in object) {
// code to be excuted
}
for...in
반복문의 내부 코드 블록은 각 속성 마다 한번 씩 실행 될 것이다.
const person = {
fname:" John",
lname:" Doe",
age: 25
};
for (let x in person) {
txt += person[x];
}
이미 존재하는 객체에 간단한 값 입력으로 새로운 속성을 추가할 수 있다.
delete
키워드로 객체에서 속성을 지운다.
const person = {
firstName: "John",
lastName: "Doe",
age: 50,
eyeColor: "blue"
};
delete person.age;
or delete person["age"]
const person = {
firstName: "John",
lastName: "Doe",
age: 50,
eyeColor: "blue"
};
delete person["age"];
delete
키워드는 속성 본인과 속성의 값 모두 삭제한다.
삭제 후, 속성은 다시 사용이 불가하다.
delete
수행은 객체 속성에 사용 되도록 설계되었다. 그렇기에 함수나 변수에는 아무런 효과가 없다.
delete
수행은 미리 정의된 JS 객체 속성에 사용 될 수 없다. 사용 시 사용자의 프로그램에 문제를 일으킬 것이다.
객체 안에 객체 입력 가능
myObj = {
name:"John",
age:30,
cars: {
car1:"Ford",
car2:"BMW",
car3:"Fiat"
}
}
.
(dot) 혹은 [ ]
(bracket) 표기법으로 객체안의 객체에 접근 가능하다.
myObj.cars.car2;
or
myObj.cars["car2"];
or
myObj["cars"]["car2"];
or
let p1 = "cars";
let p2 = "car2";
myObj[p1][p2];
객체안에 배열을 값으로 가질 수 있다. 또한, 배열안의 값도 객체가 될 수 있다.
const myObj = {
name: "John",
age: 30,
cars: [
{name:"Ford", models:["Fiesta", "Focus", "Mustang"]},
{name:"BMW", models:["320", "X3", "X5"]},
{name:"Fiat", models:["500", "Panda"]}
]
}
배열 안의 배열에 접근하려면, for-in
반복문으로 각 배열에 접근이 가능하다.
for (let i in myObj.cars) {
x += "<h1>" + myObj.cars[i].name + "</h1>";
for (let j in myObj.cars[i].models) {
x += myObj.cars[i].models[j];
}
}
모든 속성에는 이름이 있다. 또한 속성은 값을 가지고 있다.
값은 속성의 속성 중 하나이다.(property's attributes)
다른 속성(attributes)은 열거 가능, 구성 가능 및 쓰기 가능이다.
이러한 속성(attributes)은 속성(property)에 접근하는 방법을 정의한다.(읽을 수 있는가?, 쓸 수 있는가?)
JS에서는 모든 속성(attributes)는 읽힐 수 있지만, 값 속성(value attribute)만 변경 될 수 있다. (속성(property)이 쓰기 가능한 경우에만)
(ECMAScript 5에는 모든 속성 속성을 가져오고 설정하는 메서드가 있다.)
JS 객체는 프로토타입의 속성을 상속한다.
delete
키워드는 상속된 속성(properties)을 삭제하지 않지만 프로토타입 속성을 삭제하면 프로토타입에서 상속된 모든 객체에 영향을 미친다.