본문 바로가기

4. Programming/4.3 JavaScript

12. 실행 컨텍스트 실행 컨텍스트(Context)는 Scope, Hoisting, this, Function, Closure 등의 동작원리를 담고 있는 원리.ECMAScript에 따르면 실행 컨텍스트를 실행 가능한 코드를 형상화하고 구분하는 추상적인 개념이라고 정의함.즉, 실행 가능한 코드가 실행되기 위해 필요한 환경.전역 코드 : 전역 영역에 존재하는 코드Eval 코드 : Eval 함수 (텍스트로 된 자바스크립트 코드를 실행시킬 수 있는 함수) 함수 코드 : 함수 내에 존재하는 코드 자바스크립트 엔진은 코드를 실행하기 위해 여러가지 정보를 알고 있어야 하며, 아래와 같음.변수 : 전역변수, 지역변수, 매개변수, 객체의 프로퍼티함수 선언변수의 유효범위(Scope)this현재 실행 중인 컨텍스트에서 이 컨텍스트와 관련 없는 .. 더보기
11. This 함수가 호출될 때, 매개 변수로 전달되는 인자 값 외에도 arguments와 this 를 암묵적으로 전달받음. 자바스크립트의 this는 함수 호출 방식에 따라 바인딩 되는 객체가 달라짐. function func1 () { console.log(arguments, 'arguments') //Arguments [callee: ƒ, Symbol(Symbol.iterator): ƒ] "arguments" console.log(this, 'this') //Window {postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, frames: Window, …} "this" } func1();함수 호출과 바인딩함수 호출에 따라 어떤 객체를 this에 바인딩할지가 결정 됨. 함수 호출 패턴 (.. 더보기
10. Scope Life-Cycle 모든 변수는 Scope 유효범위를 가짐.전역 Scope (Global)코드 어디에서든지 참고 가능지역 Scope (Local or Function-level)정의된 지역 또는 함수 내에서만 가능 변수의 선언 위치(전역 또는 지역)에 의해 Scope를 가지게됨. 즉, 전역에서 선언된 변수는 전역 Scope를 갖고, 지역에서 선언된 변수는 지역 Scope를 가짐. 전역 Scope를 갖는 전역 변수는 전역에서 참조가 가능하며, 지역 변수는 선언된 지역과 그 지역 내부에서만 참조가 가능함. 자바스크립트는 function-level scope를 사용 하기에, 함수 블록 코드내에서 선언된 변수는 함수 코드 블럭 내에서만 유효하고 함수 외부에서는 유효하지 않음.var x = 5 console.log(x); // 5 .. 더보기
9. 프로토타입과 객체지향 프로토타입 객체자바스크트는 java, C++과 같은 클래스 기반 객체지향 프로그래밍 언어와 다르게 프로토타입 기반 객체지향 프로그래밍 언어.클래스 기반 객체지향 프로그래밍 언어는 객체 생성 이전에 클래스를 정의하고 이를 통해 객체(인스턴스)를 생성하나,프로토타입 기반 객체지향 프로그래밍 언어는 클래스 없이도 객체를 생성할 수 있음. 자바스크립트의 모든 객체는 자신의 부모 역할을 담당하는 객체와 연결 되어, 객체 지향의 상속 개념과 같이 부모 객체의 프로퍼티 또는 메소드를 상속받아 사용 가능함. 이러한 부모 객체를 Prototype(프로토타입) 객체라 부름. ECMAScript spec에서는 자바스크립트의 모든 객체는 자신의 프로토타입을 가르키는 [[Prototype]] 이라는 숨겨진 프로퍼티를 가짐.크롬.. 더보기
8. 타입 체크 자바 스크립트는 동적 타입 (Dynamic typed) 언어이므로 변수에 어떤 값이 할당될 지 예측하기 어려움. 아래와 같이 숫자나 문자열이 인수로 전달되어도 결과를 반환하기 때문에, 명확하지 않아질 수 있음. function sum(a, b){ return a + b; } sum('a','b'); sum(1,4); 이와 같은 이유로 자바스크립트는 타입 체크가 필요함. 타입 연산자(Type Operators)는 피연산자의 데이터 타입(자료형)을 문자열로 반환. typeof ''; // string typeof 1; // number typeof NaN; // number typeof true; // boolean typeof []; // object typeof {}; // object typeof ne.. 더보기
7. Function (함수) 함수란 어떤 특정 작업을 수행하기 위해 필요한 일련의 구문을 그룹화 한 개념. 다른 부분에서도 동일한 작업을 반복적으로 수행해야 한다면 미리 작성된 함수를 재 사용 할 수 있음. 일반적인 기능은 특정 작업을 하는 구문들의 집합을 정의, 필요시 호출, 필요한 결과 값 또는 수행 결과를 얻는 것이나, 객체 생성, 행위 지정, 정보의 구성 및 은닉, 클로저, 모듈화 등의 기능도 수행할 수 있음. 함수도 객체이며, 다른 객체와 구분될 수 있는 특징은 호출할 수 있음, 다른 값들처럼 사용 가능함으로, 변수나 객체, 배열 등에 저장 가능하며, 다른 함수에 전달되는 인수로도 사용, 또한 다른 함수의 반환 값으로 사용 가능하여 일급 객체라고 표현함. 함수 정의함수를 정의하는 방식 - 함수 선언식 (Function de.. 더보기
6. Immutability (객체와 변경불가성) 객체는 참조(reference) 형태로 전달하고 전달 받음. 객체가 참조를 통해 공유되고 있다면, 그 상태가 언제든지 변경될 수 있기 때문에 의도치 않은 변경이 발생되어 여러가지 문제가 발생 될 수 있음. 의도하지 않은 객체의 변경이 발생하는 원인의 대다수는 "레퍼런스를 참조한 다른 객체에서 객체를 변경"하기 때문.객체를 불변객체로 만들어 프로퍼티의 변경을 방지하여 객체의 변경이 필요한 경우에는 참조가 아닌 객체의 방어적 복사를 통해, 새로운 객체를 생성 후 변경 또는, Observer 패턴으로 객체의 변경에 대처. 1. immutable value vs. mutable valuejavascript의 기본 자료형(primitive data type)은 변경 불가능한 값(immutable value). -.. 더보기
5. Object (객체) 1. 객체 (Object)JavaScript는 객체(Object) 기반의 스크립트 언어이며, 기본 자료형을 제외한 나머지 값들 (함수, 배열, 정규표현식)은 모두 객체. 데이터와 그 데이터와 관련된 동작(절차, 방법, 기능)을 모두 포함할 수 있는 개념적 존재. 키(key)와 값(value)로 구성된 데이터를 의미하는 프로퍼티(property)와 동작을 나타내는 메소드(method)로 구성된 집합이며, 배열과 달리 구성 요소들의 순서를 보장하지 않음. 객체지향의 상속을 구현하기 위해 "프로토 타입" 이라는 객체의 프로퍼티와 메소드를 상속 받을 수 있음. 1.1 프로퍼티 (Property)객체는 이름(key)와 값(value)의 쌍인 프로퍼티들을 포함하는 컨테이너라로 할 수 있음.- 프로퍼티 이름 : 빈 .. 더보기

티스토리툴바