immersive TIL #7

Object Oriented Programming(oop)

배운 내용과 이해해야 될 부분

-OOP(Object Oriented Programming)가 무엇인지?
-JavaScript에서 Object를 생성하는 여러가지 방법들
-JavaScript에서 Prototype은 무엇이고 왜 사용해야 하는지?

oop란 프로그래밍 언어안에서 쓰이는 철학이다.

예를 들자면 자동차를 만들 때 자동차들의 공통적인 속성이나 기능이 있을 것이다.
그럼 자동차라는것을 class(prototype) ,즉 어떠한 기능이나 속성이 없는 청사진(blueprint)으로 만들고
기능이나 속성을 추가하려면 class의 constructor에 정의를 해주면 object를 만들 수 있다.

calss : 복제품을 만들기위한 기준

object : class에서 만들어진 복제품의 이름

instance:변수에 할당,반환된 오브젝트가 인스턴스이다.

constructor:객체를 만드는 역할을 하는 함수

object와 instance가 같은 말인거같아서 헷갈려서 차이점을 찾아보니
원본 오브젝트에 name 프로퍼티가 있다고 한다면, name 프로퍼티에 값을 설정하면 모든 인스턴스는 같은 값을 갖게된다. 하지만 생성한 인스턴스에 name 프로퍼티에 값을 다시 설정하면 인스턴스마다 name 프로퍼티는 다른 값들을 가질 수 있다. 그렇다고 인스턴스의 name 프로퍼티를 바꿨다고 해서 원본 오브젝트의 값이 바뀌는건 아니다
인스턴스마다 다른값을 유지하거나 수정하기위해서 인스턴스를 생성하는 것이다.

javascript 에서 object 생성하는방법

1.객체리터럴

var car = {
  speed : 0,
  color : 'red',
  speedUp: function () {
    this.speed++;
  }
};

위처럼 객체리터럴은 중괄호{} 를 사용해 직접 정의하는 방법을 말한다.정의를 하게되면
객체는 프로토타입(Prototype)으로 Object.prototype을 가진다
즉,Object.prototype 에 정의된 메소드들을 사용할 수 있다

2.생성자 함수

function car () {
  this.weight = 10000;
  this.color = 'red';
  this.speed = 50;
}

car.prototype.speedup = function () {
  this.speed++;
}

var car1 = new car()

constructor 함수를 만들고 new 키워드로 객체를 생성할 수 있다. car 함수 객체는 speedUp이라는 프로토타입 메소드를 가지고 있다. 따라서 new 로 생성된 car1 객체는 Monster의 프로토타입에 접근 할 수 있다.

3.Object.create

var carPrototype = {
  speedup : function () {
    this.speed++;
  }
}

var car1 = Object.create(carPrototype);

Object.create 메소드는 인자로 들어온 객체를 프로토타입으로 하는 새로운 객체를 생성한다.
carPrototype 이라는 객체를 인자로 넣었으므로, car1의 프로토타입 객체는 carPrototype 이 된다

prototype

프로토타입은 얻고자하는 객체의 원래형태가 어딘가에 저장되어있는데 그 어딘가가 prototype이라는
프로퍼티에 저장되어있는것이다 즉 , 어떠한 객체가 만들어지기위해 그객체의 원본이 되기위한것이
prototype이라는 것이다.

javascript 에서의 함수는 곧 객체이기 때문에 property를 가질 수 있다.

prototype object ??

자바스크립트에서 객체를 생성하게 되면 자신이 생성될때 가지고 있는 정보를 가지고있는 Prototype Object 라는 새로운 객체를 복사하여 만들어낸다

prototype = 원본이라고하면

prototype object = 원본의 복제품이며, 자신을 기준으로 다른 복제해서 만들어지는 객체가 참조할 prototype이된다.