한입 크기로 잘라먹는 리액트(React.js)
1.#1.1 안녕 자바스크립트
HTML, CSS와 함께 웹페이지를 개발하기 위해서 만들어진 언어웹 내부에서 발생하는 다양한 기능을 만들 수 있는 언어웹을 움직이게 하는 웹의 근육이라고 표현 할 수 있음요소들의 내용, 배치, 모양을 정하기 위해 사용하는 언어색상이나 디자인 등의 수정은 불가요소들의 색
2.#1.5 자료형
동일한 속성이나 특징을 가진 원소들을 묶은 것: 기본형 타입: 프로그래밍에 있어 가장 기본적인 값들의 타입을 의미NumberStringBooleanNullUndefinedObject \- Array \- Function \- RegexExp
3.#1.6 형 변환
어떤 값의 타입을 다른 타입으로 변경하는 것을 말함개발자가 직접 설정하지 않아도 알아서 자바스크립트 엔진이 형 변환 하는 것을 말함개발자가 직접 함수 등을 이용해 형 변환을 일으킴
4.#1.7-1.8 연산자
프로그래밍에서의 다양한 연산을 위한 기호, 키워드를 말함 \- 덧셈 연산자 + \- 곱셈 연산자 \* \- 뺄셈 연산자 - \- 나눗셈 연산자 /
5.#1.9-1.10 조건문 & 반복문
특정 조건을 만족했을 때에만 실행되는 코드를 작성하기 위한 문법대표적으로 if, switch 조건문이 존재함어떠한 동작을 반복해서 수행할 수 있도록 만들어 주는 문법
6.#1.13 콜백함수
자신이 아닌 다른 함수에, 인수로써 전달된 함수를 의미 함
7. #1.14 스코프
우리말로 "범위"를 뜻함변수나 함수에 접근하거나 호출할 수 있는 범위를 말함
8.#1.15-1.16 객체
원시 타입이 아닌 객체 타입의 자료형여러가지 값을 동시에 저장할 수 있는 자료형을 의미
9.#2.1 Truthy와 Falsy
참이나 거짓을 의미하지 않는 값도, 조건문 내에서 참이나 거짓으로 평가하는 특징JavaScript의 모든 값은 Truthy 하거나 Falsy 함 \- 이를 이용하면 조건문을 간결하게 만들 수 있음
10.#2.2 단락 평가
논리 연산식에서 첫 번째 피연산자 값 만으로도 연산의 결과를 확정할 수 있다면 두번째 연산에는 접근조차 하지 않음
11.#2.3 구조 분해 할당
배열이나 객체에 저장된 여러 개의 값들을 분해해서 각각 다른 변수에 할당하는 방법
12.#2.5 원시타입 VS 객체타입
원시타입과 객체타입은 값이 저장되거나 복사되는 과정이 서로 다르기 때문Number, String, Boolean 등값 자체로써 변수에 저장되고 복사된다실제 메모리의 값은 변경되지 않음Object, Array, Function 등참조값을 통해 변수에 저장되고 복사된다실제
13.#2.6 반복문으로 배열과 객체 순회하기
배열, 객체에 저장된 여러개의 값에 순서대로 하나씩 접근하는 것을 말함
14.#2.7 배열 메서드 1 - 요소 조작
배열의 맨 뒤에 새로운 요소를 추가하는 메서드배열의 맨 뒤에 있는 요소를 제거하고, 반환배열의 맨 앞에 있는 요소를 제거, 반환배열의 맨 앞에 새로운 요소를 추가하는 메서드마치 가위처럼, 배열의 특정 범위를 찾아내서 새로운 배열로 반환두개의 서로 다른 배열을 이어 붙여
15.#2.8 배열 메서드 2 - 순회와 탐색
모든 요소를 순회하면서, 각각의 요소에 특정 동작을 수행시키는 메서드배열에 특정 요소가 있는지 확인하는 메서드특정 요소의 인덱스(위치)를 찾아서 반환하는 메서드얕은 비교로만 진행하기 때문에 객체 값은 찾지 못함모든 요소를 순회하면서, 콜백함수를 만족하는특정 요소의 인덱
16.#2.9 배열 메서드 3. 배열 변형
기존 배열에서 조건을 만족하는 요소들만 필터링하여 새로운 배열로 반환배열의 모든 요소를 순회하면서, 각각 콜백함수를 실행하고 그 결과값들을 모아서 새로운 배열로 변환배열을 사전순으로 정렬하는 메서드정렬된 새로운 배열을 반환하는 메서드배열의 모든 요소를 하나의 문자열로
17.#2.10 Date 객체와 날짜
특정 시간이 "1970.01.01 00시 00분 00초"(UTC)로 부터 몇 ms가 지났는지를 의미하는 숫자값
18.#2.11 동기와 비동기
여러 개의 작업을 순서대로 한 번에 하나씩 처리하는 방식JavaScript는 동기적으로 코드를 실행한다동기적이지 않다는 뜻작업을 순서대로 처리하지 않음Web APIs: 웹 브라우저가 직접 관리하는 별도의 영역
19.#2.13 비동기 작업 처리하기 2. Promise
비동기 작업을 효율적으로 처리할 수 있도록 도와주는 자바스크립트의 내장 객체비동기 작업을 감싸는 객체이다.비동기 작업 실행비동기 작업 상태 관리비동기 작업 결과 저장비동기 작업 병렬 실행비동기 작업 다시 실행기타 등등...setTimeout대기(Pending): 아직
20.#3 Node.js 기초
JavaScript 실행 환경(Run Time) = 구동기Chrome V8 JavaScript 엔진으로 빌드된 JavaScript 런타임웹 브라우저의 JavaScript는 웹 페이지 내부에 필요한 아주 단순한 기능만을 개발하기 위해 만들어짐매우 유연하고 작성하기 편리하
21.#4 React.js 개론
Meta가 개발한 오픈소스 JavaScript 라이브러리 \- 대규모 웹 서비스의 UI를 더 편하게 개발하기 위해 만들어진 기술 컴포넌트를 기반으로 UI를 표현한다.컴포넌트(Component): 구성요소 - 화면을 구성하는 요소, UI를 구성하는 요소를 의미화면 업
22.#5 React.js 입문
중괄호 내부에는 자바스크립트 표현식만 넣을 수 있다.숫자, 문자열, 배열 값만 화면에 렌더링 된다.모든 태그는 닫혀있어야 한다.최상위 태그는 반드시 하나여야만 한다.(적절한 최상위 태그가 없을 경우 빈 태그로 묶으면 됨)대신 빈 태그로 묶을 경우, 태그 없이 모든 요소