๊ด€๋ฆฌ ๋ฉ”๋‰ด

Bin's Blog

ํ”„๋กœํ† ํƒ€์ž… ๋ณธ๋ฌธ

JavaScript

ํ”„๋กœํ† ํƒ€์ž…

hotIce 2023. 7. 15. 23:47
728x90

๐Ÿค” ํ”„๋กœํ† ํƒ€์ž…(Prototype)์ด๋ž€?

๐Ÿ‘‰ ํ”„๋กœํ† ํƒ€์ž…์€ ์‰ฝ๊ฒŒ ๋งํ•ด ์œ ์ „์ž์ด๋‹ค. 

๐Ÿ‘‰ ์˜ˆ์‹œ๋ฅผ ๋ณด์ž

// ๋ถ€๋ชจ ํด๋ž˜์Šค
function ๊ธฐ๊ณ„() {
  this.q = "strike",
  this.w = "snowball",
}

// ๋ถ€๋ชจ ํด๋ž˜์Šค์— name ์†์„ฑ ์ถ”๊ฐ€
๊ธฐ๊ณ„.prototype.name = "kim"

// ์ž์‹ ์ธ์Šคํ„ด์Šค
let nunu = new ๊ธฐ๊ณ„()

๐Ÿ‘‰ nunu๋ผ๋Š” instance์—๋Š” name์ด๋ผ๋Š” ์†์„ฑ์ด ์—†๋‹ค. ์˜ค์ง ๋ถ€๋ชจ ํด๋ž˜์Šค์—๋งŒ ์กด์žฌํ•œ๋‹ค. ๊ทผ๋ฐ nunu.name์ด๋ผ๊ณ  ์ ‘๊ทผํ•˜๋ฉด "kim"์ด๋ผ๊ณ  ๋œฌ๋‹ค. 

 

๐Ÿค” ๋ถ€๋ชจ๊ฐ€ ๊ฐ€์ง„ ์†์„ฑ์„ ์ž์‹์—์„œ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋Š” ์ด์œ ๋Š” ๋ญ˜๊นŒ?

๐Ÿ‘‰ object์—์„œ ์ž๋ฃŒ ๋ฝ‘์„ ๋•Œ ์ผ์–ด๋‚˜๋Š” ์ผ์ด๋‹ค. 

๐Ÿ‘‰ ์ž์‹์ด ํ•ด๋‹น ์†์„ฑ์„ ๊ฐ€์ง€๊ณ  ์žˆ์ง€ ์•Š์œผ๋ฉด ๋ถ€๋ชจ์œ ์ „์ž๋ฅผ ์‚ดํŽด๋ณธ๋‹ค. ๊ฑฐ๊ธฐ์— ํ•ด๋‹น ์†์„ฑ์ด ์žˆ์œผ๋ฉด ์ถœ๋ ฅํ•œ๋‹ค. ๋ถ€๋ชจ์—๋„ ์—†์œผ๋ฉด ์กฐ๋ถ€๋ชจํ•œํ…Œ ๊ฐ€์„œ ์ฐพ์•„๋ณธ๋‹ค. ์ด๋Ÿฐ ๋ฐฉ์‹์€ Prototype.chain์˜ ์›๋ฆฌ๋‹ค.

 

let array = [4, 2, 1];
array.sort();

๐Ÿ‘‰ ์šฐ๋ฆฌ๊ฐ€ ๋ฐฐ์—ด์„ ์ •๋ ฌํ•˜๋Š” sort()๋ผ๋Š” ๋ฉ”์„œ๋“œ๋ฅผ ์“ธ ์ˆ˜ ์žˆ๋Š” ์ด์œ ๋„ prototype์ด๋ž‘ ๊ด€๋ จ์ด ์žˆ๋‹ค. Array.prototype()์„ ๋ธŒ๋ผ์šฐ์ € ์ฝ˜์†”์ฐฝ์—์„œ ์ฐ์–ด๋ดค๋‹ค.

Array.prototype

๐Ÿ‘‰ ์šฐ๋ฆฌ๊ฐ€ ์ง์ ‘ sort()๋ผ๋Š” ํ•จ์ˆ˜๋ฅผ ๊ตฌํ˜„ํ•˜์ง€ ์•Š์•„๋„ ์“ธ ์ˆ˜ ์žˆ๋Š”๊ฑด Array.prototype ์•ˆ์— ์ด๋ฏธ ์žˆ๋Š” ๊ฒƒ์„ ๊ฐ–๋‹ค ์“ฐ๊ธฐ ๋•Œ๋ฌธ์ด๋‹ค. Array๋ผ๋Š” ๋ถ€๋ชจ ์š”์†Œ์— ์ •๋ ฌํ•จ์ˆ˜๊ฐ€ ์กด์žฌํ•˜๊ณ  ์ž์‹์ธ ์šฐ๋ฆฌ๋Š” ๊ทธ๊ฒƒ์„ ๊ทธ๋ƒฅ ๊ฐ€์ ธ๋‹ค ์“ฐ๋ฉด ๋œ๋‹ค. 

728x90

'JavaScript' ์นดํ…Œ๊ณ ๋ฆฌ์˜ ๋‹ค๋ฅธ ๊ธ€

npm vs yarn  (0) 2023.08.05
XML  (0) 2023.07.31
์ฝœ๋ฐฑ ์ง€์˜ฅ(๊ธฐ๋ช… ํ•จ์ˆ˜)  (0) 2023.06.27
์ฝœ๋ฐฑ ํ•จ์ˆ˜  (0) 2023.06.21
forEach ๋ฉ”์„œ๋“œ  (0) 2023.06.02