연습장

https://poiemaweb.com/js-control-flow Control Flow | PoiemaWeb제어문(Control flow statement)은 주어진 조건에 따라 코드 블록을 실행(조건문)하거나 반복 실행(반복문)할 때 사용한다. 일반적으로 코드는 위에서 아래 방향으로 순차적으로 실행된다. 제어문은 코poiemaweb.com 제어문(Control flow statement)주어진 조건에 따라 코드 블록을 실행(조건문)하거나 반복 실행(반복문)할 때 사용한다.일반적으로 코드는 위에서 아래 방향으로 순차적으로 실행된다.코드의 실행 순서를 인위적으로 제어할 수 있다 1. 블록문0개 이상의 문들을 중괄호로 묶은 것으로 코드 블록 또는 블록이라 한다.자바스크립트는 블록문을 하나의 단위로 취급한..

https://poiemaweb.com/js-operator Operator | PoiemaWeb연산자(Operator)는 하나 이상의 표현식을 대상으로 산술, 할당, 비교, 논리, 타입 연산 등을 수행해 하나의 값을 만든다. 이때 연산의 대상을 피연산자(Operand)라 한다. 피연산자도 평가되어 하나의poiemaweb.com  1. 표현식과 연산자 표현식(expression)은 리터럴, 식별자, 연산자, 함수 호출 등의 조합을 말한다. 표현식은 평가(evaluation. 표현식을 실행하여 하나의 값을 만드는 과정)되어 하나의 값을 만든다. 즉, 표현식은 하나의 값으로 평가될 수 있는 문(statement, 문과 표현식 참고)이다. 리터럴 (Literal):리터럴은 코드 상에서 직접적으로 값을 나타내는..

https://poiemaweb.com/js-data-type-variable Data type & Variable | PoiemaWeb변수는 값의 위치(주소)를 기억하는 저장소이다. 값의 위치란 값이 위치하고 있는 메모리 상의 주소(address)를 의미한다. 즉, 변수란 값이 위치하고 있는 메모리 주소(Memory address)에 접근하기 위해poiemaweb.com   프로그래밍이란 변수를 통해 값을 저장하고 참조하며연산자로 값을 연산, 평가하고조건문과 반복문에 의한 흐름제어로 데이터의 흐름을 제어하고함수로 재사용이 가능한 구문의 집합을 만들며객체, 배열 등으로 자료를 구조화하는 것이다. 변수는 값의 위치(주소)를 기억하는 저장소이다.값의 위치란 값이 위치하고 있는 메모리 상의 주소(address..

https://poiemaweb.com/js-syntax-basics Syntax Basics | PoiemaWebJavascript는 interactive한 웹페이지 작성을 가능하게 한다. 예를 들면, 이벤트(e.g. 버튼 클릭, 웹페이지 로딩 완료 등)에 반응하여 HTML 요소에 접근하고 HTML 요소를 조작할 수 있다. 정적인 HTML을 동적poiemaweb.com  1. 변수 변수(Variable)는 값(value)을 저장(할당)하고 그 저장된 값을 참조하기 위해 사용한다. 한번 쓰고 버리는 값이 아닌 유지(캐싱)할 필요가 있는 값은 변수에 담아 사용한다. 또한 변수 이름을 통해 값의 의미를 명확히 할 수 있어 코드의 가독성이 좋아진다. 변수는 위치(주소)를 기억하는 저장소이다. 위치란 메모리 상..

https://poiemaweb.com/js-browser Javascript Environment | PoiemaWeb대부분의 프로그래밍 언어는 운영체제(Operating System, OS) 위에서 실행되지만 웹 애플리케이션의 자바스크립트는 브라우저에서 HTML, CSS와 함께 실행된다. 따라서 브라우저 환경을 고려할 때 보다poiemaweb.com   구글의 Chrome V8 자바스크립트 엔진으로 빌드된자바스크립트 런타임 환경(Runtime Environment)인 Node.js의 등장 자바스크립트는 웹 브라우저를 벗어나 서버 사이드 애플리케이션 개발에서도 사용되는 범용 개발 언어가 되었다.하지만 자바스크립트가 가장 많이 사용되는 분야는 역시 웹 브라우저 환경에서 동작하는 웹 페이지/애플리케이션이다..

https://poiemaweb.com/js-hello-world Hello world | PoiemaWeb모든 브라우저는 자바스크립트를 실행할 수 있는 자바스크립트 엔진을 내장하고 있다. 뿐만 아니라 Node.js도 자바스크립트 엔진을 내장하고 있다. 따라서 자바스크립트는 브라우저와 Node.js 환경poiemaweb.com  자바스크립트는 브라우저와 Node.js 환경에서 실행할 수 있다. 브라우저HTML, CSS, 자바스크립트를 실행하여 웹 페이지를 화면에 렌더링클라이언트 사이드 Web API를 지원 (DOM, BOM, Canvas, XMLHttpRequest, Fetch, requestAnimationFrame, SVG, Web Storage, Web Component, Web worker)  N..

ESLintJavaScript 코드에서 문제를 식별하고 코드 스타일을 검사하는 도구입니다.일관된 코딩 스타일을 유지하고, 잠재적인 버그를 사전에 발견하여 코드 품질을 향상시키는 데 사용 ESLint의 주요 기능과 특징은 다음과 같습니다:문법 검사(Syntax Checking):ESLint는 JavaScript 코드의 문법을 엄격하게 검사하여 잘못된 구문이나 문법 오류를 식별합니다.예를 들어, 세미콜론 누락, 괄호의 정확한 사용 등을 검사합니다.코드 스타일 검사(Code Style Checking):ESLint는 설정 파일을 통해 정의된 코드 스타일 규칙을 기반으로 코드의 일관성을 검사합니다.들여쓰기, 공백 사용, 변수 선언 방식 등 여러 가지 스타일 규칙을 지원하며,개발 팀이 공통된 코딩 스타일을 유지할..

Webpack모듈 번들러(Module Bundler) , 웹 애플리케이션을 구성하는 자원(HTML, CSS, JavaScript, 이미지 등)을 모두 모듈로 보고이를 번들링하여 하나의 또는 여러 개의 번들 파일로 만들어주는 도구프론트엔드 개발에서 모듈간의 의존성 관리와 번들링 작업을 효율적으로 수행하기 위해 사용  번들 파일 (Bundle file)하나로 묶어서 관리하고 제공하는 파일네트워크 요청 수를 줄이기 때문에 로딩 시간이 단축코드 최적화 및 압축이 가능하여 파일 크기를 줄이고 성능을 향상모듈 간의 의존성을 관리필요한 경우 코드 스플리팅(Code Splitting)을 통해 필요한 모듈만 로딩 지원 번들링 (Bundling)프론트엔드 개발에서 여러 개의 파일(예: 자바스크립트 파일, CSS 파일, 이..

https://poiemaweb.com/js-introduction  Introduction | PoiemaWeb자바스크립트는 HTML, CSS와 함께 웹을 구성하는 요소중 하나로 웹브라우저에서 동작하는 유일한 언어로 1995년 Brendan Eich(Nescape)가 Navigator 2를 위하여 개발한 웹페이지에 포함되는 스크립트 언어poiemaweb.com    정적인 HTML을 동적으로 표현하기 위해 경량의 프로그래밍 언어“Mocha”로 명명되었다. 그해 9월 “LiveScript”로 이름이 변경되었고, 12월 “JavaScript”로 최종 명명 크로스 브라우징 이슈 : 브라우저에 따라 웹 페이지가 정상 동작하지 않음  모든 브라우저에서 동일하게 동작하는 표준화된 자바스크립트에 대한 필요성이 제기..

https://poiemaweb.com/coding Progmamming | PoiemaWeb프로그래밍은 수행되어져야 하는 명령을 컴퓨터에 전달하는 일종의 커뮤니케이션이다. 이때poiemaweb.com   1. 프로그래밍이란? 프로그래밍이란 컴퓨터에게 실행을 요구하는 일종의 커뮤니케이션이다. 이때 요구되는 것이 문제 해결 능력이다. 문제(요구사항)을 명확히 이해하는것 - 복잡함을 단순하게 분해 - 자료를 정리하고 구분 - 순서에 맞게 행위를 배열  2. 프로그래밍 언어 인간이 이해할 수 있는 구문으로 구성된 프로그래밍 언어를 사용하여 프로그램을 작성한 후번역기를 사용하여 (컴파일러, 인터프리터)컴퓨터가 이해할 수 있는 기계어로 변환    컴파일러(compiler)전체 파일을 스캔하여 한꺼번에 번역한다.초..