-
[위코드 35기] 객체프론트엔드 개발자가 될거야./js 2022. 6. 13. 16:32
객체란 무엇일까?
자바스크립트 데이터 타입 중의 하나이다.
key값과 value값을 쌍으로 이루고 있고 배열과는 다르게 순서가 중요하지 않다.Object Literal
객체를 만드는 방법은 여러가지이지만 그 중 중괄호를 이용해 만드는 방식이다.
let person1 = { name: '곽철용', bloodType: 'AB형', mbti: 'ENFP', favoriteCoffee: '바닐라라떼' }
객체가 필요한 이유
배열은 index number를 기억해야하지만
객체는 원하는 정보의 key값만 알면 정보에 접근할 수 있다.- 배열과 객체의 차이점
또한 배열은 순서가 중요하지만
객체는 객체에 넣은 순서대로 프로퍼티가 출력되지 않는다.
즉, index 순서가 없다.
객체 속성 접근
1. 점 표기법 👀 Dot Notation
object.name
2. 대괄호 표기법 👀 Bracket Notation
object.['name'] // key들이 string이기 떼문에 '' 사용
🌟 변수를 사용한 객체 속성 접근은 대괄호 표기법만 가능하다 ! 🌟
객체 속성 삭제 delete
delete ourDog.bark;
객체 안의 객체 접근
function accessObject() { let myStorage = { "car": { "inside": { "glove box": "maps", "passenger seat": "crumbs" }, "outside": { "trunk": "jack" } } }; let gloveBoxContents = myStorage.car.inside['glove box']; // 이렇게 접근하면 된다! return gloveBoxContents; --> maps }
객체 안의 배열 접근
function accessArray() { let myPlants = [ { type: "flowers", list: [ "rose", "tulip", "dandelion" ] }, { type: "trees", list: [ "fir", "pine", "birch" ] } ]; let foundValue = myPlants[1].list[1]; // 이렇게 접근하면 된다! return foundValue; --> pine }
'프론트엔드 개발자가 될거야. > js' 카테고리의 다른 글
자바스크립트 라이브러리 정리 (0) 2022.06.13 나의 첫번째 웹사이트 수정편 (0) 2022.06.13 자바스크립트 타이핑 효과 (0) 2022.06.13 [위코드 35기]배열과 반복문 (0) 2022.06.13 [위코드 35기]배열의 메서드 (0) 2022.06.13 - 배열과 객체의 차이점