아는만큼 보인다.

JavaScript에는 즉시 평가와 지연 평가라는 개념이 있습니다. 저는 즉시 평가와 지연 평가들에 대한 자료를 보고 "어떨 때 평가를 하는구나"정도만 알고 평가가 무엇인지 정확히는 몰랐습니다. 그래서 저는 즉시와 지연을 작성하기 전에 js에서 평가가 무엇인지 작성할테니 참고하고 보시면 좋을 것 같습니다.평가아래의 과정들을 포괄해 평가라고 부릅니다.코드 실행: JavaScript 엔진이 코드를 파싱하고 실행하는 과정값 도출: 표현식이나 문장으로부터 최종적인 값을 계산해내는 과정으로 연산자 적용, 함수 호출 결과 계산 등을 포함 타입 결정: 표현식의 결과가 어떤 데이터 타입인지 결정하는 과정변수 바인딩: 변수에 값을 할당하는 과정으로 이는 변수 선언과 초기화를 포함함수 실행: 함수 호출 시 인자를 평가하고..

RORO 패턴은 Recive an object, Return an object의 약자로 객체로 받고 객체로 반환한다는 뜻입니다. 명명된 인수RORO 디자인 패턴은 여러 장점이 있지만 보통 명명된 인수를 사용하고 싶을 때 많이 사용합니다.명명된 인수란 함수 호출 시 각 인수에 이름을 명시적으로 지정하는 것입니다. JS에는 없고 C#이나 Python에는 있는 기능이었지만 ES6의 구조 분해 할당이 나오면서 JS도명명된 인수를 사용할 수 있게 되었습니다. 코드로 보는 게 빠르겠죠? RORO 패턴 적용 전function printUserInfo(name, age, role) { const print = alert(`이름: ${name} 나이: ${age} 권한: ${role}`) return print;}c..

동기 vs 비동기JS에서 작업을 처리하는 방법은 동기와 비동기로 크게 두 가지가 존재합니다.둘의 차이점은 작업을 직렬적으로 처리하느냐 병렬적으로 처리하느냐입니다.직렬적으로 처리하는 동기는 작업이 끝나지 않으면 다음 작업을 수행할 수 없는 방식을 말합니다.즉, 이전 처리가 끝나지 않는다면 다음 작업은 끝날 때가지 기다려야하는 것을 의미합니다.이렇게 말하면 안 좋아보일 수 있지만 작업의 흐름을 한 눈에 파악하기 쉽다는 장점을 가지고 있습니다. 반대로 병렬적으로 처리하는 비동기는 작업이 처리중이든 상관하지 않고 다음 작업을 처리합니다.코드가 끝날 때까지 코드의 실행을 멈추지 않고 다음 코드를 먼저 실행하는 것을 의미합니다. 아래는 동기와 비동기의 이해를 돕기위한 자료입니다. callbackJS에서 비동기 처리..

this는 영어로 이것이라는 의미입니다. JavasScript에서 사용되는 this는 어떤 의미를 뜻할까요? thisthis는 실행 중인 코드에서 사용되는 객체를 참조하는데 사용되는 키워드입니다.this의 값은 함수의 호출 방식에 따라 변합니다. Global전역에서 this를 사용했을 때는 전역 객체를 가리킵니다. 브라우저상에서는 window가 전역 객체입니다.console.log(this); // window 만약 아무런 것으로도 감싸지 않고 전역에서 사용됐을 때 위 로그는 window를 찍습니다. 전역 객체인 window가 잘 감이 안 올 수 있는데 아래 예시를 봐보겠습니다.let globalValue = 10;console.log(this.globalValue); // 10..

안녕하세요! ES라고 아시나요? JavaScript를 포함한 스크립트 언어를 배운다면 흔히 접하는 단어입니다. 그 중에서도 ES6나 ES6이후 문법들이라는 말들이 되게 많습니다. ES는 뭐고 몇까지 있을까요? ES ECMAScript의 약자로 ECMA International이 정의하고 있는 표준화된 Script 프로그래밍 언어입니다. ECMA ECMA란 European Computer Manufacturers Association라는 정보와 통신 시스템을 표준화하는 기구입니다. 후에 국제적 확장을 고려하여 뒤에 International이라는 이름이 붙게 되었습니다. ECMA International은 JavaScript말고도 여러 언어의 규격을 표준하고 있는 기구입니다. 그 중 JavaScript는 E..

오늘은 정말 널리 알려져있고 중요한 Javascript의 타입 종류를 알아보겠습니다. let arr = [1, 2, 3, 4, 5]; let arr2 = arr; arr[0] = 10; console.log(arr2); 위 console.log의 값은 뭘까요? 정답은 [1, 2, 3, 4, 5]입니다. 혹시라도 [10, 2, 3, 4, 5] 일 수 있지 않나?라는 생각이 든다면 이번 글 잘 읽어주세요! ❓ 원시 타입? 원시? 저는 처음 들을 때 뭔가 고대적인 느낌이 났는데요..ㅎ JS의 원시 타입이란 실제 데이터 값을 저장하고 저장된 값을 변수가 직접적으로 가리키는 형태의 타입입니다. 종류로는 string, number, boolean 등 JS의 기본 데이터 타입들이 원시 타입에 해당합니다. 또한 원시 ..

음 저는 클로저라는 단어를 처음 들었을 때 바보같이 Closer라는 단어인 줄 알아서 가까운..? 했던 기억이 나네요! 하지만 클로저의 스펠링은 Closure! 폐쇄라는 의미를 가지고 있습니다. Javascript를 한다면 참 많이 듣는 단어 중에 하나가 아닐까 싶습니다. 이번 글에서는 Closure에 대해서 정리 해보겠습니다. ❓Closure 클로저는 JS에서 중요한 개념 중 하나입니다. 하지만 그래서 JS 고유의 개념이 아니라 함수를 일개 객체로 취급하는 함수형 프로그래밍 언어들에서도 사용되는 중요한 개념입니다. 클로저를 한 번쯤 검색해보신 분들은 아마 공통적으로 아래 문장과 비슷한 말을 보셨을 것 같습니다. 함수와 그 함수가 선언 된 Lexical Environment(어휘적 환경)의 조합이다. 음..

안녕하세요! 이번 글에서는 웹 개발에선 빠질 수 없는 Javascript라는 언어의 동작 방식에 대한 글을 써보려고 합니다.저는 2달 전에 졸업하신 선배님께 프론트엔드 모의 면접을 봤습니다! 이때를 기준으로 여러 기술의 동작원리와 내가 왜 쓰는지에 대한 생각들이 많이 들었고 또 공부했습니다. 저는 Javascript라는 언어로 개발을 합니다.그런데 Call Stack, Event Loop 등의 단어를 들어도 그게 무엇인지 전혀 몰랐습니다.. 반성해야 하는 부분이죠.Call Stack, Task Queue, Event Loop 등의 단어들은 JS 동작원리 그 자체라고도 할 수 있기 때문에 잘 읽어주세요!❓JS는 싱글 스레드Javascript는 싱글 스레드입니다. 스레드라는 단어가 무엇인지 알고 넘어가자면 ..