문익점 스토리

안녕하세요. 문익점이에요. 문익점에 대해 아시나요? 목화씨를 가져온 문익점이요!

코딩

다형성은 여러 모습을 갖는 것이다. 즉 객체지향에서의 다형성은 한 객체가 여러 타입을 갖는것이라고 말할 수 있습니다. 객체지향에서의 다형성 객체지향에서 다형성은 여러 가지가 있을 수 있지만, 대표적으로 타입 상속을 이용해서 구현합니다. // typescript class Phone { public call() {} } interface Rechargeable { charge(): void; } class SmartPhone extends Phone implements Rechargeable { //overide charge() { } } 간단하게 Phone 클래스가 있고 Rechargeable 인터페이스가 있습니다. 이때 SmartPhone클래스는 두 가지를 모두 상속 받고 있습니다. 이렇게 된다면 스마..

코딩

캡슐화는 객체의 속성(데이터)과 행위(기능)를 하나로 묶고, 실제 구현 내용 일부를 외부에 감추어 은닉하는 것입니다. 즉 객체의 기능의 구현체를 외부에서는 볼 수 없도록 감추는 것입니다. 이점 외부에 영향 없이 객체 내부 구현을 변경 가능 합니다. 정보은닉의 의미 객체에 포함된 정보의 손상과 오용을 막을 수 있다. 객체 내부의 조작 방법이 바뀌어도 사용방법은 바뀌지 않는다. 데이터가 바뀌어도 다른 객체에 영향을 주지 않아 독립성이 유지 캡슐화의 적용 캡슐화 X 아래는 캡슐화가 적용되지 않는 코드입니다. 이 코드에서 조건에 대한 변경사항이 생겨 코드를 수정하려고합니다. 캡술화를 하지 않았을때 생길 수 있는 문제들을 설명해보려합니다. 아래는 레벨 10이상인 회원에게 쿠폰 보상을 지급하는 코드가 있다고 하겠습..

코딩

Object Oriented Programming의 약자로 객체의 관점에서 프로그래밍 하는 것으로 프로그래밍 방식중에 하나입니다. 여기서의 객체는 우리 세상에서 실제로 볼 수 있는 존재하는 물체라고 정의 할 수 있습니다. 인간, 나무, 건물 등 어떠한 특성과 행동을 정의해 놓은 것이 객체입니다. 이 객체의 핵심은 이 "객체가 어느 기능을 제공하냐"입니다. ex) 사람 객체 특성: 이름, 나이, 키... 행동: 걷는다(), 잔다(), 먹는다() 볼륨 제어기 특성: 볼륨 크기 행동: 소리키우기(), 소리줄이기() *절차지향 프로그래밍 는 완전히 다른 방식입니다. 절차지향은 전체적인 그림을 보기 힘듭니다. 또한 하나의 함수를 수정 했을 시에 발생하는 side effect를 감수하기가 힘듭니다. 이러한 단점들을..

코딩

프로토타입은 원형이라고 번역 됩니다. 즉 어떠한 것의 본래의 모습, 원래의 모습입니다. 자바스크립트는 이 프로토탑을 이용하여 객체지향을 동작합니다. 그래서 자바스크립트는 프로토타입 기반 언어라고도 불립니다. ECMA6 표준에서는 Class 문법이 추가되었습니다. 하지만 문법이 추가된 것으로 자바스크립트가 클래스 기반으로 바뀌었다는 것은 아닙니다. 자바스크립트의 모든 객체는 자신의 부모 역할을 담당하는 객체와 연결되어 있습니다. 이러한 부모 객체를 Prototype(프로토타입) 객체 또는 줄여서 Prototype(프로토타입)이라 한다. 즉자기 자신을 생성하기 위해 사용된 객체원형을 프로토타입이라고 합니다. Prototype? __proto__? 자바스크립트는 Class 기반으로 인스턴스를 생성하지 않습니다..

코딩

자바스크립트 엔진 각각의 웹 브라우저 마다 자바스크립트 코드를 구문 분석 하는 자바스크립트 엔진 이 있습니다. 대표적으로 Chrome은 V8 JS Engine 이라고 부르는 것을 사용합니다. 웹 서버에서 자바스크립트 코드를 수신하면 V8 JS Engine이 이 자바스크립트 코드들을 파싱하기 시작합니다. 자바스크립트 코드를 컴퓨터가 이해 할수있는 기계어 코드로 바꾸는 것입니다. 이러한 자바스크립트가 실행되는 환경이 자바스크립트 런타임 환경입니다. 자바스크립트 런타임 환경 자바스크립트 런타임 환경을 하나의 큰 박스라고 생각했습니다. 이 박스 안에는 자바스크립트 엔진, WEB APIs, Callback Queue라는 작은 박스 3개가 있고 자바스크립트 엔진의 콜 스택과 콜백 큐를 활용해주는 Event Loop..

코딩

클로저를 mdn에서 찾아보면 아래와 같이 설명되어있다. A closure is the combination of a function bundled together (enclosed) with references to its surrounding state (the lexical environment) https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures 함수와 그 함수를 둘러싼 Lexical enviroment의 combination. 즉 조합이라고 설명되어 있습니다. 이는 실행컨텍스트 1탄의 스코프 체인이랑도 연관이 있습니다. fucntion person() { var first = "joon"; function firstName() { r..

코딩

실행 컨텍스트의 구성 앞선 1탄 포스팅에서 세 가지의 환경 정보가 담긴다고 했었죠. 그 중 ThisBinding에서 할당되는 this대해 포스팅해보겠습니다. VariableEnvironment LexicalEnvironment ThisBinding 여기서 ThisBinding은 실행컨텍스트가 활성화 될 때 this를 바인딩합니다. 즉 함수가 호출될 때 결정되는겁니다. 이때 어떤식으로 누가 호출하냐에 따라 동적으로 바뀌게 됩니다. this는 어떤 것을 가리킬까? 전역에서의 호출 전역 공간에서의 호출, 그리고 일반적인 함수 호출시에 this는 전역객체를 가리킵니다. 브라우저상에서 전역객체는 window, nodejs상에서는 global 객체입니다. function test() { console.log(thi..

코딩

Execution Context (실행 컨텍스트) 실행 컨텍스트라는 단어를 보았을 때에 어떤 말인지 해석하기도, 받아드리기도 힘듭니다. 이는 Exection이라는 단어는 실행으로 번역하고 Context는 영어 그대로를 사용해서 인 것 같습니다. 간단하게실행 컨텍스트(Execution Context)를 쉽게 말하자면 자바스크립트에서 코드가 실행 될 때 필요한 정보(환경)를 말합니다. 여기서 실행되는 코드는 4가지로 분류 됩니다. 전역 코드 Eval 함수 함수 코드 module (import) 첫 번째인 전역 컨텍스트은 자바스크립트가 실행되는 순간에 생성되고 전체 코드가 종료되면 전역 컨텍스트는 종료됩니다. 나머지 3가지는 함수로 취급 할 수 있습니다. 함수가 실행될 때도 마찬가지로 컨텍스트가 생성되고 함수..