2. this와 constructor

1. this

this가 왜 필요한가?

ex)
var kim = {
    name:'kim',
    first_score:10,
    second_score:20,
    sum_score: function() {
        return kim.first_score + kim.second_score;
    }
}

kim이라는 객체가 있다고 가정해보자.
kim에는 name,first,second 요소와 sum_score메소드를 포함한다.

그러나 문제는 객체를 수정할때 발생한다.
만약 kim객체를 lee라고 이름을 바꿔줄 경우에는 sum_score에 있는 kim.first_score + kim.second_score를 lee.first_score + lee.second_score 로 일일히 다 바꾸어 주어야 한다.

그래서 유지보수를 유용하게 하기 위해서 this를 사용한다.

var kim = {
    name:'kim',
    first_score:10,
    second_score:20,
    sum_score: function() {
        return this.first_score + this.second_score;
    }
}

this의 의미는 이 객체 내에서 요소에 접근한다는 의미이다.
즉, this.first_score 이 객체 내에서의 first_score 요소를 사용한다는 의미이다.

이렇게 하면 객체이름을 kim에서 lee로 바꾸어도 위의 예시처럼 일일히 kim에서 lee로 바꾸지 않아도 되서 매우 편리하다.

2.constructor

그렇다면 밑의 예시처럼 똑같은 요소를 가지고 있는 객체들이 많다고 가정해보자

var lee = {
    name:'lee',
    first_score:10,
    second_score:30,
    sum_score: function() {
        return this.first_score + this.second_score;
    }
}
.
var kim = {
    name:'kim',
    first_score:10,
    second_score:20,
    sum_score: function() {
        return this.first_score + this.second_score;
    }
}
.
var park = {
    name:'park',
    first_score:40,
    second_score:20,
    sum_score: function() {
        return this.first_score + this.second_score;
    }
}

이처럼 요소의 구성요소가 같을때 요소를 수정하고 싶으면 일일히 모든 객체의 내용을 수정해야한다.

그러므로 요소를 찍어주는 공장을 만드는것을 coustructor라고 한다.

coustructor는 함수객체앞에 new를 붙이면 constructor로 지정된다.

ex)
function person(name, first_score, second_score) {
    this.name = name
    this.first_score = first_score
    this.second_score = second_score
    this.sum_score = function() {
        return this.first_score + this.second_score;
    }
}
.
console.log(people()); #undefined

function person(name, first_score, second_score) {
    this.name = name
    this.first_score = first_score
    this.second_score = second_score
    this.sum_score = function() {
        return this.first_score + this.second_score;
    }
}
.
console.log(new people());
# person {
    name: undefined,
    first_score: undefined,
    second_score: undefined,
    sum_score: [Function (anonymous)]
  }

new를 붙였을때는 constructor로 지정되어 객체의 구성요소가 나오지만 그냥 함수는 아무것도 나오지 않는다.

이렇게 new를 적어주면 constructor로 되는건 알았으니 어떻게 하면 객체 공장을 만들 수 있는지 알아보자

kim의 sum_score를 구하는 방법을 예시로 들었다.

function person(name, first_score, second_score) {
    this.name = name
    this.first_score = first_score
    this.second_score = second_score
    this.sum_score = function() {
        return this.first_score + this.second_score;
    }
}

1. 객체함수를 지정해준뒤 매개변수(name, first_score, second_score)로 들어갈 값을 지정해준다.

   var kim = new person("kim", 10, 20)

2. 그후 객체에서 원하는 메소드나 요소를 적용시킨다.
   여기서는 kim의 sum_score를 구한다.

console.log(kim.sum_score());
# 30

이렇게 constructor를 사용하면 일일히 각 개체의 내용을 수정 할 필요 없이 constructor의 내용만 고치면 되므로 유지보수에 유용하다.