코드스테이츠 2주차 / 객체

support·2021년 9월 5일
0
post-thumbnail

✏️Achievement Goals / 객체

✅ 배열과 객체의 구조를 이해하고 언제, 어떻게 사용하는지 이해할 수 있다.
✅ 배열과 객체의 특징을 구분하여 사용할 수 있다. (순서를 가진다, 의미를 가진다)
✅ 배열과 객체의 특징에 따라 실생활에서 언제 쓰는지 이해할 수 있다.
✅ 객체 속성(property)의 추가, 조회, 변경, 삭제를 자유자재로 할 수 있다.
✅ 객체 속성 조회법 두 가지, dot notation과 bracket notation의 차이를 이해한다.
객체 실습 - 2tweet.contenttweet['content']의 차이가 무엇인지 설명할 수 있다.
✅ dot notation을 이용한 객체 할당 방식을 능숙하게 다룰 수 있다. obj.a = "hello"
✅ 객체 속성 삭제를 위한 delete 키워드를 사용할 수 있다.
✅객체를 위한 for문 for ... in 문을 이해하고 다룰 수 있다.
✅ 배열과 객체, 반복문을 응용하여 능숙하게 대량의 정보를 다룰 수 있다.

📝summary

회원 주소록을 만든다고 가정할때
한사람에 대해 여러가지 정보가 들어가야 한다
한사람에 대한 정보인데 변수는 4개가 필요하고 또다른 사람을 추가하게 된다면 매번 4개의 변수를 더 설정해줘야 하는데
각 변수는 어떤 관계가 전혀 없이 이름으로 추측해서 구분할 수있을 뿐이다

    let userName1 = 'jiwon';
    let userName2 = 'lee';
    let email = 'jiwon@gmail.com'
    let city = 'seoul'

이때 배열을 사용하면?

    let user = [
    'jiwon',
    'lee',
    'jiwon@gmail.com',
    'seoul'
    ];

한사람에 대한 정보라는건 알수있지만 인덱스가 어떤 정보인지를
미리 알고 있어야 하고 인덱스로 접근할때 가독성도 떨어진다
이때 객체를 사용 할 수 있다

     let user = {
    	userName1 : 'jiwon',
    	userName2 : 'lee',
    	email : 'jiwon@gmail.com',
    	city : 'seoul'
    };
    	(key) : (value)
    - 키와 값의 사이는 콜론(:)으로 구분 
    - 중괄호를 이용해서 객체를 만듦
    - 키 와 값의 쌍은 쉼표로 구분

1 객체의 값 사용하는 방법

  1. Dot notation
    user. userName1;  // 'jiwon'
  1. Bracket notation
    user[ 'userName' ]; //  'jiwon'

    user[ 'city' ];  //  'seoul'

2 Bracket notation 오류

user[userName]; // 안에 string형태가 아니라 그냥 넣게 되면
content is not defined 오류가 뜬다 이건 안의 값을 변수로 본다는 뜻이다
변수로 지정하지 않은 name1 을 쓰게되면
name1 is not defined 가 뜨는데 위와 다른 걸 보면 알 수 있다

key 값이 변수일때 동적인 값을 담을 때 Bracket notation에
string형태가 아닌 그대로 써야한다

const user = {
  name: '짱구',
  age: 5,
};

function property(obj, propertyname){
	return obj[propertyname] // obj['name'] // 짱구
}

let output = Property(person, 'name');
console.log(output); // --> '짱구'

function property(obj, propertyname){
	return obj[propertyname] // obj['age'] // 16
}

let output = Property(person, 'age');
console.log(output); // --> 5

// 들어오는 값이 계속 바뀔때 obj[propertyname] 문자열 형식이 아니라
// 그대로 사용해주면 된다

3 dot / bracket notation 으로 값 추가, 삭제, 확인 가능

 let user = {
	userName1 : 'jiwon',
	userName2 : 'lee',
	email : 'jiwon@gmail.com',
};

추가 
user['city'] = 'seoul'; 
user.city = 'seoul';
user.city = ['#seoul', '#Yongsan-gu']

삭제 delete 연산자
delete user.city;

확인 in 연산자
'email' in user; // true

0개의 댓글