October 28, 2020
์ด๋ ค์ด ๋ง๋ก๋ ์๋ธ (์์) ํด๋์ค์์ ์์ ํด๋์ค๋ฅผ ํธ์ถํ ๋ ์ฌ์ฉํ๋ ํค์๋ ๋ผ๊ณ ํ๋ค.
์ ์์ ํด๋์ค์์ ์์ ํด๋์ค๋ฅผ ํธ์ถํ์ง?
์ด๋ค ์ด์ ์ด ์์ง? ๊ธฐ์กด ์์์ ๋จ์ ์ ์ด๋ป๊ฒ ๋ณด์ํ์ง?
๋ฌผ๋ก ๋ญ์ง ์๊ฒ ๋๊ธฐ ์ ๊น์ง๋ ์ ๋ฐ ์ง๋ฌธ์ด ๋์ฒด ๋ญ ์๋ฆฐ๊ฐ ์ถ์๋ค.
๊ทธ๋ฆฌ๊ณ ๊ณต๋ถํ๋ฉด์ ๋๋ผ๊ฒ ๋ ์ฌ์ค์ธ๋ฐ
๊ฒ์ํ ๋ ๋ถ๋ชจ๋ ์๋ถ๋ฅผ ๊ทธ๋ ๊ฒ ๋ง์ด ์ฌ์ญ๋ฏ์ด, ๋ถ๋ชจ๋์ ๋์ ์ผ์ ์ํค๊ณ ๋ถ๋ชจ๋์ ๋ฑ๊ณจ์ ๋นผ์ค๋ ๋ฑ ์ด๋ฒ ํ์ต์์๋ ๋ถํจ๋ฅผ ๋ง์ด ์ ์ง๋ฅด๊ฒ ๋๋ ๊ฑฐ ๊ฐ๋ค.
class Person {
constructor(name, first, second) {
this.name = name
this.first = first
this.second = second
}
sum() {
return this.first + this.second
}
}
class PersonPlus extends Person {
avg() {
return (this.first + this.second) / 2
}
}
Person ๋ถ๋ชจ ํด๋์ค๋ฅผ ์์๋ฐ์ PersonPlus ํด๋์ค์์ ๊ฐ์๊ธฐ ์ธ์คํด์ค๋ฅผ ์์ฑํ ๋ ์ธ์๋ฅผ ํ๋ ๋ ๋ฐ๊ณ ์ถ์ด์ก๋ค.
๊ทธ๋ฌ๋๊น third, ์ธ ๋ฒ์งธ ์ ์๋ฅผ ๋ฐ์์ค๊ณ ์ถ๋ค๋ ๊ฑฐ๊ฒ ์ง.
let kim = new PersonPlus('kim', 10, 20, 30)
๋ค ๋ฒ์งธ ์ธ์๋ก ์ซ์ 30์ ๋ฐ์๋๋ฐ, Person ํด๋์ค ์๋ ๋ค ๋ฒ์งธ ์ธ์๋ฅผ ๋ฐ์ ์ธํ ์ด ์๋์ด ์๋ค.
์ฌ๊ธฐ์ ๋ถ๋ชจ ํด๋์ค Person ์ ๊ฐ์ ๊ทธ๋๋ก ์ ์งํ๋ฉด์ ์ธ ๋ฒ์งธ ์ ์๋ฅผ ๋ฐ์์ค๊ฒ ํ ๋ฐฉ๋ฒ์ ๋ญ๊น??
class Person {
constructor(name, first, second) {
this.name = name
this.first = first
this.second = second
}
sum() {
return this.first + this.second
}
}
class PersonPlus extends Person {
constructor(name, first, second, third) {
this.name = name
this.first = first
this.second = second
this.third = third
}
sum() {
return this.first + this.second + this.third
}
avg() {
return (this.first + this.second + this.third) / 3
}
}
์ด๋ ๊ฒ ๋ถ๋ชจ ํด๋์ค๋ฅผ ๋๋ค์ ๋ณต๋ถํด ์์ PersonPlus ์ third ์ธ์๋ฅผ ํ์ฐ๊ณ ์์ฑ this.third ๋ฅผ ์ถ๊ฐ ํด์ฃผ๋ฉด ๋ฐ๋ผ๋ ๋ฐ๋๋ก ์๋์ ํ๋ค.
๊ทธ๋ฐ๋ฐ ๋๋ค์ ์ค๋ณต์ด ๋ฐ์ํ๊ธฐ์ โ์์โ ์ ์๋ฏธ๋ฅผ ํด์์์ผ ๋ฒ๋ฆฐ๋ค.
์ด ์ค๋ณต์ ํผํ๊ธฐ ์ํด ๋ถ๋ชจ ํด๋์ค๋ฅผ ์์ ํด๋์ค๋ก ๋ถ๋ฌ์์ ๋ถ๋ชจ ํด๋์ค์๊ฒ ์ผ์ ์ํค๊ณ ๋ถ๋ชจ๊ฐ ํ์ง ๋ชปํ๋ ์ผ์ ๋๋ง ํ๋๋ก ํ๊ฒ ๋ง๋๋ (?!?) ํค์๋๊ฐ ๋ฐ๋ก โsuperโ ์ด๋ค.
์ฝ๊ฐ ๋ถํจ ์ค๋ฝ๊ธด ํ๋ฐ ์์ ๋ฌธ์ฅ์ ์์ฒญ๋๊ฒ ์ค์ํ ์๋ฏธ์ด๋ฏ๋ก ์ ๋ ๊ฑ ์๊ณ ๋์ด๊ฐ๋ฉด ์๋๋ค.
PersonPlus ์์ constructor ๊ฐ ์คํ๋ ๋ ์์ ์๋ ๋ถ๋ชจ Person ์ ๊ธฐ๋ฅ์ ๋จผ์ ์คํ๋๊ฒ ํ ์ ์๋ค๋ฉด ๋ฌธ์ ๋ฅผ ํด๊ฒฐํ ์ ์๋ค.
๋ถ๋ชจ๊ฐ ์ด๋ฏธ ๊ฐ๊ณ ์๋ ๊ธฐ๋ฅ๊ณผ ๋๋ (PersonPlus) ๊ฐ๊ณ ์๋ ๊ธฐ๋ฅ์ ์ค๋ณต์ ์ ๊ฑฐํ๊ณ ,
super() ๋ฅผ ๋์ ๋ฃ์ด์ค๋ค.
class Person {
constructor(name, first, second) {
this.name = name
this.first = first
this.second = second
}
sum() {
return this.first + this.second
}
}
class PersonPlus extends Person {
constructor(name, first, second, third) {
// this.name = name
// this.first = first
// this.second = second
// ๋ถ๋ชจ์ ๊ธฐ๋ฅ๊ณผ ์ค๋ณต๋๋ ๊ธฐ๋ฅ์ ์ ๊ฑฐํ๊ณ ,
super(name, first, second) // super() ๋ฅผ ๋์ ๋ฃ์ด์ค๋ค.
this.third = third
}
sum() {
return this.first + this.second + this.third
}
avg() {
return (this.first + this.second + this.third) / 3
}
}
์ฆ, super(name, first, second) ๋ฅผ ํตํด PersonPlus ์ ๋ถ๋ชจ ํด๋์ค์ธ Person ์ ์์ฑ์๊ฐ ํธ์ถ์ด ๋๊ณ ๊ทธ ์์ฑ์ ์์์ ํด๋น ํ๋กํผํฐ๋ค์ด ์์์ ์ธํ ์ด ๋๊ธฐ ๋๋ฌธ์ ์์์ธ PersonPlus ํด๋์ค๋ ์ด์ this.third = third ๋ก ๋๋ง ๊ฐ๊ณ ์๋ ์์ฑ์ ๋ํด์๋ง ์ธํ ์ ํ๋ฉด ๋๋ค.
๊ทธ๋ฆฌ๊ณ PersonPlus ํด๋์ค์ sum() ์ด๋ avg() ๋ฉ์๋ ๊ธฐ๋ฅ๋ ์๋ณด๊ณ ์ถ๋ค.
return this.first + this.second + this.third
return this.first + this.second + this.third
return this.first + this.second + this.third
return this.first + this.second + this.third
return this.first + this.second + this.third
์ด๊ฒ ์ผ์ต์ค์ ๋ฌํ๋ ์ฝ๋๋ผ๋ฉด ์์์ด ๊ตฌํํ๊ธฐ์ ๋นํจ์จ ์ ์ธ ์ํฉ์ด๋ค.
this.first ์ this.second ๋ฅผ ๋ถ๋ชจ ํด๋์ค์์ ์ด๋ฏธ ๊ฐ์ง๊ณ ์๊ธฐ ๋๋ฌธ์ ๊ทธ๊ฑธ ๊ฐ์ ธ๋ค ์ธ ๋ฐฉ๋ฒ์ด ์์ ํ ๋ฐ?
class Person {
constructor(name, first, second) {
this.name = name
this.first = first
this.second = second
}
sum() {
return this.first + this.second
}
}
class PersonPlus extends Person {
constructor(name, first, second, third) {
// this.name = name
// this.first = first
// this.second = second
// ๋ถ๋ชจ์ ๊ธฐ๋ฅ๊ณผ ์ค๋ณต๋๋ ๊ธฐ๋ฅ์ ์ ๊ฑฐํ๊ณ ,
super(name, first, second) // super() ๋ฅผ ๋์ ๋ฃ์ด์ค๋ค.
this.third = third
}
sum() {
// return this.first + this.second + this.third
return super.sum() + this.third
}
avg() {
// return (this.first + this.second + this.third) / 3
return (super.sum() + this.third) / 3
}
}
๋ถ๋ชจํด๋์ค์ ์๋ >>> super ๋ฅผ ์๋ฏธํ๊ณ ,
.sum() ์ผ๋ก ํธ์ถํ๋ค.
์ฆ, ๋ถ๋ชจ ํด๋์ค์ ์๋ sum() ์ ํธ์ถํ๊ณ ๊ทธ ๊ฒฐ๊ณผ๋ฅผ ๋ฐ์์ (๋ฆฌํด๋ฐ์์) ์์ ํด๋์ค์์ ์ถ๊ฐ์ ์ธ ์์ ์ (add this.third) ํ ์ ์๋๋ก ํ๋ฉด ์ข๋ค.
let teddy = new Person('teddy', 10, 20)
teddy
Person {name: "teddy", first: 10, second: 20}
teddy.sum()
30
let sunny = new PersonPlus('sunny', 10, 20, 30)
sunny
PersonPlus {name: "sunny", first: 10, second: 20, third: 30}
sunny.sum()
60
sunny.avg()
20
๋ง์ด ์จ๋ณด์ง ์์๊ธฐ์ ์์ง ์ด๋ ต์ง๋ง ์ํญ ๋๊ฐ ๋๋์ด ์ค๊ธฐ๋ ํ๋ค.
์ํผ์ํผ๋งจ~~