CSE/Java Script(13)
-
[Java Script] 객체지향 프로그래밍 : 상속
- 자바스크립트는 클래스를 기반으로 하는 전통적인 상속을 지원하지는 않음 => 하지만 객체 프로토타입 체인을 이용하여 상속을 구현해낼 수 있다. 1. 프로토타입을 이용한 상속 (1) 상속 function create_object(o){ function F() {} F.prototype = o; return new F(); } - 위의 코드는 더글라스 크락포드가 자바스크립트 객체를 상속하는 방법으로 소개한 코드이다. - create_object() 함수는 인자로 들어온 객체를 부모로 하는 자식 객체를 생성하여 반환한다. => 반환된 객체는 부모 객체의 프로퍼티에 접근할 수 있고, 자신만의 프로퍼티를 만들 수도 있다. => 이렇게 프로토타입의 특성을 활용하여 상속을 구현하는 것이 프로토타입 기반의 상속 - ..
2021.09.14 -
[Java Script] 객체지향 프로그래밍 : 클래스, 생성자, 메서드
클래스로 객체의 기본적인 형태와 기능을 정의 생성자로 인스턴스를 만들어서 사용할 수 있음 클래스에 정의된 메서드로 여러 가지 기능을 수행할 수 있음 모든 인스턴스가 클래스에 정의된 대로 같은 구조이고 보통 런타임에 바꿀 수 없다. 정확성, 안전성, 예측성 등의 관점에서 클래스 기반 언어는 프로토타입 기반의 언어보다 좀 더 나은 결과를 보장한다. Java, C++이 여기에 속한다 객체의 자료구조, 메서드 등을 동적으로 바꿀 수 있음 동적으로 자유롭게 객체의 구조와 동작 방식을 바꿀 수 있음 자바스크립트가 여기에 속함 - 자바스크립트는 거의 모든 것이 객체이고, 특히 함수 객체로 많은 것을 구현할 수 있다. => 클래스, 생성자, 메서드도 모두 함수로 구현할 수 있다 1. 자바스크립트로 객체 생성하기 (자원..
2021.09.14 -
[Java Script] 스코프 체인
- 자바스크립트도 다른 언어와 마찬가지로 스코프, 즉 유효 범위가 있다. - 자바스크립트에서는 오직 함수만이 유효 범위의 한 단위가 된다. - 스코프 체인 : 유효 범위를 나타내는 스코프가 [[scope]] 프로퍼티로 각 함수 객체 내에서 연결 리스트 형식으로 관리되는 것 - 각각의 함수는 [[scope]] 프로퍼티로 자신이 생성된 실행 컨텍스트의 스코프 체인을 참조한다. => 함수가 실행되는 순간 실행 컨텍스트가 만들어지고, 이 실행 컨텍스트는 실행된 함수의 [[scope]] 프로퍼티를 기반으로 새로운 스코프 체인을 만든다. 1. 전역 실행 컨텍스트의 스코프 체인 var var1 = 1; var var2 = 2; console.log(var1); //1 console.log(var2); //2 - 위의..
2021.09.06 -
[Java Script] 실행 컨텍스트
1. 실행 컨텍스트 개념 - 콜 스택(call stack) : 함수를 호출할 때 해당 함수의 호출 정보가 차곡차곡 쌓여있는 스택 - 실행 컨텍스트는 콜 스택에 들어가는 실행 정보 하나와 비슷하다. - 실행 컨텍스트가 형성되는 세 가지 경우 전역 코드 eval() 함수로 실행되는 코드 함수 안의 코드를 실행할 경우 - ECMAScript에서 말하는 실행 컨텍스트 생성 => 현재 실행되는 컨텍스트에서 이 컨텍스트와 관련 없는 실행 코드가 실행되면, 새로운 컨텍스트가 생성되어 스택에 들어가고 제어권이 그 컨텍스트로 이동한다. console.log("This is gloabl context"); function ExContent1(){ console.log("This is ExContent1"); }; func..
2021.08.05 -
[Java Script] 함수와 프로토타입 체이닝 4
1. 프로토타입의 두 가지 의미 - 자바스크립트는 프로토타입 가븐의 객체지향 프로그래밍을 지원한다 - 자바스크립트는 클래스 개념이 없기 때문에 객체 리터럴이나 생성자 함수로 객체를 생성한다. => 이 때, 생성된 객체의 부모 객체가 '프로토타입' 객체이다. => 모든 객체는 프로토타입 객체를 가리키는 '암묵적 프로토타입 링크'([[Prototype]] 링크)가 있다 => 객체지향의 상속처럼 부모 객체가 가진 프로퍼티나 메서드 사용 가능 - 함수 객체의 prototype 프로퍼티와 객체의 숨은 프로퍼티인 [[Prototype]]을 구분해야 한다 => 이를 위해 자바스크립트의 객체 생성 규칙을 알아야 한다. => 모든 객체는 자신을 생성한 생성자 함수의 prototype 프로퍼티가 가리키는 프로토타입 객체를..
2021.08.05 -
[Java Script] 함수와 프로토타입 체이닝 3
- arugments 객체 뿐만 아니라 this 인자가 함수 내부로 암묵적으로 전달됨 - 함수가 호출되는 방식인 호출 패턴에 따라 this가 다른 객체를 참조한다 (this 바인딩) 1. 객체의 메서드 호출할 때, this 바인딩 - 메서드 : 객체의 프로퍼티가 함수인 경우 - 메서드를 호출할 때, 해당 메서드 내부의 this는 메서드를 호출한 객체가 된다. var myObject= { name : 'foo', sayName:function(){ console.log(this.name); } }; var otherObject = { name : 'bar' }; otherObject.sayName = myObject.sayName; myObject.sayName(); //foo otherObject.say..
2021.08.05