javascript 7

7. Javascript의 this와 execution context

this와 execution context 자바스크립트의 혼란스러운 개념 중 하나로 this키워드에 대해 알아보도록 하겠습니다. 더불어 실행 컨텍스트(execution context)도 간단히 알아보겠습니다. 실행 컨텍스트 또한 중요한 개념이기에, 다른 글에서 더욱 자세히 알아보겠습니다. this와 실행 컨텍스트, 이 두가지 개념을 함께 이해하면 더이상 this가 혼란스럽지 않을 것 입니다! 들어가기 앞서 실행 컨텍스트에 대해 먼저 간단히 알아보겠습니다. 실행 컨텍스트(execution context)란? 자바스크립트 엔진은 코드를 실행하기 위해서 실행에 필요한 여러가지 정보(변수, 함수, 스코프, this)들을 알고 있어야 합니다. 실행에 필요한 정보를 형상화하고, 구분하기 위해 자바스크립트 엔진은 이..

개발/Javascript 2021.07.20

6. Javascript의 strict mode

strict mode란? ECMAScript5(ES5)에서 소개된 strict mode(엄격 모드)에 대해 알아보겠습니다. 자바스크립트의 엄격 모드는 일반 코드와는 다른 시멘틱을 가지고 있기 때문에, 이를 지원하지 않는 브라우저에서는 엄격모드와 비-엄격 모드의 코드가 다른 방식으로 동작할 것입니다. 엄격 모드와 비-엄격 모드의 코드는 공존할 수 있습니다. 따라서 선택적으로 사용하는 것이 가능합니다. 엄격 모드에서는 평범한 자바스크립트의 시멘틱에 몇 가지 변경을 일으킵니다. 1. 기존에 조용히 무시되던 에러들을 throwing 합니다. 2. Javascript 엔진의 최적화 작업을 어렵게 하는 실수들을 바로잡습니다. 가끔씩 엄격 모드의 코드는 비-엄격 모드의 동일 코드보다 더 빨리 작동할 수 있습니다. 3..

개발/Javascript 2021.07.19

4. Javascript의 함수

함수란 어떤 작업을 수행하기 위한 로직을 정의 한 코드블록 입니다. 일반적으로 반복 되는 작업을 함수로 정의하고 재사용하여 효율적인 프로그래밍을 가능하게 합니다. 이외에 객체의 메소드, 정보 은닉, 클로저 등의 기능을 수행 할 수 있습니다. 1. 함수 정의 자바스크립트에서 함수를 정의하는 방법은 3가지가 있습니다. 1. 함수 선언문 2. 함수 표현식 3. Function 생성자 함수 1-1 함수 선언문 함수 선언문은 일반적으로 함수를 정의 할 때 사용되는 방법입니다. function 키워드와 함께 함수명, 매개변수(parameter), 함수 몸체로 이루어져 있습니다. // 함수 선언문 // // 함수명은 해당 함수를 구분할 수 있는 식별자(Identifier)로 // 함수 선언문에서 함수명은 반드시 필요..

개발/Javascript 2021.07.15

3. Javascript의 타입 변환

자바스크립트의 모든 값은 타입이 존재합니다. 그리고 값의 타입은 개발자에 의해 변환(명시적 강제변환, Type Casting)되거나, 자바스크립트 엔진에 의해 암묵적으로 변환(암시적 강제변환, Type Coercion) 될 수 있습니다. 차이는 명확하게 구분되어집니다. 명시적 강제변환은 의도적으로 타입변환을 하였기에 코드만 봐도 알 수 있으며, 암시적 강제변환은 다른 작업 도중 부수효과(Side Effect)로부터 발생하는 변환 입니다. 아래 코드에서 명시적 강제변환과 암시적 강제변환의 차이를 볼 수 있습니다. var x = 10; var str = x + ''; var str2 = String(x); console.log(typeof str, str); // 'string', '10' console.l..

개발/Javascript 2021.07.14

2. Javascript의 데이터 타입

데이터 타입의 종류 자바스크립트의 데이터 타입은 크게 기본형과 참조형으로 나눌 수 있습니다. 기본형 데이터 타입(원시형, primitive type) 숫자(Number), 문자(String), 불리언(Boolean), null, undefined, Symbol 참조형 데이터 타입(reference type) 객체(Object), 배열(Array), 함수(Function), 날짜(Date), 정규표현식(RegExp), Map, WeekMap, Set, WeekSet 기본형 데이터 타입 1. Number 자바스크립트는 다른 언어와 달리 하나의 정수와 실수 구분 없이 하나의 숫자 타입만 존재합니다. var integer = 10; // 정수 var f = 7.716; // 실수 var negative = -5..

개발/Javascript 2021.07.14

1. Javascript와 브라우저

Javascript 자바스크립트는 HTML, CSS와 함께 웹을 구성하는 요소 중 하나로 웹 브라우저에서 동작하는 유일한 언어이며, 개발자가 별도의 컴파일 작업을 수행하지 않는 인터프리터 언어(Interpreter Language)입니다. 인터프리터는 소스코드를 즉시 실행하고 컴파일러는 빠르게 동작하는 머신 코드를 생성하고 최적화하는데, 대부분의 모던 자바스크립트 엔진은 인터프리터와 컴파일러의 장점을 결합하여 비교적 처리 속도가 느린 인터프리터의 단점을 해결했습니다. 이를 통해 컴파일 단계의 추가적인 시간이 필요함에도 빠른 코드의 실행이 가능케 합니다. ECMAScript는 자바스크립트의 표준 명세를 말하며, 언어의 타입, 값, 함수 등 핵심 문법을 규정한 것입니다. 각 브라우저 제조사는 ECMAScri..

개발/Javascript 2021.07.14

0. Javascript 동작 원리 이해의 중요성

개발자가 해야 할 일은 문제를 해결하기 위한 방안을 고민하고, 문법에 맞게 코드로 구현해내는 일이다. 다시 말해 구현된 코드는 개발자가 의도한 대로 정확히 동작하여 문제를 해결해야 한다. 자신이 구현 한 코드가 어떻게 동작하고, 예측 가능하며 이것을 동료에게 설명할 수 있어야 한다. 이를 위해서는 기본 개념과 동작 원리에 대한 이해가 바탕이 되어야한다. 기본 개념과 동작 원리를 이해하지 못한 상태에서 구현하는 것은 신뢰할 수 없고 유지 보수하기 까다로운 코드가 될 것이다. 그리고, 어느 순간 성장을 멈추고 말 것이다. 기본 개념을 알고 있다는 것은, 정확한 용어를 사용할 수 있도록 한다. 정확한 용어의 사용은 명확한 의사소통을 가능케하며, 이는 협업의 기본이며 필수 요소이다. 동작 원리를 알고 있다는 것..

개발/Javascript 2021.07.14