티스토리 뷰
안녕하세요. 동기 여러분! 오늘은 Object안에 선언된 Properties의 값(Key, Value)을 바꾸고 지우고 새로 만드는 방법에 대해 알아봅시다. 갑시다!
Property Assignment
Property 새로 추가하기
// JavaScript
let macaron = {
from : '이탈리아',
'유명해진곳' : '프랑스',
'들여온 사람' : '카트린 드 메디시스',
'주 재료' : '계란 흰자, 설탕, 아몬드 가루',
'제조 난이도' : '페이스트리의 끝판왕'
};
macaron.price = '보통 개당 2000원이 넘음';
macaron['맛'] = '첨가물에 따라 다양한 맛이 있음';
console.log(macaron);
/* 출력 : { from: '이탈리아',
'유명해진곳': '프랑스',
'들여온 사람': '카트린 드 메디시스',
'주 재료': '계란 흰자, 설탕, 아몬드 가루',
'제조 난이도': '페이스트리의 끝판왕',
price: '보통 개당 2000원이 넘음',
'맛': '첨가물에 따라 다양한 맛이 있음' } */
macaron.price = '보통 개당 2000원이 넘음';과 macaron['맛'] = '첨가물에 따라 다양한 맛이 있음';을 보면 저번시간에 배운 친구들이 나옵니다. Value값을 불러낼 때 쓰던 방법이었는데 Object내에 없는 Property로 불러내 주시면 새로운 Property가 생성됩니다.
Property 수정하기
//JavaScript
let macaron = {
from: '이탈리아',
'유명해진곳': '프랑스',
'들여온 사람': '카트린 드 메디시스',
'주 재료': '계란 흰자, 설탕, 아몬드 가루',
'제조 난이도': '페이스트리의 끝판왕',
price: '보통 개당 2000원이 넘음',
'맛': '첨가물에 따라 다양한 맛이 있음'
};
macaron.from = 'Italy'; // <- Value 값을 영어로 수정
macaron['유명해진곳'] = 'France';
console.log(macaron);
/* 출력 : { from: 'Italy',
'유명해진곳': 'France',
'들여온 사람': '카트린 드 메디시스',
'주 재료': '계란 흰자, 설탕, 아몬드 가루',
'제조 난이도': '페이스트리의 끝판왕',
price: '보통 개당 2000원이 넘음',
'맛': '첨가물에 따라 다양한 맛이 있음' } */
Key값이 from인 것과 '유명해진곳'에 Value를 모두 영어로 수정해보았습니다. 이처럼 Object내에 있는 Property는 새로운 Value값을 적어주시면 수정이 됩니다!
Property 삭제하기
//JavaScript
let macaron = {
from: '이탈리아',
'유명해진곳': '프랑스',
'들여온 사람': '카트린 드 메디시스',
'주 재료': '계란 흰자, 설탕, 아몬드 가루',
'제조 난이도': '페이스트리의 끝판왕',
price: '보통 개당 2000원이 넘음',
'맛': '첨가물에 따라 다양한 맛이 있음'
};
delete macaron.price; // <- delete 연산자 사용
delete macaron['제조 난이도'];
console.log(macaron);
/* 출력 : { from: '이탈리아',
'유명해진곳': '프랑스',
'들여온 사람': '카트린 드 메디시스',
'주 재료': '계란 흰자, 설탕, 아몬드 가루',
'맛': '첨가물에 따라 다양한 맛이 있음' } */
Property를 사용하기 위해서는 delete 연산자를 사용합니다. delete를 쓰고 한 칸 띄운 다음 Object.Property name 또는 Object[Property name]을 해주시면 됩니다.
오늘의 느낌
요즘 밥을 한끼에 150g(현미)만 먹고 저녁을 한 6시쯤 먹는데 새벽에 너무 배가 고파서 깸... 그래도 먹지 않고 꾹 참음ㅋㅋㅋ
'JavaScript' 카테고리의 다른 글
[JavaScript] Nested Objects (0) | 2021.10.20 |
---|---|
[JavaScript] Methods (0) | 2021.10.19 |
[JavaScript] Bracket Notation (0) | 2021.10.17 |
[JavaScript] Accessing Properties (0) | 2021.10.17 |
[JavaScript] Creating Object Literals (0) | 2021.10.16 |
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
TAG
- 동기코딩
- 타입스크립트
- 프로그래머스
- html
- 객체
- CSS 포지션
- css position
- 함수
- 파이썬
- padding
- Python
- em
- 실수
- javascript
- 메서드
- Object
- 타입 좁히기
- 자바스크립트
- CSS
- Type
- html table
- HTML 기본
- Typescript
- if문
- method
- 반복문
- Array
- for문
- Margin
- function
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
글 보관함