Notice
Recent Posts
Recent Comments
Link
«   2024/05   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
Tags
more
Archives
Today
Total
관리 메뉴

coding etude

200808 [객체지향 프로그램] 본문

Javascript TIL

200808 [객체지향 프로그램]

코코리니 2020. 8. 8. 02:04

[객체 지향 프로그램 Javascript]


 : 객체란(Object) 물리적으로 존재하거나 추상적으로 생각할 수 있는 것

중에서 속성(property)을 가지고 있으면서 식별이 가능한 것을 말합니다. 예를들어 자동차, 자전거 책, 사람 또, 추상적인 강의, 주문 등도 객체가 될 수 있습니다. 

객체는 속성과 동작(method)로 구성이 되어 있습니다. 사람의 속성은 이름, 나이 , 키 , 몸무게 등이 될 수 있고 동작은 걷다, 먹다, 웃다 등을 예로 들수 있습니다.

차(Car)로 비교 한다면 모델명, 색상, 바퀴, 기어, 등의 속성을 가지고 달린다, 멈춘다 와 같은 동작을 가지고 있을수 있겠죠?


javascript 에서는 이러한 프로퍼티와 메소드를 가지고 현실 세계의 객체를 소프트웨어 객체로 설계하고 구동하게 만드는 과정을 진행 하는겁니다.


▶ 객체의 상호작용

 : 현실 세계에서 일어나는 현상은 대부분 객체간의 상호작용으로 이루어 진다고 합니다. 예를들어 사람이 차를 타고 가는것 , 계산기를 사용하는 것등 사람이라는 객체에서 어떠한 행동을 통해 다른 객체의 기능을 사용하는 것이 객체간의 상호 작용이라고 할 수 있죠. 이 객체 간의 상호작용은 동작 즉 메소드를 통해서 이루어 지는데, javascript 에서는 객체에서 메소드를 통해 진행 되는 동작을 다음과 같이 표현 합니다.


☆ dot notation 

 : 객체.메소드()


ex)


function number( ) {

  let num = 3;

  let str = num.toString;

}


[객체와 클레스(Class)]


 : 객체를 만들기 위해서는 객체의 설계도가 필요하고 이 설계도를 클레스(Class)라고 부릅니다.  설계도 즉 , 클레스를 만들면 클레스의 값은 컴퓨터의 메모리에 저장되는데 이런 클레스를 이용하여 만들어지 객체들을 인스턴스(instance) 객체라고 합니다.

예를 들어 자동차의 설계도를 보고 여러 대의 차량을 만든다고 한다면 설계도는 클레스, 생산된 자동차들이 인스턴스가 되는 거죠. 


새로운 인스턴스 객체를 만들기 위해서는 new 연산자를 사용하여 객체를 생성해 줍니다. 메모리에 내에 생성된 주소를 모르면 사용할 수 없듯이 new 연산자를 사용하여 객체의 주소를 정의해 주는 역할을 하는겁니다.

하나의 클레스 주소를 가지고 모든 인스턴스들을 new 연산자로 연결 할 수 있다는 겁니다.


변수(인스턴스객체) = new 클레스 ;


ex) 

function Car(brand, color){

  let avante = new Car;

  let mini = new Car;

  let musso = new Car;

             .

             . 


그럼 가장 중요한 클레스를 선언하는 법을 알아 보도록 하겠습니다.


ES5 

function Car(brand, color){

// 인스턴스 만들때의 실행 코드

}


ES6

Class Car( ){

constructor(brand, color){

// 인스턴스 만들때의 실행코드

}


위의 방법처럼 매개변수(parameter) 의 값을 가진 클레스를 만들어서 인스턴스를 만들때의 실행 코드를 넣을 수 있습니다.

 

클레스를 선언하고 constructor를 이용하여 인스턴스의 실행코드를 작성할 때 보통  constructor의 충돌이 일어 나는 경우를 방지하기 위해서 this 를 사용합니다.

this는 이 영에서의 매개변수를 참초한다는 뜻으로 해석하면 될것 같습니다..(더 자세히 공부해서 업데이트 하겠습니다.. 내용이 너무 애매모호 하더군요..)


예를들어...


function Car(model, color){

  this.model = model; 

  this.color =  color;




[메소드 (method)]


메소드는 추후에 메소드를 다룰때 더 많은 양을 다룰 예정임으로 오늘은 간단한게 배운 내용을 정리하는 선에서 마무리 하겠습니다.

메소드는 속성을 이용하여 하고자 하는 Action으로 다양한 명령어들이 존재 합니다.

각 타입에 맞는 메소드를 사용해야 하며 각 메소드가 요구하는 조건을 모두 충족해야만 메소드에서 원하는 동작을 실행 시킬수 있습니다.

그래서 항상 메소드를 사용할 때는 미리 어떤 조건이 필요한지 어떤 타입의 메소드 인지를 꼭 확인하고 사용해야 하며 평소에 메소드 관련 테스트를 진행하는것이 좋을것 입니다. 




















'Javascript TIL' 카테고리의 다른 글

200828 [DOM]  (0) 2020.08.29
200827 [HTML & CSS]  (0) 2020.08.27
200806 [자기 주도 개발 (TDD)]  (0) 2020.08.06
200806 [scope & closure]  (0) 2020.08.06
200804 [Koans]  (0) 2020.08.04