JavaScript 객체

객체

중괄호 curly brakcet {} 이용
키-값 쌍으로 이루어짐(key - value pair)
키-값 쌍은 쉼표 , 로 구분
키에는 문자열만 할당 가능하고, 값에는 문자, 숫자, 배열, 객체, 함수 할당 가능 => 따라서 충분히 값에 접근이 가능하다.

let obj = { 
  key1 : value1 , 
  key2 : vlaue2 , 
  			... , 
  			...
};

📌 객체의 값 사용하기

let tweet = {
	writer : 'Steve',
  	createdAt : '2019-09-10 12:03:33',
  	content : '프리코스 재밌어요!'
};

1. Dot notation .

	console.log(tweet.writer); //'Steve'
	console.log(tweet.createdAt); //'2019-09-10 12:03:33'
	console.log(tweet.content); //'프리코스 재밌어요!'

2. Bracket notation [''][""][``]

	console.log(tweet['writer']); //'Steve'
	console.log(tweet['createdAt']); //'2019-09-10 12:03:33'
	console.log(tweet['content']); //'프리코스 재밌어요!'

📌 객체 속성 및 메소드

1. object['property'] = 'value' / object.property = 'value' 객체에 property와 value 추가
2. delete object['property']/object.property 객체의 해당 property 삭제
3. for ... in 이용하여 객체의 모든 key 나 value 순회가능

	let obj = {
      'name' : 'Steve',
      'age' : 17,
      'town' : 'Seoul'
    };
	for(let key in obj){
      console.log(`${key} : ${obj[key]}`);
    }
	/*
    name : Steve
    age : 17
    town : Seoul
    */

4. object.length = undefined 객체의 길이는 연속적이지 않기 때문에 알 수 없음
   따라서 길이를 잴 수 있는 다른 방법이 존재함!
   Object.keys(object) 해당 객체의 열거 가능한 모든 key들의 집합 반환
   Object.values(object) 해당 객체의 열거 가능한 모든 value들의 배열 반환
   Object.enteries(object) 해당 객체의 열거 가능한 문자열 키를 가진 [key, value] 쌍의 배열 반환

	Object.keys(obj); // ['name', 'age', 'town']
	Object.values(obj); // ['Steve', 17, 'Seoul']
	Object.entries(obj); // [['name', 'Steve'], ['age', 17], 'town', 'Seoul']

	for(const [key, value] of Object.entries(obj)){
  	//Object.entries(obj) 는 반환값이 일종의 배열이기 때문에 for ... of 문 사용가능
  		console.log(`${key}: ${value}`);
		/*
    	name : Steve
    	age : 17
    	town : Seoul
    	*/
	}

5. 속성 in 객체 해당 속성이 객체 안에 존재하는지에 대한 여부로 true, false 반환

6. object.hasOwnProperty(property)
Object.hasOwn(object, property)
   객체가 속성을 가지는 지의 여부에 대해 true, false 반환

7. Object.is(object1, object2) 두 객체가 같은지 비교하여 true, false 반환

	Object.is({}, {}) ;//false 참조 자료형이기 때문에 주소를 비교하는 것이므로 같지 않음

8. Object.assign(target, ...sources)
   출처 객체들의 모든 열거가능한 자체 속성을 (얕은)복사하여 대상 객체에 붙여넣기. 이는 reference variable 이므로 주소만 복사한다.
   동일한 키를 갖는 속성일 경우, 그 속성값은 출처 객체의 속성 값으로 덮어씀. 출처 객체들의 속성 중에서도 중복키가 존재할 경우 뒤쪽 객체의 속성값으로 덮어씀.
   - target : 목표 객체. 출처 객체의 속성을 복사해 반영한 후 반환할 객체
   - sources : 출처 객체. 목표 객체에 반영하고자 하는 속성들을 갖고 있는 객체들

   📍 관련된 얕은 복사(shallow copy)와 깊은 복사(deep copy)

   https://scotch.io/bar-talk/copying-objects-in-javascript
   https://medium.com/watcha/깊은-복사와-얕은-복사에-대한-심도있는-이야기-2f7d797e008a

9. 객체를 이용한 map 과 filter
   filter 와 map은 배열 메소드이기 때문에 Object.entries(object)를 이용하면 좋다

let result = Object.entries(obj); //{'name':'Steve', 'age':17, 'town':'Seoul'}
result.map(el =>  typeof el[1] === 'number);

---

📌 코플릿 회고

19.
function extend(obj1, obj2){
  //두 개의 객체를 입력을 받아 두번째 객체의 속성들을 첫번째 객체에 추가
  //추가하려는 속성이 이미 첫번째 속성에 존재하는 경우, 기존 값 유지
  //두번째 객체는 수정하지 않아야 함
  for(let key in obj2){
    obj1[key] = (obj1[key] || obj2[key]);
    //if(!(key in obj1)) obj1[key] = obj2[key];
  }
  //obj2 객체의 key들을 순회하면서 존재한다면 기존값 유지 , 존재하지 않다면 obj2[key] => || 를 사용

20.
function countAllCharacters(str){
  //문자열을 입력받아 문자열을 구성하는 각 문자를 키로 갖는 객체를 리턴 (number타입)
  let result = {};//새로운 객체에 '각 문자':횟수'
  let letters = str.split('');//각 문자를 구분
  for(let letter of letters){
    result[letter] = (result[letter] || 0) + 1;
    // 객체 내 값이 존재한다면 1을 추가하고 그렇지 않다면 0에서 1을 추가한 1로 만들어준다.
    /*
    if(letter in answer) answer[letter] +=1;
    else answer[letter] = 0;
    */
  }

21.
function countAllCharacters(str){
  //문자열을 입력받아 문자열을 구성하는 각 문자를 키로 갖는 객체 중 가장 많이 반복되는 문자를 리턴 (string 타입)
  let obj = {};//새로운 객체에 '각 문자':횟수'
  let max = 0; //반복되는 횟수
  let result = ''; // 가장 많이 반복되는 문자열
  for(let char of str){
    if(char === ' ') continue;
    obj[char] = (obj[char] || 0) + 1;
    if(obj[char] > max){
      max = obj[char];
      result = char;
    }
  }
  return result;
}