객체 기초

태로샐러드·2021년 7월 9일
0

javascript 기초

목록 보기
5/22
post-thumbnail
post-custom-banner

🍫 객체

  • 키(key)value(값)으로 이루어진 형태 (key-value pair)
  • 값은 서로 다르지만 데이터의 종류가 같을때 사용
  • 중괄호(curly bracket)으로 객체 생성
  • key와 value는 콜론(:)으로 구분
  • 각 key-value pair는 쉼표(,)로 구분
let user = {
  firstName: 'taero',
  lastName: 'Kim',
  city: 'Seoul'
};

🍫 객체의 값 사용 : Dot notation

  • 변수를 포함할 수 없다. ★★★★★
  • property 식별자는 오직 알파벳만 가능(_ & $ 포함)
  • prperty 식별자는 숫자로 시작할 수 없음.
let user = {
  firstName: 'taero',
  lastName: 'Kim',
  city: 'Seoul'
};

user.firstName; // 'taero'
user.lastName; // 'Kim'
user.city; // 'Seoul'

🍫 객체의 값 사용 : Bracket notation

  • 변수, 공백 사용 가능 ★★★★★
  • property 식별자는 문자열 혹은 문자열을 참조하는 변수
  • property 식별자는 숫자로 시작할 수 있음.
let user = {
  firstName: 'taero',
  lastName: 'Kim',
  city: 'Seoul'
};

user['firstName']; // 'taero'
user['lastName']; // 'Kim'
user['city']; // 'Seoul'

🍫 객체 값 추가

let user = {
  firstName: 'taero',
  lastName: 'Kim',
  city: 'Seoul'
};

user['hobby'] = 'drinking';  // bracket notation으로 key-value pair 추가
user.isPublic = true; // dot notation으로 boolean type 추가
user['tags']; = ['#hi', '#hello']; // 배열도 추가 가능

user ; //
{
  firstName: 'taero',
  lastName: 'Kim',
  city: 'Seoul',
  hobby: 'drinking',
  isPublic: true,
  tags: ['#hi', '#hello']
};

🍫 객체 값 삭제

let user = {
  firstName: 'taero',
  lastName: 'Kim',
  city: 'Seoul'
}; 

delete user.city;

user; //
{
  firstName: 'taero',
  lastName: 'Kim',
};

🍫 키가 있는지 확인

let user = {
  firstName: 'taero',
  lastName: 'Kim',
  city: 'Seoul'
};

'firstName' in user; // true
'tags' in user; // false

🍫 for in문

  • for 변수(key) in 객체
  • 해당 객체의 모든 열거할 수 있는 프로퍼티(key)를 순회할 수 있음.
let user = {
  firstName: 'taero',
  lastName: 'Kim',
  city: 'Seoul'
};

for(let k in user) {
  console.log(k+"###"+user[k]);
}
// firstName###taero
// lastName###Kim
// city###Seoul
profile
기획, 개발공부, 그 외 잡다한 여정 기록 (SEMI로)
post-custom-banner

0개의 댓글