자바 스크립트의 객체

  객체

자바스크립트는 객체 기반의 언어이며, 객체는 기능과 속성을 가진다. 또한 변수에 메모리를 할당하면 객체가 된다. 직접 자료형 타입에 맞춰 객체를 생성할 수 있고 속성도 생성할수 있다.

 

 1) 객체.메서드(); - 객체의 메서드를 실행한다.

 2) 객체.속성; - 객체의 속성값을 가져온다. 

 3) 객체.속성=값; - 객체의 속성값을 변경한다.

 

▶ 객체란?

1. 자바스크립트 객체는 {} 형태로 선언이 가능하다.

2. 자바스크립트의 객체의 속성은 {키:값} 으로 이루어진다.

3. 객체의 값에는 함수, 객체, 배열, 문자열, 숫자 등 모든 데이터를 포함 할 수 있다

4. 객체의 속성은(속성의 값 기준) 데이터 값을 이야기 하며, 메소드는 속성이 함수 일 때 이야기 한다.

 

- 기본 자료형 혹은 내장 객체의 값으로 변수 생성 후 데이터 삽입시 해당 자료형으로 활용할수 있는 메소드, 속성이 생성된다.

- 객체를 object라고 표현한다.

- 객체의 메서드와 속성을 사용하는 기본형

 

▶ 개발자가 직접 객체 생성하기

 

 

객체는 키와 값으로 이루어져 있다.

객체의 값은 문자, 숫자, 배열, 객체, 함수 등 모든것을 포함 할 수 있다.

배열 안의 데이터를 접근하기 위해서는 객체이름.데이터로 접근한다.

 

객체에 데이터 값을 추가할때는 ,로 구별한다.

외부에서 객체 내의 배열에 값을 삽입 및 속성값 변경을 할 수 있다.

객체 내의 데이터(속성) 내의 속성이 존재 할 수 있다.

또, 그 속성에 접근하기 위해선 상위 속성에 먼저 접근하여야 한다.

  this 키워드

 

객체 내의 메서드에서 this 키워드로 해당 객체의 데이터에 접근이 가능하다.

객체 obj의 속성과 메소드가 있다.

객체 obj 내부의 함수(메소드)에서 obj의 속성에 접근 할 때 this라는 키워드를 사용하여 접근 할 수 있다.

위같이 obj의 속성에 접근한 후 속성값 변경도 가능하다. 이러한 속성값 변경은 obj.myFn()인 메소드 호출을 해야 변경이 된다.

  객체 생성자 함수

자바에서는 new 연산자 사용하여 배열을 선언할 수 있다.

자바스크립트에서도 new 연산자로 함수를 객체화 할수도 있다.

 

객체 생성자 함수는 new 연산자를 통하여 메모리를 생성하여 활용한다.

또한 함수 내에 this라는 키워드도 활용 가능하다.

 

<!> 중요

this 라는 키워드로 속성 및 메서드 작업시 외부에서 접근이 가능하다.

this 키워드 없이 함수의 작업이다. 함수 내부에서 var라는 키워드로 변수 선언시 외부에서 접근 할 수 없다.

new 연산자를 통하여 메모리 할당시 객체(object) 형태로 메모리 할당하였다.

this 키워드로 변수 선언시 new 연산자로 함수 선언 되었을시 외부에서 접근이 가능하다.

 

더 나아가 this 키워드를 활용해보자.

var 키워드로 선언한 값은 외부에서 접근하지 못하지만, 함수 내부에서 전역변수 var name에 접근이 가능하기 때문에,  외부에서 접근 가능한 this 키워드로 var name에 접근하여 this키워드로 선언한 함수를 외부에서 불러오면 var name에 접근이 가능하다.

var myFn = function(){
    var name = '설리카';
    this.age = 25;
    this.fn = function(){
    	console.log('fn');
    }
    this.setName = function(changeName){
        name = changeName
    }
    this.getName = function(){
        return name;
    }
}
var my = new myFn();

  Prototype

var myFn = function(){
    this.age = 25;
}
var my = new myFn();
myFn.prototype.setAge = function(changeAge){
    this.age = changeAge;
}
myFn.prototype.getAge = function(){
    return this.age;
}

프로토 타입을 사용하여 등록한 함수는 객체 생성자 함수에서 생성된 객체를 공유할수있다.

즉,여러개의 함수를 등록할 필요가 없어 메모리 낭비를 줄일수 있다.