JavaScript/기본
-
자바스크립트 - this?!JavaScript/기본 2020. 9. 3. 15:42
들어가기 전에, 먼저 대표적으로 JAVA 같은 객체지향 언어에서의 this는 클래스 인스턴스의 레퍼런스 변수를 말한다. 즉, 클래스(자세히는 인스턴스화 된 객체) 자기 자신을 뜻 한다는 의미이다. 하지만 자바스크립트에서 함수의 this 키워드는 다른 언어들과 비교하여 조금 다르게 동작한다. 다르게 동작하기 때문에 많이 헷갈리는 것 같다. 자바스크립트에서는 선언할 때 값이 결정되는 것이 있는데 그것을 클로져라고 하고, 반면에 호출하는 방법에 의해서 값이 결정되는 것이 있는데 그것을 바로 this라고 한다. 그 this를 낱낱이 파헤쳐보도록 하자. this는 대체 무엇인가? 할머니 : 나는 허리가 아프다. (나 === 👵) 아버지 : 나는 다리가 아프다. (나 === 👨) 어머니 : 나는 머리가 아프다. (..
-
자바스크립트 - 클로저(closure)란 무엇인가?JavaScript/기본 2020. 7. 25. 17:17
들어가기 전에, 렉시컬 스코프(Lexical Scope)를 먼저 알고 넘어가자. 참고! 자바스크립트 - 렉시컬 스코프(Lexical Scope) 들어가기에 앞서, Closure(클로져)를 이해하기 위해서는 반드시 렉시컬 스코프(Lexical Scope)를 이해해야 한다. 렉시컬 스코프란(Lexical Scope)란? 함수를 어디서 호출하는지가 아니라 어디에 선언하였� ljtaek2.tistory.com 클로저(closure)란 무엇인가? 클로저(closure)는 함수와 그 함수가 선언됐을 때의 렉시컬 환경(Lexical environment)과의 조합이라고 부르며, 내부 함수가 외부(enclosing) 함수 변수에 액세스(접근) 할 수 있는 자바스크립트의 기능을 말한다. 우선 예제를 먼저 보고 생각해보자..
-
자바스크립트 - 렉시컬 스코프(Lexical Scope)JavaScript/기본 2020. 7. 25. 12:27
들어가기에 앞서, Closure(클로져)를 이해하기 위해서는 반드시 렉시컬 스코프(Lexical Scope)를 이해해야 한다. 렉시컬 스코프란(Lexical Scope)란? 함수를 어디서 호출하는지가 아니라 어디에 선언하였는지에 따라 결정되는 것을 말한다. 즉, 함수를 어디서 선언하였는지에 따라 상위 스코프를 결정한다는 뜻이며, 가장 중요한 점은 함수의 호출이 아니라 함수의 선언에 따라 결정된다는 점이다. 다른 말로, 정적 스코프(Static scope)라 부르기도 하다. 아래의 예시 코드가 어떻게 동작할지 생각해보자.
-
자바스크립트 - 스코프 체인(scope chain)란?JavaScript/기본 2020. 7. 20. 20:01
스코프 체인(scope chain)이란? 스코프 체인(Scope Chain)은 일종의 리스트로서 전역 객체와 중첩된 함수의 스코프의 레퍼런스를 차례로 저장하고, 의미 그대로 각각의 스코프가 어떻게 연결(chain)되고 있는지 보여주는 것을 말한다. 하지만 스코프 체인(scope chain)을 이해하기 위해서 먼저 자바스크립트의 실행 컨텍스트(Execution context)를 알아야 한다. 그렇다면 실행 컨텍스트란 무엇인가? 실행 컨텍스트(Execution context)는 우리가 작성한 코드가 실행되는 환경을 말하며, scope, hoisting, this, function, closure 등의 동작원리를 담고 있는 자바스크립트의 핵심원리를 말한다. 그리고 이 실행 컨텍스트에는 두 개의 실행 컨텍스트가..
-
자바스크립트 - 호이스팅(Hoisting)이란?JavaScript/기본 2020. 7. 19. 16:54
호이스팅(Hoisting)이란? scope(스코프) 안에서의 변수 선언을 최상위에서 선언한 것과 동등하다는 의미를 가진다. 즉, 변수가 선언되기 이전에 변수를 사용하면, 변수가 사용된 블럭 범위의 맨 위로 변수를 끌어올린다는 말이다. var x = '외부 scope'; function fnc() { console.log(x); // undefined var x = '내부 scope'; }; fnc(); 함수 fnc를 실행해보면, 콘솔 창에는 undefined가 출력이 된다. 왜 undefined가 출력이 될까? 그 이유는 var 키워드로 선언된 변수는 선언 단계와 초기화 단계가 한번에 이루어지는데, scope(스코프) 안에서 선언된 변수는 항상 최상위에 선언한 것과 동등한 의미를 가지기 때문에 즉, 호이..
-
자바스크립트 - scope(스코프)란?JavaScript/기본 2020. 7. 19. 01:17
scope란? 변수에 접근할 수 있는 범위를 의미한다. 이 범위는 변수의 접근성을 관리하는 정책이며, scope에는 global(전역)와 local(지역) 2개의 범위가 존재한다. global(전역) scope const name = "Lim"; // 전역 스코프 function print(){ console.log(name); // Lim } print(); console.log(name); // Lim 먼저 name이라는 변수를 정의하고 print 함수 블록 안과 밖에 console.log(name)을 출력하면 둘 다 같은 값이 나온다. 따라서, 변수 name은 전역 스코프라고 볼 수 있다. 전역 scope로 선언된 변수는 모든 범위에서 사용할 수 있다. local(지역) scope 코드 블록 내부에..
-
자바스크립트 - 클래스 기본 개념JavaScript/기본 2020. 5. 6. 10:41
Class의란? Class는 사실 함수이다. 함수는 함수 표현식과 함수 선언으로 정의할 수 있듯이 class 문법도 class표현식과 class선언 두 가지 방법을 제공한다. Class의 선언 class를 정의하는 한 가지 방법은 class 선언을 이용하는 것이다. class를 선언하기 위해서는 클래스의 이름과 함께 class 키워드를 사용해야 한다. class Person { constructor(name, age) { this.name = name; this.age = age; } } 단, 함수 선언과 클래스 선언의 중요한 차이점은 호이스팅 여부이다. 함수 선언의 경우 호이스팅이 일어나지만, 클래스 선언은 그렇지 않다. 클래스를 사용하기 위해서는 클래스를 먼저 선언 해야하며, 그렇지 않으면 Refer..
-
자바스크립트 - 객체 메소드 정리JavaScript/기본 2020. 5. 5. 19:33
자바스크립트에서 객체를 어떻게 선언하고, 사용할 수 있는지 알아보자. 먼저 객체는 {}(중괄호)로 감싸져 있고, :(클론)으로 구분된 이름/값 쌍들이 , (쉼표)로 분리된 목록의 형태이다. 다시 말하면 객체는 이름과 값으로 구성된 프로퍼티의 집합이라고 할 수 있다. 위에서 propertyName1,2로 나누었는데, 프로퍼티 이름은 중복이 되면 안 되기 때문에 숫자로 구분해 놓았다. 객체를 만들때는 규칙 1. property 이름은 중복될 수 없다. 2. property이름과 property값 사이에 :(콜론)으로 구분한다. 3. property를 추가할 때는 , (쉼표)를 붙여준다. 4. property 값에는 어느 type이나 가능하다.(string, numberm array, object, funct..