[javascript] 객체(object)

👋 들어가기전

• javascript 전반적인 지식을 다음 페이지에 모아두고 있습니다. 필요시 확인하세요~

2022.08.24 - [javascripts/javascripts(typescript + ES6)] - [javascript] 다수의 링크

[javascript] 다수의 링크

 

🚨 급한사람!!  이거만 보세요

• 객체(object): 키와 값으로 구성된 프로퍼티들의 집합, 여러속성의 모음을 저장(파이썬의 딕셔너리와 비슷), 함수도 넣을 수 있음
  • 객체를 생성할 때는 const로 생성하도록 하자, const로 생성해도 내부 데이터를 변경할 수 있다. 
• 프로퍼티(property): 프로퍼티는 프로퍼티 키와 프로퍼티 값으로 구성된다.
  • 프로퍼티 키: 문자열 또는 symbol 값 - 숫자를 넣을 경우 암묵적으로 문자열로 변환됨
  • 프로퍼티 값: 모든값(함수; 메소드, 원시값, 객체 등)
• 객체 생성
  • 빈 객체 생성 1: const student = new object();
  • 🌟빈 객체 생성 2: const student = {}; // 객체 리터럴(object literal)
• 객체 새로운 값 추가 및 갱신
  • 키가 없으면 추가, 이미 존재할 경우 갱신한다.
  • 새로운 속성 추가: student.name = '이난';
• 객체 프로퍼티 키 접근
  • 값 출력 1: console.log(student.name)
  • 값 출력 2: console.log(student['name'])
• 프로퍼티 삭제
  • delete 연산자를 사용하면 삭제할 수 있다.
  • delete student.name

 

1. 자바스크립트 객체(object) 순회

• for in 문법을 통해 객체를 순회할 수 있다.

const student = {
	'name' : 'inan',
	'age' : 27
};

for (const value in student){
	console.log(value + ': ' + student[value]);
}

 

2. 객체(object) 복사

• 객체의 복사는 원시타입 복사와 달리 참조방식이 사용된다.
  • 따라서 복사된 객체의 값 변경 시 원본의 값도 변경된다.

const student = {
	'name' : 'inan',
	'age' : 27
};

const student2 = student;
student2.name = 'inan2'

console.log(student); // { name: 'inan2', age: 27 }
console.log(student2); // { name: 'inan2', age: 27 }

console.log(student == student2); // true
console.log(student === student2); // true

• 참조가 아닌 복사본을 만들기 위해서는 assign()를 사용한다.

const student = {
	'name' : 'inan',
	'age' : 27
};

const student2 = Object.assign({}, student);
student2.name = 'inan2'

console.log(student); // { name: 'inan', age: 27 }
console.log(student2); // { name: 'inan2', age: 27 }

console.log(student == student2); // true
console.log(student === student2); // true