목록FrontEnd (99)
Muscardinus
Higher Order Function이란 함수를 argument로 받거나 return해주는 함수를 말한다. function multBy(a) { return function (b) { return a * b; }; } // can also be an arrow function const multiplyBy = (a) => (b) => a * b; const multByTwo = multiplyBy(2); const multByTen = multiplyBy(10); multByTwo(4); // 8 multByTen(5); // 50 이러한 HOF를 통하여, 우리는 중복되는 함수를 적게 작성할 수 있다. 쉽게 말해서 DRY(Do Not Repeat Yourself) 원칙을 지킬 수 있다
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/csntkk/btqQCyE4T3I/sprxMdoIawXXvL7HM5vPKK/img.png)
Constructor Function new 키워드와 함께 어떤 함수를 실행할 경우, 이 함수를 생성자 함수라고 한다. function Animal (name, age) { this.name = name; this.age = age; } const cat = new Animal("jane", 3); console.log(cat); // ? JS에서 보통 함수의 return 값이 명시되지 않으면, 기본적으로 undefined가 반환된다. 하지만 위의 코드를 실행시키면 알 수 있듯이, 특정 객체가 반환된다. 함수 뿐만 아니라, 거의 모든 것이 생성자를 통해서 선언이 가능하다. 심지어 우리가 알고 있는, numbers 와 string도 그렇다. const obj = {}; const arr = []; cons..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bwQtDB/btqQlKNgUg5/fkHjcAsoBy6qt4zKPKz3IK/img.png)
Lexical Environment? Lexical Environment란 JS Engine이 현재 읽고 있는 코드의 Scope 혹은 Environment를 말한다. 새로운 Lexical Environment는 괄호({})가 있을 때 마다 생성된다. Execution Context가 JS Engine에게 현재의 Lexical Environment를 알려주는 역할을 하고, 이에 맞게 사용할 수 있는 변수를 결정한다. Lexical Environment는 쉽게 생각해서 하나의 새로운 세계라고 생각하면 된다. function one() { var isValid = true; // local env two(); // new execution context (새로운 세계) } function two() { var..
Hoisting? Hoisting이란, 변수 및 함수를 Compile 단계에서 memory에 넣는 과정이다. JS에서는, function은 완전히 hoisting되고, 변수는 var로 선언된 변수는 hoisting 되고, undefined로 초기화된다. 완전한 hoisting이 아니다. let 과 const 변수는 hoisting이 되지만, undefined로 초기화 조차 안된다. var 보다 더 불완전한 hoisting이다. var로 선언된 변수는 따라서, code상으로 값이 할당되는 구간 전 까지는 undefined의 값을 가지게 된다. 반면, function의 경우, 완전히 hoisting이 되었기에, 어디에서나 호출된다. let과 const가 사용된 변수는, 선언 전에 호출 할 경우 referen..
Execution Context (실행 Context) JS는 항상 Execution Context 내에서 실행된다. Execution Context는 쉽게 말해서, 당신의 코드가 실행되고 있는 현재 환경을 말한다. JS에는 2가지(Global, Functional) Execution Context가 존재한다. 그리고 각각에는 두개의 단계로 이루어져있다. Creation과 Executing Phase이다. Global Execution Context Creation Phase Global Object 생성 this keyword를 global에 초기화한다 Executing Phase Variable Environment 생성 - var 변수와 function들을 위한 memory 공간 할당 var 변수들..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/9HtrC/btqQgzTgv5W/NWRAMRjTGmckL0ejDhMbLk/img.png)
Static과 Dynamic typed 언어의 가장 큰 차이는, 변수의 자료형을 확인 유무이다. Static Typed 언어(Java, C, C++, C#)은 compile 과정에서 확인되기 때문에, run-time 전에 type가 모두 확인 된다. Dynamic Typed 언어(JS, PHP, Python, Ruby)는 execution stage에서 확인된다. 이것에 관해서는 추후에 더 공부하고 보충할 예정이다.
Type Coercion이란? Type Coercion이란 한 값의 자료형을 다른 자료형으로 변형(convert)하는 것이다. 3가지의 conversion이 JS에 존재한다. to string to boolean to number let str = "My String"; let num = 1; str + num // My String1 let num = 1; let str = "1"; num == str; // true == 와 === 의 차이가 여기서 나타난다. === 는 == 와 다르게 type coercion 없이 두 값을 비교한다. 왠만해서는 === 로 값 들을 서로 비교하는 것이 좋다.
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/dslvuF/btqQjnx18qs/jSS63JpGWn41wPkVRLEiDk/img.png)
JavaScript의 7가지 Types Number Boolean String Undefined Null Symbol Object 참고: Undefined 와 Null의 차이 Undefined Vs Null Undefined is the absence of definition, it has yet to be defined, and nulll is the absence of value, there is no value there 이 7가지의 Types 중 Object는 가장 범용적인 자료형이라고 생각해도 좋다. 거의 모든 것이 Object라고 해도 과언이 아니다. • Booleans can be objects (if defined with the new keyword) • Numbers can be obj..