Object Oriented Programming (객체 지향 프로그래밍)

Obejct Oriented Programming 이란?

 

The basic idea of OOP is that we use objects to model real world things that we want to represent inside our programs, and/or provide a simple way to access functionality that would otherwise be hard or impossible to make use of.

Objects can contain related data and code, which represent information about the thing you are trying to model, and functionality or behavior that you want it to have. Object data (and often, functions too) can be stored neatly (the official word is encapsulated) inside an object package (which can be given a specific name to refer to, which is sometimes called a namespace), making it easy to structure and access; objects are also commonly used as data stores that can be easily sent across the network. (출처 : MDN - https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/Object-oriented_JS)

 

위와 같이 공식 문서에 가까운 MDN의 설명으로 OOP의 정의와 목적을 간략하게 살펴보았다. 여기에 살을 더 붙이자면, 객체지향 프로그래밍은 좀 더 나은 프로그램을 만들기 위한 로직을 상태(State)와 행위(Behave)로 이루어진 객체로 만들고, 이 객체들을 레고 블럭처럼 조립해 하나의 프로그램으로 만드는 것이다. 따라서 객체가 무엇인지를 먼저 이해하는 것이 용이할 수 있는데, 객체는 단순히 변수와 메소드의 모임(그룹)이라 할 수 있다. 이러한 프로그래밍을 하는 목적에는 객체들을 부품화하고 이들을 한데 모아 공장화했을 때, 비슷하고 반복된 제품을 만들 때에 재활용성이 뛰어나고 이는 곧 시간 및 비용적으로 경제적인 장점이 있다.

 

특성(4가지)

 

1. encapsulated(information hiding)

: Object data (and often, functions too) can be stored neatly inside an object package, making it easy to structure and access; objects are also commonly used as data stores that can be easily sent across the network. (On the other hand, it filters access from the network, which is called a information hiding)

 

2. abstraction

: Creating a simple model of a more complex thing, which represents its most important aspects in a way that is easy to work with for our program's purposes.

 

3. polymorphism

: Defining the same feature separately in different classes, as each definition of that feature will be in a different namespace.

 

4. inheritance (가장 중요한 특성)

: Creating new classes based on other classes. These new child classes can be made to inherit the data and code features of their parent class, so you can reuse functionality common to all the object types rather than having to duplicate it. 

Where functionality differs between classes, you can define specialized features directly on them as needed. 

 

객체 생성하기 (4가지)

 

1. Constructor function

When an object instance is created from a class, the class's constructor function is run to create it. This process of creating an object instance from a class is called instantiation — the object instance is instantiated from the class.

어느 클래스의 생성자 함수가 인스턴시에이션을 통해 해당 클래스에 인스턴스 객체를 생성.

 

=> Constructor function 이란?

: The constructor function is JavaScript's version of a class. It defines and initializes objects and their features. It's useful because you'll often come across situations in which you don't know how many objects you will be creating; constructors provide the means to create as many objects as you need in an effective way, attaching data and functions to them as required. You have to know that it has all the features you'd expect in a function, although it doesn't return anything or explicitly create an object — it basically just defines properties and methods. Plus, A constructor function name usually starts with a capital letter 

 

2. Object() & Object.create()

 

- Object() 예제 1

let person = new Object();

person.name = '한이든';
person.['age'] = '3045살';
person.greeting = function () {
  alert('Hi! I\'m ' + this.name + '.');
};

- Object() 예제 2

let person = new Object({
  name: '한이든',
  age: '3045살',
  greeting: function() {
    alert('Hi! I\'m ' + this.name + '.');
  }
});

Object.create()

: JavaScript has a built-in method called create() that allows you to do that. With it, you can create a new object based on any existing object. One limitation of create() is that IE8 does not support it. So constructors may be more effective if you want to support older browsers.

: syntax Object.create(proto, [propertiesObject])

 

- Object.create() 예제 1

let a = Object.create(null);

Object.setPrototypeOf(a, Object); 
// set new object's prototype to the standard-object

Object.setPrototypeOf(a, Object.prototype); 
// set new object's prototype to the "generic" object (NOT standard-object)

 

- Object.create() 예제 2

let newPerson = Object.create(person);

newPerson.name;
newPerson.greeting();

 

3. Using built-in-methods in Javascript ES6

- class : to create a new class with a given name using prototype-based inheritance.

- super : the method to access and call functions on an object's parent. Plus, When its used in a constructor, the super keyword appears alone and must be used before the this keyword is used.

- constructor : to create and initialize an object created within a class.

- extends : to create a class that is a child of another class.

4. Declaring an object literal

const person = {};