[Javascript]01-2. 자바스크립트 참조타입

Elen li·2021년 10월 26일
0
post-thumbnail

1. 참조 타입 (객체 타입)

  • 자바스크립트에서 객체는 단순히 ‘이름(key):값(value)’ 형태의 프로퍼티들을 저장하는 컨테이너로서, 컴퓨터 공학에서는 해시(Hash)라는 자료구조와 유사합니다.
  • 참조 타입인 객체는 여러개의 프로퍼티들을 포함할 수 있습니다.
  • 객체의 프로퍼티는 기본 타입의 값을 포함하거나, 다른 객체를 가리킬 수도 있습니다.
  • 객체의 프로퍼티는 함수로 포함할 수 있으며, 자바스크립트에서는 이러한 프로퍼티를 메서드라고 부릅니다.

1.1.1 객체 생성

  • 자바와는 달리 클래스라는 개념이 없고, 객체 리터럴이나 생성자 함수 등 별도의 생성 방식이 존재합니다.

객체 생성방식

  • 기본 제공 Object() 객체 생성자 함수를 이용하는 방법
  • 객체 리터럴을 이용하는 방법
  • 생성자 함수를 이용하는 방법

1. Obejct() 생성자 함수 이용

var foo = new Object();

foo.name = 'foo';
foo.age = 30;
foo.gender = 'male';

console.log(typeof foo);
console.log(foo);

//출력값
object
{ name : ‘foo’, age : 30, gender: ‘male’ }

2. 객체 리터럴 방식 이용

  • 리터럴 = 표기법: 중괄호 사용 ({})
  • 간단한 표기법만으로도 객체를 생성할 수 있는 자바스크립트의 강력한 문법입니다.
  • 중괄호 ({}) 안에 “프로퍼티 이름”:”프로퍼티 값” 형태로 표기하면, 해당 프로퍼티가 추가된 객체를 생성할 수 있습니다.
  • 프로퍼티 이름: 문자열, 숫자열 가능
  • 프로퍼티 값: 자바스트립의 값을 나타내는 어떤 표현식도 모두 가능
    • 프로퍼티 값이 함수일 경우 메소드라고 부름
//리터럴 방식
var foo = {
  name: 'foo',
  age: 30,
  gender: 'male'
};

console.log(typeof foo);
console.log(foo);

//출력값
object
{ name : ‘foo’, age : 30, gender: ‘male’ }

3. 생성자 함수 이용

이 내용은 뒤에서 다루겠습니다.

객체 프로퍼티 읽기/쓰기/갱신

  • 객체는 새로운 값을 가진 프로퍼티를 생성하고, 생성된 프로퍼티에 접근해서 해당 값을 읽거나 또는 원하는 값으로 프로퍼티의 값을 갱신할 수 있습니다.
  • 접근 방법
    • 대괄호 ([]) 방법
    • 마침표 (.) 방법

var foo = {
  name : 'foo',
  major: 'computer science'
};

console.log(foo.name);
console.log(foo['name']);
console.log(foo.nickname);

//객체 프로퍼티 갱신
foo.major = 'electronics engineering';
console.log(foo.major);
console.log(foo['major']);

//객체 프로퍼티 동적 생성
foo.age = 30;
console.log(foo);
console.log(foo.age);

//대괄호 표기법만을 사용해야 할 경우
foo['full-name'] = 'foo bar';
console.log(foo);
console.log(foo['full-name']);
// console.log(foo.full-name);
console.log(foo.full);
// console.log(name);

for in 문과 객체 프로퍼티 출력

//객체 리터럴을 통한 foo 객체 생성
var foo = {
  name: 'foo',
  age: 30,
  major: 'computer science'
};

// for in문을 이용한 개체 프로퍼티 출력
var prop;
for (prop in foo) {
  console.log(prop, foo[prop]);
}

// 출력문
name foo
age 30
major computer science

객체 프로퍼티 삭제

  • 객체의 프로퍼티를 delete 연산자를 이용해 즉시 삭제할 수 있습니다.
  • 객체의 프로퍼티만 삭제할 뿐, 객체 자체를 삭제하지는 못합니다.

//객체 프로퍼티 삭제
var foo = {
  name: 'foo',
  nickname: 'babo'
};

console.log(foo.nickname);
delete foo.nickname;
console.log(foo.nickname);

delete foo;
console.log(foo.name);

// 출력값
name foo
age 30
major computer science
profile
Android, Flutter 앱 개발자입니다.

0개의 댓글