썸네일 PEG.js 란? 개념과 사용법 (feat. Peggy) 📣 들어가며 이번 포스팅에선 PEG.js 의 설치 및 사용법에 대해 다룬다. PEG.js 란? PEG.js 는 Parsing Expression Grammer(PEG) 를 기반으로 하는 자바스크립트 파싱 라이브러리이다. PEG.js 를 사용하면 문자열이 특정 문법 규칙을 따르는지 검사하거나, 구문을 분석하여 구조화 데이터로 변환하는 작업을 수행할 수 있다. PEG.js 설치 및 사용 방법 PEG.js 설치 PEG.js 는 어떤 변환 작업을 수행하는 컨버터이다. pegjs 라는 명령어로 .pegjs 라는 확장자 명을 가진 파일을 javascript 로 변환 시킬 수 있다. 또는, 프로젝트 내에서 PEG.js 를 주입하여 런타임 중 변환을 시킬 수도 있다. pegjs 명령어를 통해 변환을 시키려면 pegjs..
썸네일 Node.js란? NPM이란? NVM이란? (feat. Express.js) 🐸 Node.js 란? 공식 문서에 따르면, "Node.js는 Chrome V8 JavaScript 엔진으로 빌드된 JavaScript 런타임입니다." 라고 설명하고 있다. 💡 Chrome V8 JavaScript 엔진 구글에서 제작한 자바스크립트 엔진 여기서 자바스크립트 엔진이란 자바스크립트 코드를 실행하는 프로그램 또는 인터프리터를 뜻한다. 💡 JavaScript 런타임 런타임은 프로그래밍 언어가 구동되는 환경을 말한다. 즉, JavaScript 언어가 구동되는 환경. 종합하자면, Node.js는 Javascript 를 실행 시킬 수 있도록 하는 오픈소스 서버 환경이다. 로컬 컴퓨터에서 JavaScript 로 개발을 하고싶다면 Node.js 를 설치해야한다. 🤓 Java를 개발하기 위해 JRE(JVM..
썸네일 [JavaScript] use strict? 엄격 모드란? 📢 들어가기 전에 본 포스팅에선 모던 JavaScript 튜토리얼을 학습/복습한 내용을 다룬다. 😈 엄격모드란? 자바 스크립트는 기존 기능을 변경하지 않으면서 새로운 기능을 추가해왔기 때문에 호환성 문제가 없었다. 하지만 ES5부터 새로운 기능이 추가되고 기존 기능의 일부가 변경되었다. 기존 기능이 변경되어 호환성에 문제가 생기게 되었고, 이를 방지하기 위한 것이 엄격 모드(strict mode) 이다. 👉 엄격 모드를 쓰지 않으면 과거 스크립트와의 호환성을 유지할 수 있기 때문에 지금의 문법과 맞지 않는 과거의 코드가 작동할 수 있게된다. 👉 엄격 모드를 활성화하면 모던 자바스크립트가 기준이 되어 과거에 짜 놓은 코드가 동작하지 않게될 수도 있다. 😈 엄격모드 사용 방법 스크립트 최상단에 단순한 문자열..
썸네일 [JavaScript] 자바스크립트란? (개념 및 특징) 📢 들어가기 전에 본 포스팅에선 모던 JavaScript 튜토리얼을 학습/복습한 내용을 다룬다. 💛 자바스크립트란? 자바스크립트는 웹 페이지에 생동감을 붙어넣기 위해 만들어진 프로그래밍 언어이다. 스크립트 자바스크립트로 작성한 프로그램을 스크립트라고 부른다. 스크립트는 웹페이지의 HTML안에 작성할 수 있는데, 웹 페이지를 불러올 때 스크립트가 자동으로 실행된다. 스크립트는 컴파일러 없이 보통의 문자 형태로 작성/실행할 수 있다. "자바"스크립트라고 불리는 이유 위 스크립트의 특징을 보면, 자바(JAVA)랑은 매우 다른 언어임을 알 수 있다. 하지만 왜 자바스크립트라고 불리는걸까? 처음 자바 스크립트가 만들어졌을 때는, LiveScript 라는 이름으로 불렸다. 그런데 그 당시 자바의 인기가 아주 높은 ..
썸네일 [JavaScript] 실행 컨텍스트, 스코프 체인과 클로저 🚗 브라우저란? 인터넷 상에서 웹에 연결 시켜주는 윈도우 기반의 소프트웨어이다. 그 예로, 크롬, 파이어폭스, 사파리, 엣지 등을 브라우저라고 부른다. 🚗 브라우저 구성 사용자 인터페이스 주소 표시줄, 이전/다음 버튼, 북마크 메뉴 등 브라우저 엔진 사용자 인터페이스와 렌더링 엔진 사이의 동작을 제어 렌더링 엔진 요청한 콘텐츠 표시. 예를 들어 HTML을 요청하면 HTML과 CSS를 파싱하여 화면에 표시함 통신 HTTP 요청과 같은 네트워크 호출에 사용됨 자바스크립트 해석기(엔진) ✔ 자바스크립트 코드를 해석하고 실행한다. 브라우저마다 이 엔진이 다르다. V8, Rhino, SpiderMonkey, Nashron 등이 있다. UI 백엔드 콤보 박스와 창 같은 기본적인 장치를 그림. 플랫폼에서 명시하지 않..
썸네일 [JavaScript] Scope란? (스코프 체인, 실행 컨텍스트...) 🛒 Scope란? Scope는 직역하면 "범위"라는 뜻이다. JavaScript 에서 Scope(스코프)는 변수에 접근할 수 있는 범위를 말한다. 식별자(변수)를 찾기위한 규칙이라고도 한다. var x = 'global'; function foo () { var x = 'function scope'; console.log(x); } foo(); // ? console.log(x); // ? 위 예제에서 x가 두번 선언되었는데, JavaScript는 각 x가 어떤 값을 가지는지 어떻게 구별할 수 있을까? 위 예제에서 전역에 선언된 변수 x는 어디에든 참조할 수 있다. 하지만 함수 foo 내에서 선어도니 변수 x는 함수 foo 내부에서만 참조할 수 있고, 외부에서는 참조할 수 없다. 이러한 규칙을 스코프 라..

티스토리툴바