let user = { // 객체
name: "John", // 키: "name", 값: "John"
age: 30 // 키: "age", 값: 30
};
키가 변수처럼 사용되었지만, 실제로는 String 타입으로 저장된다.
const player = {
name : "dain",
points : 10,
student : false
}
console.log(player.name);
console.log(player["name"]);
player.name = "kimdain" // const로 선언되었지만, player의 자체를 변경하지 않고서는 안의 속성은 변경가능하다.
객체 비구조화 할당
: 객체에서 값들을 추출해서 새로운 상수로 선언해 주는 것
const captainAmerica = {
name: '스티븐 로저스',
actor: '크리스 에반스',
alias: '캡틴 아메리카'
};
function print(hero) {
const { alias, name, actor } = hero;
const text = `${alias}(${name}) 역할을 맡은 배우는 ${actor} 입니다.`;
console.log(text);
}
print(captainAmerica);
코드가 객체에서 값들을 추출해서 새로운 상수로 선언
const { alias, name, actor } = hero;
여기서 더 나아가면, 파라미터 단계에서 객체 비구조화 할당을 할 수도 있습니다.
function print({ alias, name, actor }) {
const text = `${alias}(${name}) 역할을 맡은 배우는 ${actor} 입니다.`;
console.log(text);
}
비구조화 할당 시 기본값 설정
const object = { a: 1 };
function print({ a, b = 2 }) {
console.log(a);
console.log(b);
}
print(object);
// 1
// 2
const object = { a: 1 };
const { a, b = 2 } = object;
console.log(a); // 1
console.log(b); // 2
비구조화 할당 시 이름 바꾸기
const animal = {
name: '멍멍이',
type: '개'
};
const nickname = animal.name;
console.log(nickname); // 멍멍이
위 코드를 아래와 같이 변경할 수 있습니다.
const { name: nickname } = animal
위 코드는 'animal 객체 안에 있는 name 을 nickname 이라고 선언하겠다.' 라는 의미입니다.
객체 생성자
function Animal(type, name, sound) {
this.type = type;
this.name = name;
this.sound = sound;
this.say = function() {
console.log(this.sound);
};
}
const dog = new Animal('개', '멍멍이', '멍멍');
키에 변수 선언
const key = 'Mickey Mouse'
const value = 'Happy'
const disneyCharacter = {
[key]: value,
}
console.log(disneyCharacter)
단축 프로퍼티
프로퍼티 값을 기존 변수에서 받아와 사용하는 경우
let user = {
name, // name: name 과 같음
age: 30
};
반응형
'TIL > Javascript' 카테고리의 다른 글
연산자 (0) | 2022.07.12 |
---|---|
함수 (0) | 2022.07.11 |
옵셔널 체이닝 ‘?.’ (0) | 2022.07.08 |
배열 (0) | 2022.07.05 |
변수 (0) | 2022.07.05 |
댓글