Section 1 / Unit8 : [JavaScript] 객체

코드스테이츠 수업 12일차!
오늘 배운 객체 간단 개념과 코플릿 풀면서 몰랐었던 속성들을 정리해보자

 

객체

• 키, 값 쌍으로 이루어져 있음
• 키, 값 사이는 콜론(:)으로 구분
• 객체를 사용하는 두가지 방법
  ->Dot notation
  ->Bracket notation

let user = {
	name: 'yeeendy',
	city: 'Seoul',
}

//Dot notation
user.name;  //'yeeendy'
//Bracket notation
user['city'];  //'Seoul'

• dot/bracket notation을 통해 값을 추가할 수 있음

let user = {
	name: 'yeeendy',
	city: 'Seoul',
}

user['category'] = '공부';
user.isPublic = true;
user.tags = ['#코딩', '#화이팅']

• delete를 이용해 키, 값 쌍을 삭제할 수 있음

let user = {
	name: 'yeeendy',
	city: 'Seoul',
}

delete user.name;
/*
let user = {
	city: 'Seoul',
}
*/

• in을 이용해 해당하는 키가 있는 지 알 수 있음

let user = {
	name: 'yeeendy',
	city: 'Seoul',
}

'name' in user;  //true
'age' in user;  //false

 

---

for in 반복문

• 상속된 열거 가능한 속성들을 포함하여 객체에서 문자열로 키가 지정된 모든 열거 가능한 속성에 대해 반복

const object = { a: 1, b: 2, c: 3 };

for (const property in object) {
  console.log(`${property}: ${object[property]}`);
}

// Expected output:
// "a: 1"
// "b: 2"
// "c: 3"

 

Object.keys( ).length

• 객체의 길이를 잴 수 있는 메소드

12번 코플릿 문제를

function countNumberOfKeys(obj) {
  // TODO: 여기에 코드를 작성합니다.
  let count = 0;
  for (let value in obj) {
    count++;
  }
  return count;
}

이렇게 작성했는데

function countNumberOfKeys(obj) {
  return Object.keys(obj).length;
}

더 간결하게 표현할 수 있었다.

 

자바스크립트에서 공백을 제거하는 방법으로 3가지

• trim( )
  →string.trim( )은 문자열의 공백을 제거
  →문자열 왼쪽, 오른쪽 공백 모두 제거
  →trimStart( )
  →문자열 왼쪽 공백 제거
  →trimEnd( )
  →문자열 오른쪽 공백 제거
  
  
• replace( )
  →정규표현식 replace(regex, str)
  →replace(/ /g, ' ')
  →문자열의 모든 공백을 찾는다, 찾은 공백은 ' '으로 변환하여 제거
  →replace(/ ^ +/, ' ')
  →^ : 문자열의 시작, + : 1개 이상의 공백
  →문자열 왼쪽에 있는 공백만 찾음
  →replace(/ +$ /, ' ')
  →$ : 문자열의 시작 + : 1개 이상의 공백
  →문자열 오른쪽에 있는 공백만 찾음
  
  
• split( )과 join( )
  →split(' ')으로 공백을 기준으로 문자열을 분리하고
  →join(' ')으로 분리된 문자열을 공백 없이 합침

let str = "  Hello, World, JavaScript  ";

let result = str.split(' ').join('');
console.log("[" + result + "]");

//output
[Hello,World,JavaScript]