공부방/JavaScript
-
Javascript IIFE 이해하기공부방/JavaScript 2019. 1. 2. 09:57
IIFE(Immediately Invoked Function Expressions: “Iffy”라고 발음)는 즉시 호출 함수 표현식의 줄임말입니다.기본적인 형태는 다음과 같습니다.1234(function () {// Do fun stuff})() 이것은 즉시 호출되는 익명 함수 표현식 입니다. 이것은 자바스크립트에서 때에 따라 중요하게 사용될 수 있습니다.함수 선언(Declaration)과 표현(Expression)IIFE를 설명하기 전에 함수의 선언(Function Declaration)과 함수의 표현(Function Expression)의 차이점에 대해 이해할 필요가 있습니다. Mozilla Developer Site의 함수에 대한 설명을 보면 함수 표현식은 선언과 동일한 문법을 가지고 단지 표현식에..
-
자바스크립트의 변수범위와 호이스팅공부방/JavaScript 2019. 1. 2. 09:56
이 글에서, 우리는 자바스크립트 변수의 범위(scope)와 호이스팅(hoisting), 그리고 이 두가지의 특징에 관해 배워보겠습니다.자바스크립트의 변수범위와 호이스팅이 작동하는 원리를 이해하는것은 필수적입니다. 이 두가지 컨셉은 직관적이면서도 이해하기가 쉽지 않습니다. 거기에는 미묘한 차이가 있으며, 자바스크립트 프로젝트에서 성공하기 위해서는 반드시 이해해야 합니다.변수 범위 (Variable Scope)변수 범위는 변수가 존재하는 컨텍스트입니다. 이것은 어디에서 변수에 접근할 수 있는지, 그 컨텍스트에서 변수에 접근할 수 있는지를 명시적으로 나타납니다.변수는 지역 범위(local scope)와 전역 범위(global scope) 둘 중 하나를 가집니다.지역 변수 (함수 수준 범위)대부분의 프로그래밍 ..
-
자바스크립트 클로저 쉽게 이해하기공부방/JavaScript 2019. 1. 2. 09:55
클로저(Closure)는 프로그래머가 창조적이고 인상적이며 간결한 프로그래밍을 할 수 있게 해줍니다. 클로저는 빈번하게 사용되며 자바스크립트 스킬과 관계없이 자주 마주치게 될 것입니다. 물론, 지금 당장 클로저는 복잡해 보일 수 있습니다만, 이 글을 읽고 클로저에 대해 이해하게 된다면 자바스크립트 코딩시에 매일 사용하게 될 것입니다.이 글은 비교적 클로저에 대해 간략히 설명하고 있습니다. 이 글을 계속 읽기전에 먼저 자바 스크립트의 변수 범위에 대해 이해할 필요가 있습니다. 만약, 그렇지 못하다면 블로그의 자바스크립트 변수의 범위와 호이스팅에 관한 글을 먼저 읽어 주시기 바랍니다.클로저란 무엇인가클로저는 외부함수(포함하고 있는)의 변수에 접근할 수 있는 내부 함수를 일컫습니다. 스코프 체인(scope c..
-
함수 표현식 vs 함수 선언식공부방/JavaScript 2019. 1. 2. 09:52
함수 선언식 - Function Declarations일반적인 프로그래밍 언어에서의 함수 선언과 비슷한 형식이다.function 함수명() { 구현 로직 } JsCopy// 예시 function funcDeclarations() { return 'A function declaration'; } funcDeclarations(); // 'A function declaration' JsCopy함수 표현식 - Function Expressions유연한 자바스크립트 언어의 특징을 활용한 선언 방식var 함수명 = function () { 구현 로직 }; JsCopy// 예시 var funcExpression = function () { return 'A function expression'; } funcExpr..
-
keyboard events: keyCode공부방/JavaScript 2017. 3. 16. 18:00
자바스크립트로 키보드 이벤트 발생 시의 keycode를 확인하는 방법은: document.getElementsByName("title")[0].onkeydown = function(event) { console.log('keydown - keyCode : ' + event.keyCode); console.log('keydown - which : ' + event.which); }; document.getElementsByName("title")[0].onkeypress = function(event) { console.log('keypress - keyCode : ' + event.keyCode); console.log('keypress - which : ' + event.which); };Colored..