JavaScript
-
[JS]생성자 호출패턴 This 바인딩JavaScript 2018. 1. 27. 15:58
생성자 호출패턴 - 일반 함수에 new 연산자를 붙여도 생성자 함수로 동작을 할 수 있다.따라서 생성자 함수명은 첫문자를 대문자로 표기하여 혼란을 방지해야 한다. 생성자 함수 동작 3단계 1. 빈 객체 생성 및 this 바인딩이 빈 객체는 생성자 함수가 새로 생성하게 되는 객체.이 후에 생성자 함수 내에서 가리키는 this는 이 빈 객체를 가리킴.그리고 생성된 빈 객체는 생성자 함수의 prototype 프로퍼티(prototype과 __proto__는 다르다는 걸 기억하자)가 가리키는 객체를 자신의 프로토타입 객체로 설정한다. 2. This를 통한 프로퍼티 생성생성된 빈 객체에 this를 사용하여 프로퍼티나 메서드를 생성할 수 있음.this는 새로 생성된 객체를 가리키므로 this를 통해 새로 생성한 프로..
-
[JS] 메서드 호출패턴과 This 바인딩JavaScript 2018. 1. 27. 15:24
메서드 호출패턴 함수가 객체의 프로퍼티면 메서드 호출 패턴으로 호출이 되는데, 메서드 내부의 this는 해당 메서드를 호출한 객체에 바인딩 된다. var commonctrl = { name : 'kim', sayHello : function() { console.log(this.name); }};commonctrl.sayHello(); 프로토타입 객체도 메서드를 갖을 수 있다. 프로토타입 객체 내부에서 사용된 메서드 역시 일반 메서드 방식과 마찬가지로 해당 메서드를 호출한 객체에 바인딩 된다. var CommonCtrl = function(name) { this.name = name;} CommonCtrl.prototype.getName = function() { return console.log('My..
-
[JS] 함수 호출패턴과 This 바인딩JavaScript 2018. 1. 27. 14:47
함수 호출패턴 외부함수는 window의 메서드가 된다.내부함수 역시 this는 window를 가리키게 된다. function kim() { console.log(this); //window function wook() { console.log(this); //window } wook();} kim(); 객체 내의 this는 자신의 객체를 기리킨다.하지만 객체 내의 메서드의 내부 함수(콜백 함수도 마찬가지)의 this는 자신의 객체가 아닌 window(전역객체)를 가리킨다. var value = 1;var commonctrl = { value : 100, web : function() { console.log('This ' + this); //commonctrl console.log('This ' + th..
-
[JS]PrototypeJavaScript 2018. 1. 20. 16:46
Prototype 모든 객체는 자신의 프로토타입을 가리키는 [[Prototype]]라는 숨겨진 프로퍼티가 있다.[[Prototype]]와 __proto__는 같은 개념이다. 함수 객체는 prototype 프로퍼티도 소유하게 된다.여기서 prototype과 [[Prototype]]는 모두 프로토타입 객체를 가리키지만 관점의 차이가 있다. [[Prototype]] / __proto__는 객체 입장에서 자신의 부모 역할을 하는 프로토타입을 가리킨다. prototype 은 함수 객체만 가지고 있는 프로퍼티다.함수 객체가 new 연산자를 통해 생성자 함수로 사용될 경우,새로 생성될 객체의 부모 역할을 하는 객체(프로토타입 객체)를 가리킨다. Constructor 프로토타입 객체는 constructor 프로퍼티를 ..