=>

ES5까지 변수를 선언할 수 있는 유일한 방법은 var키워드를 사용하는 것이었다. var 키워드는 독특한 특징이 있어 심각한 문제를 발생시킬 수 있다 먼저 var 키워드는 같은 스코프 내에서 중복 선언을 허용한다. 만약 동일한 이름의 변수가 이미 선언되어 있는 걸 모르고 변수를 중복 선언하면서 값까지 할당한다면, 의도치 않게 먼저 선언된 변수 값이 변경되는 부작용이 발생한다. 또한 var 키워드는 오로지 함수의 코드 블록만을 지역 스코프로 인정한다. 함수 외부에서 var 키워드로 선언한 변수는, 코드 블록 내에서 선언해도 모두 전역 변수가 된다. 이는 전역 변수를 남발할 가능성을 높이고 의도치 않게 전역 변수가 중복 선언되는 상황을 초래한다. 이러한 var 키워드의 단점을 보안하기 위해 ES6에서는 새로..

전역 변수의 무분별한 사용은 위험하다. 전역 변수를 반드시 사용해야 할 이유를 찾지 못한다면 지역 변수를 사용해야 한다. 전역 변수는 코드 어디서든 참조하고 할당할 수 있다. 따라서 코드의 가독성은 나빠지고 의도치 않게 상태가 변경될 수 있는 위험성도 높아진다. 또한 전역 객체의 생명 주기와 일치하기 때문에 메모리 리소스도 오랜 기간 소비한다. 특히 var 키워드의 경우, 중복 선언을 허용하므로 의도치 않은 재할당이 이뤄질 수 있다. 지역 변수는 전역 변수보다 생명 주기가 짧다. 따라서 상태를 변경할 시간도 짧고 기회도 적다. 이는 오류가 발생할 확률이 작다는 것을 의미한다. 메모리 리소스도 짧은 기간만 소비한다. 전역 변수의 사용을 억제하기 위해서는, 즉시 실행 함수, 네임스페이스 객체, 모듈 패턴 등..

자바스크립트의 스코프는 함수의 스코프에 의해 생성되며, 중첩에 의해 계층적인 구조를 가질 수 있다. let 이름 = '엄준식' function 엄() { let 이름 = '엄' let 어떻게 = '동탄' console.log(이름) // 엄 function 준(){ let 이름 = '준' console.log(이름) // 준 function 식() { let 이름 = '식' console.log(이름) //식 console.log(어떻게) //동탄 } 식() } 준() } console.log(이름) // 엄준식 변수를 참조할 때, 자바스크립트 엔진은 스코프 체인을 통해 변수를 참조하는 코드의 스코프부터 시작해서 상위 스코프 방향으로 이동하며 선언된 변수를 검색한다. 자바스크립트의 var 키워드는 오로지..

함수는 자바스크립트에서 가장 중요한 핵심 개념이다. 스코프, 실행 컨텍스트, 클로저, 생성자 함수에 의한 객체 생성, 메서드, this, 프로토타입 등 자바스크립트의 작동 원리 대부분이 함수와 연관되어 있다. 자바스크립트의 함수는 객체 타입의 값이다. 여러 값들 처럼 함수 또한 리터럴로 생성할 수 있다. const 변수 = funciton 함수이름(매개변수 목록) { retrun 반환값; } 다른 리터럴과 마찬가지로, 함수 리터럴도 평가되어 값을 생성하며, 이 값은 객체다. 즉 함수는 객체다. 자바스크립트에서 함수를 정의하는 방법은 4가지가 있다. function 함수선언문(x) { return x; { const 함수표현식 = function (x) { return x; }; const 생성자함수 = ..

원시 값의 경우, 변경 불가능한 값이며 한번 생성된 원시 값은 읽기 전용으로 변경할 수 없다. 변수에 값을 할당하고 재할당하는 경우, 값을 변경할 수 없기 때문에(불변성) 변수가 다른 메모리 공간을 가리키게 되고, 그곳에 값이 할당된다. 즉 변수의 식별자는 값을 가지는 것이 아니라 메모리 주소를 기억한다. 객체는 복합적인 자료구조로, 해시 테이블과 유사한 구조를 통해 구현된다. 객체는 참조 타입의 값으로, 원시 값과 다르게 변경 가능한 값이다. 객체는 원시 값의 식별자(값이 저장된 주소를 가리킴)와 다르게 값이 저장된 주소를 값으로 가진다. 원시 값과 객체를 복사한다면, 값을 새로 가지게 되는 원시 값과 다르게, 객체는 저장된 주소를 복제하므로, 같은 값을 가리키게 된다. 이러한 상황에서 객체의 값을 변..

자바스크립트는 객체 기반의 프로그래밍 언어이며, 원시 값을 제외한 나머지 값은 모두 객체다. 객체는 0개 이상의 프로퍼티로 구성된 집합이며 프로퍼티는 키와 값으로 구성된다. 함수 또한 프로퍼티 값으로 사용될 수 있지만, 일반 함수와 구분하기 위헤 메서드라 부른다. 프로퍼티는 객체의 상태를 나타내는 값, 메서드는 프로퍼티를 참조하고 조작할 수 있는 동작으로 설명할 수 있다. 객체는 객체 리터럴, 생성자 함수, 메서드, 클래스를 통해 만들어지며, 가장 일반적이고 간단한 방법은 객체 리터럴을 사용하는 것이다. 객체 리터럴은 중괄호 안에 프로퍼티를 정의하여 사용한다. 프로퍼티는 키와 값으로 구성되며 키는 식별자 역할을 하고 값에는 자바스크립트에서 사용할 수 있는 모든 값이 들어간다. 프로퍼티 키는 심벌과 문자열..

자바스크립트의 모든 값에는 타입이 존재하며, 이는 개발자의 의도에 따라 다른 타입으로 변환할 수 있다. 그러나 자바스크립트는 값을 평가하는 도중에 암묵적으로 타입이 변환되기도 한다. 이러한 상황을 피하기 위해, 명시적 타입 변환만을 사용해야 할까? 자바스크립트의 타입 변환을 제대로 이해한다면, 명시적 타입 변환보다 암묵적 타입 변환이 가독성 측면에서 더 좋을 수도 있다. 이를 위해 암묵적 타입 변환을 잘 이해해야만 한다. 산술 연산자와 비교 연산자는, 대체로 자신이 주어진 역할을 수행하기 위한 타입 변환을 진행하고, 이는 제어문 또한 마찬가지다. 제어문의 조건식에서는 논리적 참/거짓을 따지기 위해 값을 불리언 타입으로 변환하는데, 거짓으로 평가되는(Falsy 값) false, undefined, null..

제어문도 연산자와 마찬가지로, C-Family 언어와 유사하다. 제어문은 코드의 실행 순서를 변경시키며, 코드의 흐름을 어렵게 만든다. Javascript는 ES6 이후로, 고차 함수를 이용한 함수형 프로그래밍을 지원하므로, 제어문의 사용을 줄여 코드의 복잡성을 해결할 수 있다.

기본적인 연산자의 사용법은 C-Family 언어와 유사하지만, Javascript는 동적 타입을 가진 언어이기 때문에 연산자 사용시에 타입 변환이 일어날 수 있다. 숫자 타입이 아닌 연산자에 +, - 단항 연산자를 사용하면, 피연산자를 숫자 타입으로 변환하여 반환한다. 그러나, +연산자는 피연산자 중 하나 이상이 문자열인 경우 문자열 연결 연산자로 동작한다. ex) 1 + '2' // - > '12' 비교 연산자는 값을 비교하는 동등 연산자와, 타입까지 비교하는 일치 연산자가 있다. 만약, 서로 다른 타입을 가진 값에 동등 비교 연산자를 사용하면, 암묵적 타입 변환이 일어난다. 따라서 Javascript에서 값을 비교할 땐, 일치 연산자를 사용하는 편이 좋다.

Javascript의 데이터 타입은 총 7가지이다. 숫자,문자,불리언,undefined,null,심벌의 원시 타입과, 객체 함수 배열 등의 객체 타입이 있다. 먼저 숫자 타입은, 정수와 실수의 구분 없이 모두 부동소수점 형식의 실수로 처리된다. 문자열 타입은 '',"",``로 텍스트를 감싼 형태로 UTF-16의 전 세계의 대부분의 문자를 표현할 수 있다. ES6부터 템플릿 리터럴이 도입되었는데 ``(백틱)으로 문자열을 감싸서 표현하며, 이스케이프 시퀀스의 사용 없이, 공백, 탭 줄바꿈 등을 사용할 수 있다. 또한 ${} 안에 표현식을 삽입하여 간편하게 쓸 수 있다. undefined와 null은 변수에 값이 없음을 의미하는데, undefined는 Javascript 엔진이 사용하는 값이므로, 혼란을 피하..