๐ŸŽ„ ์„ฑ์žฅ์ผ์ง€ 3.1

์ฑ… ํ–‰๋ณตํ•œ ์ด๊ธฐ์ฃผ์˜์ž(์›จ์ธ ๋‹ค์ด์–ด)์˜ ๋‚ด์šฉ์— ์ž๊ทน๋ฐ›์•„ ์‹œ์ž‘ํ•˜๋Š” ์†Œ๋ฐ•ํ•œ ์„ฑ์žฅ๊ธฐ๋ก

์‚ด์•„์žˆ๋Š” ๊ฝƒ๊ณผ ์ฃฝ์€ ๊ฝƒ์€ ์–ด๋–ป๊ฒŒ ๊ตฌ๋ณ„ํ•˜๋Š”๊ฐ€?
์„ฑ์žฅํ•˜๊ณ  ์žˆ๋Š” ๊ฒƒ์ด ์‚ด์•„ ์žˆ๋Š” ๊ฒƒ์ด๋‹ค.
์ƒ๋ช…์˜ ์œ ์ผํ•œ ์ฆ๊ฑฐ๋Š” ์„ฑ์žฅ์ด๋‹ค!

๐ŸŒณ ํ‚ค์›Œ๋“œ (1.0)
์ตœ๋Œ€ํ•œ ๊ฐ„๋‹จํ•˜๊ฒŒ ์ •๋ฆฌ, ์ถ”ํ›„์— ๋ณด๋ฉด์„œ ์Šค์Šค๋กœ ์„ค๋ช…
๐Ÿ‰ ๊ฒฝํ—˜ ์œ„์ฃผ๋กœ (2.0)
๋‹จ์ˆœ ์ •๋ณด๋ฅผ ์ „๋‹ฌํ•˜๊ธฐ๋ณด๋‹ค ๋ฌด์—‡์„ ๋ฐฐ์› ๊ณ  ์–ด๋–ป๊ฒŒ ํ•ด๊ฒฐํ–ˆ๋Š”์ง€ ์งง๊ณ  ๊ฐ„๋‹จํ•˜๊ฒŒ ์ž‘์„ฑ
โ„๏ธ ์ •ํ•ด์ง„ ํ…œํ”Œ๋ฆฟ์— ๋งž์ถฐ์„œ (3.0)
ํ‚ค์›Œ๋“œ, ๊ฒฝํ—˜ ๋ชจ๋‘ ์ข‹๋‹ค. ๋‹ค๋งŒ ๋งค์ผ ์ž‘์„ฑํ•˜๊ธฐ๋กœ ๋งˆ์Œ ๋จน์€๋งŒํผ ํ•ต์‹ฌ๋งŒ ๊ฐ„๊ฒฐํ•˜๊ฒŒ ์ •๋ฆฌํ•  ์ˆ˜ ์žˆ๊ฒŒ ํ…œํ”Œ๋ฆฟ์„ ์ž‘์„ฑ (3.1) 230102๋ถ€ํ„ฐ ์‹œ์ž‘๋˜๋Š” ํ•™์Šต์— ๊ด€ํ•œ ๋‚ด์šฉ ์ถ”๊ฐ€

๐Ÿ”‘ ์˜ค๋Š˜์˜ ํ‚ค์›Œ๋“œ

p179. ์Šคํƒœํ‹ฑ, ํ”„๋กœํ† ํƒ€์ž…, ์ธ์Šคํ„ด์Šค ๋ฉ”์„œ๋“œ ์˜ˆ์ œ + Quiz 1, 2)

function Test() {};

Test.staticMethod = function() { console.log('์Šคํƒœํ‹ฑ ๋ฉ”์„œ๋“œ์ž…๋‹ˆ๋‹ค.') };

Test.prototype.prototypeMethod = function() { console.log('ํ”„๋กœํ† ํƒ€์ž… ๋ฉ”์„œ๋“œ์ž…๋‹ˆ๋‹ค.') };

const test = new Test();

test.instanceMethod = function() { console.log('์ธ์Šคํ„ด์Šค ๋งค์„œ๋“œ์ž…๋‹ˆ๋‹ค.') };

Quiz1) ์œ„์˜ ์ฝ”๋“œ์—์„œ ์ƒˆ๋กœ์šด ๊ฐ์ฒด(์ธ์Šคํ„ด์Šค) test2๋ฅผ ์„ ์–ธํ•˜๋ฉด test2๋Š” ์–ด๋–ค ๋ฉ”์„œ๋“œ(๋“ค)๋ฅผ ๊ฐ–๊ณ  ์žˆ๋‚˜์š”?

์˜ˆ์ƒ๋‹ต์•ˆ

const test2 = new Test();

// test2๊ฐ€ ์ง์ ‘ ๊ฐ–๊ณ ์žˆ๋Š” ๋ฉ”์„œ๋“œ๋Š” prototypeMethod()
test2.prototypeMethod();

Quiz2) test2์—์„œ ์Šคํƒœํ‹ฑ ๋ฉ”์„œ๋“œ์— ์ ‘๊ทผํ•  ์ˆ˜ ์žˆ๋Š” ๋ฐฉ๋ฒ•์ด ์žˆ์„๊นŒ์š”?

์˜ˆ์ƒ๋‹ต์•ˆ

test2.constructor.staticMethod()

p182. Quiz 3) ํด๋ž˜์Šค ์ƒ์†์„ ํ”„๋กœํ† ํƒ€์ž…์œผ๋กœ ๊ตฌํ˜„ํ•ด๋ณด๊ธฐ

์•„๋ž˜์˜ ํด๋ž˜์Šค๋ฅผ ํ”„๋กœํ† ํƒ€์ž…์œผ๋กœ ํ‘œํ˜„ํ•ด์ฃผ์„ธ์š”!

class Animal {
	constructor(name, age) {
		this.name = name;
		this.age = age;
	}
}

class Dog extends Animal {
	constructor(name, age) {
		super(name, age);
	}

	bark() {
		console.log('๋ฉ๋ฉ!');
	}
}

์˜ˆ์ƒ๋‹ต์•ˆ

// 1๋ฒˆ ๋ฐฉ๋ฒ•
function Animal(name, age) {
	this.name = name;
	this.age = age;
}

function Dog() {
	this.bark = function() {
		console.log('๋ฉ๋ฉ!');
	}
}

Dog.prototype = new Animal('hodu', 3);

const hodu = new Dog();

console.log(hodu.name); // 'hodu';
console.log(hodu.age); // 3
hodu.bark(); // '๋ฉ๋ฉ!'
// 2๋ฒˆ ๋ฐฉ๋ฒ•
function Animal(name, age) {
	this.name = name;
	this.age = age;
}

function Dog(name, age) {
  Animal.call(this, name, age);
	this.bark = function() {
		console.log('๋ฉ๋ฉ!');
	}
}

const hodu = new Dog('hodu', 3);

console.log(hodu.name); // 'hodu';
console.log(hodu.age); // 3
hodu.bark(); // '๋ฉ๋ฉ!'

์ฐธ๊ณ 

  • ์ฑ…: ์ฝ”์–ด ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ

๐Ÿ“ ์š”์•ฝ ๋ฐ ํ•˜๋ฃจ ๊ฐ„๋‹จ ํšŒ๊ณ 

๋งˆ์ง€๋ง‰ ์ฑ•ํ„ฐ์ธ class๋ฅผ ๋์œผ๋กœ ์ฝ”์–ด ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ์Šคํ„ฐ๋””๋ฅผ ์™„๋ฃŒํ•˜์˜€๋‹ค. ์กฐ๊ธˆ์€ ๋ถ€๋‹ด์ด ๋˜์—ˆ๋˜ ๊ฒƒ๋„ ์‚ฌ์‹ค์ด๋‹ค. ์Šคํ„ฐ๋””๋ถ€ํ„ฐ ์ฑ…์„ ์ œ์•ˆํ•œ ๊ฒƒ๋„ ๋‚˜์˜€๊ธฐ ๋•Œ๋ฌธ์ด๋‹ค. ํ•˜์ง€๋งŒ ์–ด๋Š์ƒˆ ๊ณต๋ถ€๋ฅผ ํ•˜๊ณ  ์Šคํ„ฐ๋””๋ฅผ ์ค€๋น„ํ•˜๋Š” ์‹œ๊ฐ„์ด ์˜คํžˆ๋ ค ํ•™์Šต์— ์ƒ๊ธฐ๋ฅผ ๋ถˆ์–ด๋„ฃ์–ด์ฃผ์—ˆ๋‹ค. ๋˜, ๊ต์œก ๋„๋ฉ”์ธ์—๋„ ๊ด€์‹ฌ์ด ์ƒ๊ธฐ๊ฒŒ ๋˜๋ฉด์„œ ์ผ์„์ด์กฐ๊ฐ€ ์•„๋‹ˆ์—ˆ๋‚˜ ์ƒ๊ฐ์ด ๋“ ๋‹ค. ์—ด์‹ฌํžˆ ์ฐธ์—ฌํ•ด์ค€ ์Šคํ„ฐ๋””์›๋“ค์—๊ฒŒ๋„ ๋„ˆ๋ฌด ๊ณ ๋ง™๊ณ  ๊ฐ์‚ฌํ•˜๋‹ค. ์•„์ง ๋งŽ์ด ๋ถ€์กฑํ•˜์ง€๋งŒ, ์•„์ฃผ ์กฐ๊ธˆ์ด๋ผ๋„ ํŒ€์›๋“ค์—๊ฒŒ ๋„์›€์ด ๋˜์—ˆ์œผ๋ฉด ์ข‹๊ฒ ๋‹ค. ์Šคํ„ฐ๋””๋Š” ์ด์ œ ์‹œ์ž‘์ด๊ณ  ์•ž์œผ๋กœ ๋” ๋งŽ์ด ๋„์›€๋˜๋Š” ํ™œ๋™์œผ๋กœ ๊ฐ€์ ธ๊ฐ€๋ณผ ์ƒ๊ฐ์ด๋‹ค! ์•ฝ๊ฐ„์˜ ๋ถ€๋‹ด๊ณผ ์กฐ๊ธˆ์˜ ์ฑ…์ž„๊ฐ์„ ๊ฐ–๊ณ  ์Šคํ„ฐ๋””์›๋“ค๊ณผ ํ•จ๊ป˜ ์ข‹์€ ์‹œ๋„ˆ์ง€๋ฅผ ๋‚ด๋ฉด์„œ ์„ฑ์žฅํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•˜์ž!

์˜ค๋Š˜์˜ ์ž˜ํ•œ ์ 

  • ์œˆ๋„์šฐ ๋…ธํŠธ๋ถ, ๋ฆฌ๋ˆ…์Šค๋กœ ์ „ํ™˜ ์™„๋ฃŒ(์ถ”ํ›„ ๋ณด๋ฆ„์นผ๋Ÿผ ์ž‘์„ฑ ์˜ˆ์ •)
  • ์Šคํ„ฐ๋”” ์ฒซ ์ฑ… ์ž˜ ๋งˆ๋ฌด๋ฆฌํ•œ ์  :)

์˜ค๋Š˜์˜ ์•„์‰ฌ์šด ์ 

  • ๊ณ„ํš์— ์ ์–ด๋†“์€ ๊ฒƒ์„ ๋‹คํ•˜์ง€๋Š” ๋ชปํ•œ ์ ..? ๊ทผ๋ฐ ์ด๊ฑด ๊ดœ์ฐฎ๋‹ค~!