JavaScript, Vue(12)
-
Introduction of Vue
프론트엔드 ⇒ Client-side frameworks Frontend Development웹 사이트와 웹 애플리케이션의 사용자 인터페이스(UI)와 사용자 경험(UX)을 만들고 디자인하는 것HTML, CSS, 자바 스크립트 등을 활용하여 사용자가 직접 상호작용 하는 부분을 개발한다. Client-side frameworks클라이언트 측에서 UI와 상호작용을 개발하기 위해 사용되는 자바 스크립트 기반 프레임워크자바 스크립트는 본래 브라우저 내부에서 동적 기능을 지원하는 역할에 지나지 않았으나 노드가 출시되면서 브라우저 외부에서도 쓰이게 됨.웹에서 단순히 문서를 읽는 것을 넘어서 많은 일을 하게 되면서 중요성이 커졌다.웹 페이지 → 웹 애플리케이션ex) Vue, React, Angular Single Pag..
2024.04.25 -
비동기 JavaScript
Synchronous (동기) 프로그램의 실행 흐름이 순차적으로 진행 → 하나의 작업이 완료된 후에 다음 작업이 실행된다. = 앞의 작업이 끝나야 뒤 작업이 가능 Asynchronous (비동기) 프로그램의 실행 흐름이 순차적이지 않으며, 작업이 완료되기를 기다리지 않고 다음 작업을 실행하는 방식, 동시에 다른 작업들을 수행할 수 있다. 특징 : 병렬적 수행 + 당장 처리를 완료할 수 없고 시간이 필요한 작업들은 별도로 요청을 보낸 뒤 응답이 빨리 오는 작업부터 처리 Thread 작업을 처리할 때 실제로 작업을 수행하는 주체 javascripts 는 Single Thread 언어로 한번에 하나의 일만 수행할 수 있다. 브라우저 환경의 자바 스크립트 비동기 처리 관련 요소 자바 스크립트 엔진의 Call S..
2024.04.23 -
JavaScript : Event
event무언가 일어났다는 신호, 사건모든 DOM 요소는 이러한 이벤트를 만들어내고 이벤트가 발생하면 event 객체가 생성된다. event handler이벤트가 발생했을 때 실행되는 함수 .addEventListener ( type, handler )대표적인 이벤트 핸들러 중 하나특정 이벤트를 DOM 요소가 수신할 때마다 콜백 함수를 호출 addEventListener 의 인자type : 수신할 이벤트 이름, 문자열로 작성한다.handler : 발생한 이벤트 객체를 수신하는 콜백 함수, 발생한 이벤트 객체를 유일한 매개변수로 받고 반환 값이 없다. 버블링한 요소에 이벤트가 발생하면, 이 요소에 할당된 핸들러가 동작하고, 이어서 부모 요소의 핸들러까지 동작하는 현상가장 최상단의 조상 요소를 만날 때까지 ..
2024.04.23 -
JavaScript : 참조 자료형
Function참조 자료형에 속하며, 모든 함수는 Function object 이다. 함수를 정의하는 2가지 방법선언식 ⇒ 익명 함수 사용이 불가능하고 호이스팅이 발생한다.표현식 ⇒ 함수 이름이 없는 익명 함수를 사용할 수 있다. 선언식과 달리 표현식으로 정의한 함수는 호이스팅 되지 않으므로 함수를 정의하기 전에 먼저 사용할 수 없다. 기본 함수 매개변수전달하는 인자가 없거나 undefined 가 전달될 경우 이름 붙은 매개변수를 기본값으로 초기화한다. 나머지 매개변수임의의 수의 인자를 배열로 허용하여 가변 인자를 나타낸다.함수 정의 시 나머지 매개변수는 하나만 작성할 수 있고 함수 정의에서 매개변수 마지막에 위치해야 한다. 매개변수와 인자 개수가 불일치할 경우인자 개수가 부족하면 누락된 인자를 unde..
2024.04.18 -
JavaScript : Basic Syntax
식별자(변수명) 작성 규칙숫자로 시작할 수 없다. 반드시 문자, 달러($) 또는 밑줄( _ )로 시작한다.대소문자를 구분하고 for, if, function 등의 예약어는 사용 불가하다. 식별자(변수명) Naming case카멜 케이스(camelCase) → 변수, 객체, 함수에 사용파스칼 케이스(PascalCase) → 클래스, 생성자에 사용대문자 스네이크 케이스(SNAKE_CASE) → 상수에 사용 변수 선언 키워드letconstvar letlet으로 선언한 변수는 블록 스코프 안에서만 유효한 지역 변수가 된다.변수에 재할당은 가능하지만, 똑같은 변수 재선언은 불가능하다.초기값 없이 변수 선언도 가능하다. 이 경우 자바 스크립트에서 undefined 를 부여한다. const (=constant 상수 ..
2024.04.18 -
JavaScript : DOM
ECMA ScriptEcma international이 정의하는 표준화된 스크립트 프로그래밍 언어 명세스크립트 언어가 준수해야 하는 규칙, 세부사항 등을 제공하고 있다. 자바 스크립트는 ECMA Script 표준을 따르는 프로그래밍 언어다.ECMA Script는 언어의 핵심을 정의하고 자바 스크립트는 ECMA Script 표준을 따라 구현된 언어다. DOM (The Document Object Model)웹 페이지를 구조화된 객체로 제공하여 프로그래밍 언어가 페이지 구조에 접근할 수 있는 방법을 제공 → 문서 구조, 스타일, 내용 등을 변경할 수 있도록 한다.⇒DOM에서 모든 요소, 속성, 텍스트는 하나의 객체로서 모두 document 객체의 하위 객체로 구성된다.브라우저는 HTML 문서를 해석하여 DO..
2024.04.16