전체 글
-
Modern JavaScript 클로저FrontEnd/JavaScript 2023. 1. 29. 13:26
1. 클로저란 excution context 에서 필요한 개념으로, 함수 선언시 렉시컬 환경 (어디에 함수를 선언하였는가, 외부/내부)의 조합을 의미 excution context 관점에서 innerFunc이 호출되면 context에 stack이 쌓이고 Variable Object와 Scope chain, this에 바인딩할 객체가 결정된다. outerFunc의 Activation Object, 함수자신을 순차적으로 바인딩하며 scope chain이 바인딩한 객체가 렉시컬 스코프 범주의 개념이다. 반환된 내부 함수가 자신이 선언되었을 때의 환경 (Lexical environment)인 스코프를 기억하여 자신이 선언되었을 때의 환경(스코프)밖에서 호출되어도 Lexical environment를 기억하는 함..
-
Modern JavaScript 함수 호출방식FrontEnd/JavaScript 2023. 1. 28. 16:38
1. 함수 호출방식과 this 바인딩 기본적으로 Java 에서는 인스턴스 자신 (self)를 가리키는 참조변수이다. (this가 객체자신의 참조값을 가짐) - ex. this.age 는 멤버변수 age는 매개변수를 의미 javascript 에서는 this 바인딩 객체가 한가지가 아니라 해당 함수 호출 방식에 따라 결정. (동적) var foo = function () { console.dir(this); }; // 1. 함수 호출 foo(); // window // window.foo(); // 2. 메소드 호출 var obj = { foo: foo }; obj.foo(); // obj // 3. 생성자 함수 호출 var instance = new foo(); // instance // 4. apply/..
-
Modern JavaScript Strict modeFrontEnd/JavaScript 2023. 1. 28. 15:23
1. Strict mode 오타나 문법 실수로 발생하는 잠재적 오류를 해결하기 마련된 기능 (안정적인 개발환경) 'use struct'; 로 선언된다. 전역에 사용하는 것은 권장하지 않는다. 함수 단위로 적용하는 것도 권장하지 않는다. ESLint와 같은 린트 도구와 유사한 기능 (VsCode) IE 9 이하는 지원하지 않는다 // 즉시실행 함수에 strict mode 적용 (function () { 'use strict'; // Do something... }()); 2. Strict mode 가 발생시키는 에러 선언하지 않은 변수를 참조하면 ReferenceError가 발생 변수, 함수, 매개변수가 삭제될 경우 (ex. delete a) 중복된 함수 파라미터 이름을 사용하면 SyntaxError가 발..
-
Modern JavaScript 스코프FrontEnd/JavaScript 2023. 1. 22. 12:50
1. 스코프 스코프 : 참조 대상 식별자(identifier) 를 찾아내기 위한 유효범위 어디에 선언 되었는지 정해진 범위에 대한 규칙 식별자 이름의 충돌을 방지한다. 2. 스코프의 구분 전역 스코프 (Global scope) : 코드 어디에서든 참조 지역 스코프 (Local scope/ function-level scope) : 함수 코드 블록이 만든 스코프로 자신과 하위함수에만 참조 전역 변수 (Global variable) : 어디서든 참조 가능한 변수 (전역에서 선언) 지역 변수 (Local variable) : 해당 함수와 하위 지역에서만 참조 (함수 내에서 선언된 변수) 3. 스코프 특징 블록 레벨 스코프 (block-level scope) : ({...}) 코드블록 내에서 유효한 스코프 (..
-
Modern JavaScript 타입체크FrontEnd/JavaScript 2023. 1. 22. 00:06
1. typeof - 타입연산자 : 피연산자의 데이터 타입을 분자열로 반환 - 객체의 종류까지 구분체크는 어려움 typeof ''; // string typeof 1; // number typeof NaN; // number typeof true; // boolean typeof []; // object typeof {}; // object typeof new String(); // object typeof new Date(); // object typeof /test/gi; // object typeof function () {}; // function typeof undefined; // undefined typeof null; // object (설계적 결함) typeof undeclared; //..
-
Modern JavaScript 객체의 프로퍼티FrontEnd/JavaScript 2023. 1. 21. 20:16
1. 함수 객체의 프로퍼티 property : 속성이라는 뜻으로, 객체 내부의 속성을 의미 Person이라는 객체 안에 name, age이라는 key , key가 property를 의미 let person = { name : 'bigone', age : 30 } 2. argumnets property (인수) 인수를 적게 전달했을때는 undifined로 초기화 초과된 인수는 무시됨 가변인자 이용시에 유용 객체배열의 형태로 인자값 정보를 담고 있지만 실제배열이 아닌 유사배열객체 인수들의 정보를 담고 있는 순회가능한 유사배열 객체이며, 함수 내부에서 지역변수처럼 사용해도 에러가 발생하지 않는다. function multiply(x, y) { console.log(arguments); return x * y;..
-
Modern JavaScript 함수FrontEnd/JavaScript 2023. 1. 21. 18:44
1. 함수 함수란 : 작업 수행을 위해 필요한 statement 집합을 정의한 코드 블록 - 매개변수를 가지며 호출로 일괄 작업 가능 - 재사용측면에서 유용 함수 정의 방식 : 함수 표현식과 함수 선언문에서 사용한 함수명은 함수 몸체에서 자신을 재귀적 호출(Recursive function call)하거나 자바스크립트 디버거가 해당 함수를 구분할 수 있는 식별자의 역할을 한다. 2. 함수 선언문 함수 표현식 - 기명 함수 표현식(named function expression) var foo = function multiply(a, b) { return a * b; }; - 익명 함수 표현식(anonymous function expression) var bar = function(a, b) { return..