πŸŒ’ JavaScript Prototype

2018. 11. 10

Kiwoong Kwon

πŸ“š Contents

1. Prototype...why?

2. .prototype

3. __proto__

4. .constructor

5. new is not New!

6. Object.create

7. instanceof

Prototype... Why? πŸ€”

Prototype... Why? πŸ€”

μžλ°”μŠ€ν¬λ¦½νŠΈλŠ” μ™œ ν”„λ‘œν† νƒ€μž… 기반(Prototype-based Language) μ–Έμ–΄μΌκΉŒμš”?

이 λΆ„μ—κ²Œ μ§ˆλ¬Έν•  κΈ°νšŒκ°€ 주어진닀면 μ €λŠ” κΌ­

μžλ°”μŠ€ν¬λ¦½νŠΈκ°€ μ™œ ν”„λ‘œν† νƒ€μž… κ°œλ…μ„ μ°¨μš©ν–ˆλŠ”μ§€ 물어보고 μ‹Άμ–΄μš”

Prototype... Why? πŸ€”

직접 λ¬Όμ–΄λ³Ό 수 μ—†μœΌλ‹ˆ μ—¬λŸ¬κ°€μ§€ 뒷쑰사λ₯Ό ν•©λ‹ˆλ‹€ πŸ‘€

Prototype... Why? πŸ€”

I’m not proud, but I’m happy that I chose Scheme-ish first-class functions and

Self-ish (albeit singular) prototypes as the main ingredients.

(λΆ€λ„λŸ½μ§€λ§Œ) Scheme의 일급 ν•¨μˆ˜μ™€ Self의 (ν•˜λ‚˜μ˜ κ°œλ… λΏμ΄μ§€λ§Œ) ν”„λ‘œν† νƒ€μž…μ„

μ£Όμš” ꡬ성 μš”μ†Œλ‘œ μ„ νƒν•˜κ²Œ λ˜μ–΄ κΈ°μ©λ‹ˆλ‹€.

Prototype... Why? πŸ€”

πŸ’« Self

Prototype... Why? πŸ€”

Self is an object-oriented programming language

based on the concept of prototypes.

SelfλŠ” 1987λ…„ λ§Œλ“€μ–΄μ§„ ν”„λ‘œν† νƒ€μž… 기반 ν”„λ‘œκ·Έλž˜λ° μ–Έμ–΄μž…λ‹ˆλ‹€

μ•„λ§ˆ 이 μ–Έμ–΄λ‘œλΆ€ν„° μ˜κ°μ„ λ°›μ•„

ν”„λ‘œν† νƒ€μž… κ°œλ…μ„ μ°¨μš©ν•˜μ§€ μ•Šμ•˜λ‚˜ ν•˜λŠ” λ‡Œν”Όμ…œ... πŸ™‰

Prototype... Why? πŸ€”

πŸ’« Self의 μœ„ν‚€ν”Όλ””μ•„ λ¬Έμ„œμ—λŠ” ν”„λ‘œν† νƒ€μž… κ°œλ…μœΌλ‘œ

OOP 의 μ–΄λ–€ 문제λ₯Ό ν•΄κ²° ν•˜κ³  μ‹Άμ—ˆλŠ”μ§€ μ ν˜€μžˆμ–΄μš”

Unless one can predict with certainty what qualities a set of objects and classes

will have in the distant future, one cannot design a class hierarchy properly.

λ¨Ό λ―Έλž˜μ— 객체와 ν΄λž˜μŠ€λ“€μ΄ κ°€μ§ˆ νŠΉμ„±(qualities) 에 λŒ€ν•΄ μ˜ˆμΈ‘ν•  수 μ—†λ‹€λ©΄

클래슀 계측 ꡬ쑰에 λŒ€ν•΄ μ˜¬λ°”λ₯΄κ²Œ 섀계할 수 μ—†λ‹€

Prototype... Why? πŸ€”

🚘 νƒˆ 것에 λŒ€ν•œ 클래슀 계측 μ •μ˜λ₯Ό λ¨Ό λ―Έλž˜κΉŒμ§€ μ˜ˆμΈ‘ν•΄μ„œ 미리 ν•  μˆ˜λŠ” μ—†μŠ΅λ‹ˆλ‹€

Β Vehicle βŠ‡ { Sports Car, Flatbed Truck, SUV, ... }  ← Bob's Sports Car

여기에 μ–΄λ–€ 것듀이 μ–΄λ–€ κΈ°λŠ₯으둜 λ“€μ–΄κ°ˆμ§€ μ•Œ 수 μ—†μ–΄μš”

Prototype... Why? πŸ€”

🚘 ν•˜μ§€λ§Œ μ›ν˜•(Prototype)의 사본을 λ§Œλ“€κ³ , κΈ°λŠ₯을 μΆ”κ°€ν•œλ‹€λ©΄?

DoonDoony's Sports Car = Vehicle + { Super Engine, 2 Doors ... }Β 

λ‘”λ‘”μ΄μ˜ μŠ€ν¬μΈ μΉ΄μ— ν•„μš”ν•œ κΈ°λŠ₯을 λ§Œλ“­λ‹ˆλ‹€

TT's Sports Car = DoonDoony's Sports CarΒ + { Super Engine, 4 Doors ... }Β 

λ‘”λ‘”μ΄μ˜ μŠ€ν¬μΈ μΉ΄κ°€ λ§˜μ— λ“ λ‹€λ©΄ 사본을 λ§Œλ“€μ–΄μ„œ μ»€μŠ€ν„°λ§ˆμ΄μ¦ˆ ν•©λ‹ˆλ‹€

Vehicle + Features

Prototype... Why? πŸ€”

πŸš” 클래슀λ₯Ό μ΄μš©ν•΄ Porsche 911, Audi R8, BMW Z8 을 λ§Œλ“ λ‹€λ©΄...?

(Optional) νƒˆ 것 μΈν„°νŽ˜μ΄μŠ€λ₯Ό λ§Œλ“¦

β†’ (Optional) 슀포츠카 좔상 클래슀λ₯Ό λ§Œλ“¦

β†’ 포λ₯΄μ‰ 911, μ•„μš°λ”” R8, BMW Z8 ꡬ상 클래슀λ₯Ό μž‘μ„±

β†’ 포λ₯΄μ‰ 911 μΈμŠ€ν„΄μŠ€λ“€μ΄ 막 λŒμ•„λ‹€λ‹˜ (DoonDoony's, TT's, Coco's ...)

β†’ DoonDoony의 μ°¨μ—λ§Œ μ–΄λ–€ κΈ°λŠ₯을 μΆ”κ°€ν•˜κ³  μ‹Άμ–΄

β†’ μ•„λ‹ˆ μ™œ? κ·Έλƒ₯ 포λ₯΄μ‰ 911 클래슀 ν‹€ μ•ˆμ—μ„œλ§Œ μ›€μ§μ—¬μ€˜ πŸ™ˆ

Prototype... Why? πŸ€”

πŸš” ν”„λ‘œν† νƒ€μž…μ„ μ΄μš©ν•΄ Porsche 911, Audi R8, BMW Z8 을 λ§Œλ“ λ‹€λ©΄...?

(Optional) νƒˆ 것 ν”„λ‘œν† νƒ€μž…

β†’ (Optional) νƒˆ 것을 λ³΅μ‚¬ν•œ 슀포츠카 ν”„λ‘œν† νƒ€μž…

β†’ 포λ₯΄μ‰ 911, μ•„μš°λ”” R8, BMW Z8λŠ” 슀포츠카의 사본 + κΈ°λŠ₯

β†’ DoonDoony, TT, Coco λŠ” λ§˜μ— λ“œλŠ” 차의 사본을 λ§Œλ“€μ–΄μ„œ νƒ€κ³ λ‹€λ‹Œλ‹€

β†’ DoonDoony μ°¨μ—λ§Œ μ–΄λ–€ κΈ°λŠ₯을 μΆ”κ°€ν•˜κ³  μ‹Άλ‹€λ©΄

β†’ μΆ”κ°€ν•˜λ©΄ 됨!

Prototype... Why? πŸ€”

πŸš” ν•˜κ³  μ‹Άμ—ˆλ˜ 이야기

μžλ°”μŠ€ν¬λ¦½νŠΈμ—λŠ” μΈμŠ€ν„΄μŠ€κ°€ μ—†μ–΄μš” πŸ™…β€β™€οΈ

클래슀 - μΈμŠ€ν„΄μŠ€κ°€ μ•„λ‹ˆλΌ μ¦‰μ‹œ λ™μž‘ κ°€λŠ₯ν•œ 객체와 κ·Έ 객체의 μ‚¬λ³ΈλΏμž…λ‹ˆλ‹€ πŸ™†β€β™€οΈ

좜처: http://m.blog.daum.net/guddk33/2

μ €λŠ” λ†€λžμŠ΅λ‹ˆλ‹€

μΈμŠ€ν„΄μŠ€κ°€ μ—†λŠ” μ–Έμ–΄μ—μ„œ 이 μ–Όλ§ˆλ‚˜ ν•΄κ΄΄λ§μΈ‘ν•œ 일을 ν–ˆλ˜κ°€...

.prototype πŸ“¦

.prototype πŸ“¦

ν•¨μˆ˜ 객체만 (Function) κ°–κ³  μžˆλŠ” ν”„λ‘œνΌν‹° μž…λ‹ˆλ‹€

μ™œλƒλ©΄ ν•¨μˆ˜λ₯Ό λ§Œλ“€λ©΄ μƒκ²¨μš” (λ£° μž…λ‹ˆλ‹€)

Β 

.prototype ν”„λ‘œνΌν‹°κ°€ μ•ˆμƒκΈ°κ²Œ ν•¨μˆ˜λ₯Ό λ§Œλ“€ 수 있으면 μ•Œλ €μ£Όμ„Έμš”

.prototype πŸ“¦

πŸ“¦ ν•¨μˆ˜κ°μ²΄λ₯Ό λ§Œλ“€λ©΄ μƒκΈ°λŠ” 일

.prototype πŸ“¦

prototype

constructor

CreamHeroes

CreamHeroes.prototype

[[prototype]]

[[prototype]]

constructor

Object.prototype

[[prototype]]

null

Function.prototype

.prototype πŸ“¦

What the...

.prototype πŸ“¦

TL; DR

1. ν•¨μˆ˜λ₯Ό μƒμ„±ν•˜λ©΄ μžλ™μœΌλ‘œ prototype ν”„λ‘œνΌν‹°κ°€ 생긴닀

2. prototype.constructor ν”„λ‘œνΌν‹°κ°€ 생긴닀

3. prototype.constructor ν”„λ‘œνΌν‹°λŠ” ν•¨μˆ˜ λ‚˜ μžμ‹ μ΄λ‹€

4. μ•„μŠ€λ‚ 

[[prototype]] (a.k.a __proto__) πŸ“¦

[[prototype]] (a.k.a __proto__) πŸ“¦

λͺ¨λ“  객체가 κ°–κ³  μžˆλŠ” νžˆλ“ (μ΄μ§€λ§Œ λ³΄μ΄λŠ”)Β ν”„λ‘œνΌν‹° μž…λ‹ˆλ‹€

이것도 κ·Έλƒ₯ 객체λ₯Ό λ§Œλ“€λ©΄ μƒκ²¨μš” (브랜던 아이크 μ„Όμ„Έμ˜ λ£° μž…λ‹ˆλ‹€)

[[prototype]] (a.k.a __proto__) πŸ“¦

[[prototype]] (a.k.a __proto__) πŸ“¦

객체의 μ›ν˜• (prototype) 을 κ°€λ¦¬ν‚΅λ‹ˆλ‹€!

Β 

객체 지ν–₯ λ°©μ‹μœΌλ‘œ 이야기 ν•˜μžλ©΄

λ‚˜μ˜ λΆ€λͺ¨ 역할을 ν•˜λŠ” 객체의 ν”„λ‘œν† νƒ€μž… ν”„λ‘œνΌν‹°λ₯Ό κ°€λ¦¬ν‚΅λ‹ˆλ‹€.

Β 

ν”„λ‘œν† νƒ€μž… 기반 ν”„λ‘œκ·Έλž˜λ° κ΄€μ μ—μ„œλŠ”

ν•˜λ‚˜μ˜ 사본, λ˜λŠ” μ—°κ΄€λœ(linked) 객체의 κ΄€μ μœΌλ‘œ 생각해야 ν•˜κΈ° λ•Œλ¬Έμ—

λΆ€λͺ¨λΌκ³  단정지어 λ§ν•˜κΈ΄ μ–΄λ ΅μŠ΅λ‹ˆλ‹€

πŸ€” [[prototype]] 은 κ·Έλž˜μ„œ 뭘 ν•˜λ‚˜μš”?

[[prototype]] (a.k.a __proto__) πŸ“¦

ν”„λ‘œν† νƒ€μž… 체이닝을 κ΅¬ν˜„ν•©λ‹ˆλ‹€

Β 

객체의 ν”„λ‘œνΌν‹°λŠ” ν”„λ‘œν† νƒ€μž… 체이닝에 μ˜ν•΄ νƒμƒ‰λ©λ‹ˆλ‹€

ν”„λ‘œν† νƒ€μž…μ€ 객체λ₯Ό κ΄€ν†΅ν•˜λŠ” κ±°λŒ€ν•œ λ§ν¬λ“œ λ¦¬μŠ€νŠΈμ™€ κ°™μŠ΅λ‹ˆλ‹€

πŸ€” [[prototype]] 은 κ·Έλž˜μ„œ 뭘 ν•˜λ‚˜μš”?

[[prototype]] (a.k.a __proto__) πŸ“¦

.constructor πŸ“¦

.constructor πŸ“¦

ν•¨μˆ˜ 객체만 (Function) κ°–κ³  μžˆλŠ” prototype의 ν”„λ‘œνΌν‹° 쀑 ν•˜λ‚˜μž…λ‹ˆλ‹€

일반적으둜, ν•¨μˆ˜ 자기 μžμ‹ μ„ κ°€λ¦¬ν‚΅λ‹ˆλ‹€

.constructor πŸ“¦

πŸ™‹β€β™€οΈ .constructor λŠ” ν•¨μˆ˜ μžμ‹ μ„ κ°€λ¦¬ν‚΅λ‹ˆλ‹€

new is not New! πŸ€·β€β™‚οΈ

new is not New! πŸ€·β€β™‚οΈ

πŸ€·β€β™‚οΈ 이게 무슨 μ–˜κΈ°μ—μš”?

new λŠ” constructor λ₯Ό μ΄μš©ν•˜μ—¬, μƒˆλ‘œμš΄ 객체(!) λ₯Ό μƒμ„±ν•©λ‹ˆλ‹€

(μΈμŠ€ν„΄μŠ€ κ°™μ€κ²Œ μ•„λ‹ˆλΌκ΅¬μš”)

Β 

new λŠ” λͺ¨λ“  ν•¨μˆ˜ μ•žμ— 호좜이 κ°€λŠ₯ν•©λ‹ˆλ‹€ (.constructor에 변경이 μ—†λ‹€λ©΄)

new is not New! πŸ€·β€β™‚οΈ

new is not New! πŸ€·β€β™‚οΈ

πŸ€·β€β™‚οΈ "new" λ₯Ό μ‚¬μš©ν•΄μ„œ 객체λ₯Ό μƒμ„±ν•œ 이유?

new μ™Έμ—λŠ” 객체의 __proto__ 속성에 μ ‘κ·Όν•΄μ„œ

__proto__ 값을 ν•¨μˆ˜μ˜ prototype 으둜 지정할 방법이 μ—†μ—ˆμŠ΅λ‹ˆλ‹€(!)

new is not New! πŸ€·β€β™‚οΈ

πŸ€·β€β™‚οΈ setPrototype, Object.createκ°€ μžˆλŠ” μ§€κΈˆμ€?

prototype μ΄λΌλŠ” 객체λ₯Ό λΉŒλ €μ“°μ§€ μ•Šμ•„λ„ λ©λ‹ˆλ‹€

진정 객체λ₯Ό λ§Œλ“€κ³ , κ·Έ 객체λ₯Ό 체이닝 ν•˜λ©΄ 훨씬 λ‚«μž–μ•„μš”?

Β 

이λ₯Όν…Œλ©΄, κ·Έ λ™μ•ˆμ€ ν•¨μˆ˜λ₯Ό λ§Œλ“€μ—ˆμ„λ•Œ λ”Έλ €μ˜€λŠ” prototype κ°μ²΄λΌλŠ” μ‚¬μ€ν’ˆμ„

λ„ˆλ¬΄ μœ μš©ν•˜κ²Œ μ‚¬μš©ν–ˆλ˜κ±°μ£ 

Object.create πŸ‘¨β€πŸ‘©β€πŸ‘§β€πŸ‘¦

Object.create πŸ‘¨β€πŸ‘©β€πŸ‘§β€πŸ‘¦

πŸ‘¨β€πŸ‘©β€πŸ‘§β€πŸ‘¦ μ•„λ‹ˆ 이거 κ°œλ°œμžν•œν…Œ μ°Έ 쒋은데...

Object.create πŸ‘¨β€πŸ‘©β€πŸ‘§β€πŸ‘¦

πŸ‘¨β€πŸ‘©β€πŸ‘§β€πŸ‘¦ Object.create 의 효λŠ₯

Object.create λ₯Ό μ‚¬μš©ν•˜μ‹œλ©΄

1. ν•¨μˆ˜μ˜ prototype 을 빌렀 쓰지 μ•Šμ•„λ„ λ©λ‹ˆλ‹€

2. prototype, constructor (μ›λž˜ 신경쓰지 μ•Šμ•„λ„ λ˜μ§€λ§Œ) 을 λͺ°λΌλ„ λ©λ‹ˆλ‹€

Object.create πŸ‘¨β€πŸ‘©β€πŸ‘§β€πŸ‘¦

πŸ‘¨β€πŸ‘©β€πŸ‘§β€πŸ‘¦ ν”„λ‘œν† νƒ€μž… 기반 μ–Έμ–΄λž€, μ›λž˜ μ΄λ ‡κ²Œ ν•œλ‹¨ λ§μž…λ‹ˆλ‹€!

ν”„λ‘œν† νƒ€μž… 기반 μ–Έμ–΄λŠ”,

Β 

μ›λž˜ 주어진 객체(Object, Array, Function, Symbol...)λ₯Ό μ΄μš©ν•˜μ—¬

μœ„μž„κ³Όμ •μ„ 톡해 객체λ₯Ό λ§Œλ“€μ–΄ λƒ…λ‹ˆλ‹€

Β 

κ°μ²΄λŠ” κ³„μ†ν•΄μ„œ 연결관계(Object.create)λ§Œμ„ κ°€μ§‘λ‹ˆλ‹€ (μ°Έμ‘°)

μžλ°”μŠ€ν¬λ¦½νŠΈμ—μ„œ μ›μ‹œκ°’ μ™Έμ˜ λͺ¨λ“  건 μ°Έμ‘° ν˜•νƒœλ‘œ μ „λ‹¬λ˜λŠ”κ±΄ 이와 κ΄€λ ¨ μžˆμ§€ μ•Šμ„κΉŒμš”

Object.create πŸ‘¨β€πŸ‘©β€πŸ‘§β€πŸ‘¦

πŸ‘¨β€πŸ‘©β€πŸ‘§β€πŸ‘¦ 그럼 클래슀 기반 μ–Έμ–΄λŠ”μ—¬

클래슀 기반 μ–Έμ–΄λŠ” "클래슀" λΌλŠ” 틀을 μ΄μš©ν•΄

(λΆ•μ–΄λΉ΅ λΉ„μœ  μ•ˆν–ˆμŠ΅λ‹ˆλ‹€ 곡격 γ„΄γ„΄)

객체λ₯Ό λ§Œλ“€μ–΄ λƒ…λ‹ˆλ‹€

Β 

κ°μ²΄λŠ” 클래슀둜 λΆ€ν„° νƒœμ–΄λ‚˜λŠ”λ°

클래슀 λΌλŠ” κ°μ²΄λŠ” 또 μ–΄λ–€ 클래슀둜, κ·Έ ν΄λž˜μŠ€λŠ” 또 μ–΄λ–€ 클래슀둜.... λΆ€ν„°

에라 λͺ¨λ₯΄κ² λ‹€ PPAP

Object.create πŸ‘¨β€πŸ‘©β€πŸ‘§β€πŸ‘¦

πŸ‘¨β€πŸ‘©β€πŸ‘§β€πŸ‘¦ 그럼 클래슀 기반 μ–Έμ–΄λŠ”μ—¬

μžλ°” μ–Έμ–΄μ˜ 경우 λͺ¨λ“  κ²ƒμ˜ 쑰상 ν΄λž˜μŠ€λŠ” java.lang.Class 라고 ν•©λ‹ˆλ‹€ (μ•„λ‹ˆλ©΄ μ•Œλ €μ£Όμ„Έμš”!)

Β 

근데... 그럼 κ·Έ ν΄λž˜μŠ€λŠ” μ–΄λ””μ„œ μ™”μ£ ?

"νƒœμ΄ˆμ— ν΄λž˜μŠ€κ°€ μžˆμ—ˆλ‹€" μ •λ„λ‘œ 퉁쳐야 ν•©λ‹ˆλ‹€

Object.create πŸ‘¨β€πŸ‘©β€πŸ‘§β€πŸ‘¦

πŸ‘¨β€πŸ‘©β€πŸ‘§β€πŸ‘¦ 클래슀 기반 μ–Έμ–΄κ°€ μ΄μƒν•˜λ‹€λŠ”κ²Œ μ•„λ‹ˆλΌ...

ν”„λ‘œν† νƒ€μž… μ–Έμ–΄μ˜ 탄생 배경에, 클래슀 기반 μ–Έμ–΄μ˜ ν•œκ³„μ— λŒ€ν•΄ 이야기 ν–ˆμ—ˆλŠ”λ°μš”

Β 

ν”„λ‘œν† νƒ€μž… 기반 μ–Έμ–΄μ—μ„œ 클래슀 기반 μ–Έμ–΄μ˜ κΈ°λŠ₯듀을 흉내낼 수 μžˆμ§€λ§Œ

κ·Έ λ°˜λŒ€λŠ” μ–΄λ ΅λ‹€λŠ”κ±΄ μ•„μ‹€κ²λ‹ˆλ‹€

(ν΄λž˜μŠ€κ°€ μ •μ˜ 된 뒀에 λͺ½ν‚€νŒ¨μΉ­, μΈμŠ€ν„΄μŠ€μ—μ„œλ§Œ μ“Έ λ©”μ„œλ“œ μΆ”κ°€ λ“±)

Β 

μ–΄λ–€ 주어진 객체와, 그것을 μ΄μš©ν•΄ prototype 을 λ§Œλ“€κ³ , 더 λ‚˜μ€ μ œν’ˆμ„ λ§Œλ“€κ³ 

μ„œλ‘œκ°„μ˜ μ—°κ²° 고리λ₯Ό κ°–κ³  ν•˜λŠ”κ²ƒμ΄ νŠΉμ§•μ΄λΌκ³  ν•  수 μžˆμŠ΅λ‹ˆλ‹€!

Object.create πŸ‘¨β€πŸ‘©β€πŸ‘§β€πŸ‘¦

πŸ‘¨β€πŸ‘©β€πŸ‘§β€πŸ‘¦ 많이 보셨을 Object.create 의 λ™μž‘

1. 인자둜 ν”„λ‘œν† νƒ€μž…κ³Ό, ν”„λ‘œνΌν‹°λ‘œ μΆ”κ°€ν•  객체λ₯Ό λ°›μŠ΅λ‹ˆλ‹€

2. ν”„λ‘œν† νƒ€μž…μ΄ Objectλ‚˜ null 이 μ•„λ‹ˆλΌλ©΄ μ—λŸ¬κ°€ λ°œμƒν•©λ‹ˆλ‹€

3. 빈 ν•¨μˆ˜λ₯Ό ν•˜λ‚˜ λ§Œλ“€κ³ , κ·Έ ν”„λ‘œν† νƒ€μž…μ„ μ „λ‹¬λœ 인자둜 μ§€μ •ν•©λ‹ˆλ‹€.
Β Β  Β λ§Œμ•½ 인자둜 μ „λ‹¬λœ ν”„λ‘œν† νƒ€μž…μ΄ null 이라면 빈 객체λ₯Ό λ§€ν•‘ν•©λ‹ˆλ‹€

4. μΆ”κ°€ μ „λ‹¬λœ ν”„λ‘œνΌν‹°λ₯Ό ν• λ‹Ήν•©λ‹ˆλ‹€

5. new μ—°μ‚°μžλ₯Ό 톡해 빈 ν•¨μˆ˜μ˜ prototype을 λ°˜ν™˜ν•  객체에 μ—°κ²°ν•©λ‹ˆλ‹€

Β  Β  - new의 λ™μž‘μ„ κ·ΈλŒ€λ‘œ μˆ˜ν–‰ν•©λ‹ˆλ‹€

Β  Β  - 빈 객체 λ§Œλ“€κ³ 

Β  Β  - this 바인딩 ν•˜κ³ 

Β  Β  - λ°˜ν™˜κ°’μ΄ object λ©΄ 그걸둜 ν• λ‹Ή, μ•„λ‹ˆλ©΄ κ·Έλƒ₯ 빈 객체

6. λ§Œμ•½ prototype 인자의 값이 null 이라면,Β 

Β  Β  λ°˜ν™˜λ  객체의 ν”„λ‘œν† νƒ€μž… 링크λ₯Ό null 둜 λ§Œλ“€κ³ , ν”„λ‘œν† νƒ€μž… 체인을 λŠμŠ΅λ‹ˆλ‹€

7. μƒμ„±λœ 객체λ₯Ό λ°˜ν™˜ν•©λ‹ˆλ‹€

instanceof πŸ’‘

instanceof πŸ’‘

The instanceof operatorΒ tests whether the prototype property of a constructor appears anywhere in the prototype chain of an object.

instanceof μ—°μ‚°μžλŠ” μ’Œν•­(LHS) 객체의 ν”„λ‘œν† νƒ€μž… 체인 μ–΄λ”˜κ°€μ—

μš°ν•­(RHS)의 객체 ν”„λ‘œν† νƒ€μž…μ΄ μ‘΄μž¬ν•˜λŠ”μ§€ κ²€μ‚¬ν•©λ‹ˆλ‹€

instanceof πŸ’‘

The instanceof operatorΒ tests whether the prototype property of a constructor appears anywhere in the prototype chain of an object.

instanceof μ—°μ‚°μžλŠ” μ’Œν•­(LHS) 객체의 ν”„λ‘œν† νƒ€μž… 체인 μ–΄λ”˜κ°€μ—

μš°ν•­(RHS)의 객체 ν”„λ‘œν† νƒ€μž…μ΄ μ‘΄μž¬ν•˜λŠ”μ§€ κ²€μ‚¬ν•©λ‹ˆλ‹€

instanceof πŸ’‘

πŸ’‘ instanceofΒ in Object.create

instanceof 의 μš°ν•­μ€ ν•„μ—°μ μœΌλ‘œ callable ν•œ 객체여야 ν•©λ‹ˆλ‹€

instanceof πŸ’‘

πŸ’‘ Object.createλ₯Ό μœ„ν•œ ν˜ˆν†΅ 검사

isPrototypeOf 둜 확인할 수 μžˆμŠ΅λ‹ˆλ‹€
(심지어 ν•¨μˆ˜λͺ…도 instance 같은 μ• λ§€ν•œ ν‚€μ›Œλ“œκ°€ μ•„λ‹™λ‹ˆλ‹€)

Appendix 🐢

Appendix 🐢

🐢 class keywordλŠ” μ–΄λ–»κ²Œ λ™μž‘ν• κΉŒμš”?

이 μ½”λ“œκ°€...

Appendix 🐢

🐢 class keywordλŠ” μ–΄λ–»κ²Œ λ™μž‘ν• κΉŒμš”?

μ΄λ ‡κ²Œ λ©λ‹ˆλ‹€... (우리 ν΄λž˜μŠ€κ°€ λ‹¬λΌμ‘Œμ–΄μš”)

Made with Slides.com