객체 (Object)

 객체형은 원시형과 달리 다양한 데이터를 담을 수 있다. 키로 구분된 데이터 집합이나 복잡한 개체(entity)를 저장하고 의미를 부여 할 때 쓰인다

리터럴,프로퍼티

중괄호 {...} 안에는 ‘키: 값’ 쌍으로 구성된 프로퍼티가 들어가며 중괄호 {...}를 이용해 객체를 선언하는 것을 객체 리터럴(object literal) 이라고 부른다,객체를 선언할 땐 주로 이 방법을 사용한다

 

let user = {     // 객체
  name: "sora",  // 키: "name",  값: "sora"
  age: 29        // 키: "age", 값: 29
};

객체 속성 접근자

1.점 표기법(Dot Notation)

 접근하려는 프로퍼티 이름을 문자열 형태로 지정해야 한다

속성이름을 키워드 또는 키워드를 포함한 내용을 사용했으면 반드시 대괄호 표기법을 사용 해야 한다

여러 단어를 조합해 프로퍼티 키를 만든 경우엔, 점 표기법을 사용해 프로퍼티 값을 읽을 수 없다

객체.key :   마침표( . )를 사용하여 프로퍼티에 접근하는 표기법

2.괄호 표기법(Bracket Notation)

객체['key'] :  대괄호[ ] 사이에 키의 값을 '문자열'로 넣어서 접근하는 표기법

★점표기법 ,괄호 표기법 차이

=>점 표기법 : 변수를 포함하지 못한다
let fruit = {
	apple: 'red',
	melon: 'blue',
};

let melon = 'green';			
let fruitColor = fruit.melon;			

console.log(fruitColor);=>/blue


=>괄호 표기법 : 변수를 포함할 수 있다
let fruit = {
	apple: 'red',
	melon: 'blue',
};

let melon = 'apple';			
let fruitColor = fruit[melon];			

console.log(fruitColor); =>red

속성 접근자, delete 연산자, in 연산자 등을 이용해서 객체에 대한 정보를 읽고 쓸 수 있다

 

 

const mylist = {
name: 'kimss',
age: 29,
like:fruits,meet
};

// 속성 읽기
mylist.name; // 'kimss'
mylist.age; // 29
mylist.like[0] // 'fruits'

// 속성 쓰기
mylist.name = 'hahaha';
mylist.age = 28;

// 새 속성 추가하기
mylist.address = '경기도 오산시';

// 속성 삭제하기
delete mylist.address;

// 속성이 객체에 존재하는지 확인하기
'name' in mylist; // true
'phoneNumber' in mylist; // false

자바스크립트 객체의 중요한 특징 중 하나는 다른 언어와는 달리, 존재하지 않는 프로퍼티에 접근하려 해도 에러가 발생하지 않고 undefined를 반환한다

연산자 in을 사용하면 프로퍼티 존재 여부를 확인할 수 있다

왼쪽엔 반드시 프로퍼티 이름이 와야하며, 프로퍼티 이름은 보통 따옴표로 감싼 문자열이 온다

따옴표를 생략하면 아래  엉뚱한 변수가 조사 대상이 된다

"key" in object

 

let user = {};
alert( user.noSuchProperty === undefined ); => true: '프로퍼티가 존재하지 않음'


let user = { name: "soso", age: 29};

console.log( "age" in user ); => user.age가 존재하므로 true가 출력
alert( "haha" in user ); => user.haha는 존재하지 않기 때문에 false가 출력

 in을 사용하면 프로퍼티 존재 여부를 제대로 판별 할수있다("=== undefined")은 가끔은 이 방법이 실패할 때도 있다 

for ...in 반복문

객체의 모든 키를 순회할 수 있다

for (key in object) {
  => 각 프로퍼티 키(key)를 이용하여 본문(body)을 실행
}

let user = {
  name: "soso",
  age: 29,
  color:blue
};

for (let key in user) {
  =>키
  console.log( key );  => name, age, color 키에 해당하는 값
 console.log( user[key] ); =>John, 30, blue
}

Object.keys()

Object.keys() 메소드는 주어진 객체의 속성 이름들을 일반적인 반복문과 동일한 순서로 순회되는 열거할 수 있는 배열로 반환한다

const object1 = {
  hi: 'somestring',
  bye: 42,
  call: false
};

console.log(Object.keys(object1));
=> expected output: Array ["hi", "bye", "call"]

Object.values()

Object.values() 메소드는 전달된 파라미터 객체가 가지는 (열거 가능한) 속성의 값들로 이루어진 배열을 리턴  배열은 for...in 구문과 동일한 순서를 가진다 (for in 반복문은 프로토타입 체인 또한 열거한다는 점에서 차이가 있다)

 

const object1 = {
  a: 'somestring',
  b: 12345,
  c: false
};

console.log(Object.values(object1));
// expected output: Array ["somestring", 12345, false]

Object.assign()

처 객체들의 속성을 복사해 대상 객체에 붙여넣어 반환한다

객체들의 모든 열거 가능한 자체 속성을 복사해 대상 객체에 붙여넣습니다. 그 후 대상 객체를 반환한다

깊은 복사가 이루어진다

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };

const returnedTarget = Object.assign(target, source);

console.log(target);
//  Object { a: 1, b: 4, c: 5 }

console.log(returnedTarget);
//Object { a: 1, b: 4, c: 5 }
console.log(source)
//Object { b: 4, c: 5 }