Keyword 'this'
- 첫번째 규칙
when 'this' is not inside of a declared object > global object(window)
_bad example
- 두번째규칙 Implicit rule
when 'this' is inside of a declared object > closest parent's object
- 세번째규칙 Explicit binding
function Car(make, model, year){
this.make = make;
this.model = model;
this.year = year;
this.numWheels = 4; }
call / thisArg, a, b, c, d, ....../ Invoke Immediately
function Motorcycle(make, model, year) {
Car.call(this, make, model, year)
this.numWheels = 2; }
apply / thisArg, [a, b, c, d, .....]/ Invoke Immediately
function Motorcycle(make, model, year){
Car.apply(this, [make, model, year]);
this.numWheels = 2; }
function Motorcycle(make, model, year){
Car.apply(this, arguments);
this.numWheels = 2; }
bind / thisArg, a, b, c, d, ....../ Invoke Immediately
we do not need to know all the arguments
- 네번째규칙 'new' keyword
- Creates an object out of thin air
- Assigns the value of 'this' to be that object
- Adds 'return this' to the end of the function
- Creates a link (which we can access as_proto_) between the object created and the prototype property of the constructor function
Prototype Chain
모든 Constructor 함수는 object라고 불리는 "prototype"이라는 특성을 가지고 있다.
prototype object 은 constructor function을 가르키는 "constructor"라는 특성을 가지고 있다.
(The prototype object contains a property called constructor, which points back to the constructor function)
'new' keyword를 사용해서 object가 생성될 때 "_proto_"이 만들어지고,
이 "_proto_"에 의해 object와 constructor function의 프로토타입 속성이 연결됩니다.
(Every time the new keyword is used, a link between the object created and the prototype property of the constructor is established - this link can be accessed using _proto_)
To share properties and methods for objects created by a constructor function, place them in the prototype as it is the most efficient
참고자료
https://medium.com/@bluesh55/javascript-prototype-%EC%9D%B4%ED%95%B4%ED%95%98%EA%B8%B0-f8e67c286b67
http://insanehong.kr/post/javascript-prototype/
https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain
ExecutionContext
(https://poiemaweb.com/js-execution-context)