091

1. 기초 문법 (1) const/let- js에서는 변수를 선언할 때 var, const, let 세개의 키워드를 사용합니다. var은 스코프와는 무관하게 재선언이 가능하기 때문에 값이 아예 재선언, 재할당되면서 크기가 큰 프로젝트를 할 때 사용하지 않게 됩니다. 하지만, 블록스코프가 있으며 재할당만 가능한 let을 더 사용하게 되었고, const는 재선언, 재할당 모두 불가능하지만 내부에서 객체/배열 내부 값은 변경이 가능하기 때문에 자주 사용됩니다.-> React에서는 주로 const를 기본으로 사용하고 값 자체가 변경해야할 때 let을 사용합니다.let x = 1;if (true) { let x = 99; // 블록 안의 별개의 x}console.log(x);const user = { name:..

1. 프론트엔드와 서버 통신 (0) HTML 은 페이지 전체 새로고침을 해야합니다. 조회(1) AJAX(Asynchronous JavaScript and XML)은 HTML 태그를 통한 동기식 요청을 사용하지 않고 페이지 전체를 새로고침하지 않아도 화면의 특정 부분만 동적으로 갱신할 수 있는 기술입니다. 초기에는 XMLHttpRequest(XHR) 객체를 사용했지만, 콜백 함수(어떤 작업이 끝난 후에 실행되도록 다른 함수에 전달되는 함수) 기반으로 설계되어있던 XHR은 비동기 처리가 복잡해질수록 콜백 지옥(코드가 계속 중첩됨)을 유발했으며, API 설계가 직관적이지 않았습니다. 그리하여 JSON 포맷이 API 통신의 절대적인 표준이 되었습니다.- XHRconst xhr = new XMLHttpRe..

01.객체(Object)- 객체 : 자료형 여러 개를 한 번에 저장, 객체는 키를 이용하여 접근할 수 있음var object = { number: 091, string: "공구일", boolean: true, array: [1,2,3,4], method: function () { console.log(`my name is ${this.string}`); }};for(let key in object){ console.log(key+":"+object[key]);}- 속성과 메서드로 구성돼있으며,  this키워드를 통해 자신이 가진 속성임을 나타냄(만약에 string을 그냥 써줬으면 전역변수에서 찾기 때문에 결과값이 undefined로 나옴)

01. DOM(Document Object Model)- 웹 페이지의 구조를 객체 모델로 표현한 것으로,  트리 구조로 변환하여 페이지를 표시함 -> 모든 요소를 객체로 다루고, 자바스크립트를 통해 동적으로 조작할 수 있게 해주는 것이지의 구조를 객체 모델로 표현한 것으로, 트리 구조로 변환하여 페이지를 표시함 -> 모든 요소를 객체로 다루고, 자바스크립트를 통해 동적으로 조작할 수 있게 해주는 것=> API(Web or XML page) = DOM + JS(scripting language) // DOM은 프로그래밍 언어와는 독립적으로 디자인 02. DOM의 document 객체의 메서드 및 프로퍼티- JavaScript에서 HTML문서를 표현하는 객체로, DOM(Document Object Model..

01. 함수(Function)- 함수 : 일련의 명령어를 묶어 재사용 가능한 코드 블럭을 만들 수 있도록 하는 개념 => 조직화, 모듈화, 반복코드 최소화function 함수명(매개변수 리스트) { //반복사용할 코드}- 함수에는 기본적인 선언적 함수, 이름이 없는 익명함수, 선언되자마자 실행되는 즉시 실행 함수(IIFE), 화살표 함수등이 있음* 선언적 함수와 익명 함수의 차이점 : 선언적 함수의 경우 호이스팅이 발생돼 선언되기 전 호출이 가능함- 이름이 같은 함수가 선언돼있는 경우, 가장 마지막에 입력된 값이 저장함 -> 이름이 같을 때는 더 나중에 선언된 것으로 var 함수 = function() { console.log("익명 함수"); }function 함수() { console.log("선언적..

01. 연산자- 산술 연산자(Arithmetic  operator)기호역할+,-,*,/더하기, 빼기, 곱하기, 나누기의 사칙연산%,**나머지, 거든제곱 연산++,--증감 연산- 대입 연산자(Assignment operator)기호역할=대입 연산+=,-=,*=,/=,%=,**=산술 연산자와 결합해 사용하는 것으로 자기자신한테 더할 때 사용 (ex) ( a = a + 3 ) == ( a += 3 )- 논리 연산자(Logical operator) 기호 역할&논리 AND &&조건부 논리 AND ( Short-circuit Rule 적용 ) |논리 OR||조건분 논리 OR ( Short-circuit Rule 적용)!NOT - 비교 연산자(Relation operator)기호 역할== 양쪽 피연산자가 같음(타입무..

01. 토큰- 소스 코드에서 의미를 가지는 가장 작은 단위-> 식별자(Identifier) : 변수,함수, 클래스 등의 이름을 지정하는 데 사용, lower camel case 형식으로 변수 이름,함수 이름, pascal case 형식으로 클래스 이름을 작성함 *식별자 생성 규칙 - 키워드 사용불가, 특수문자 _와 $만 허용, 숫자시작 불가능, 공백 입력 불가-> 키워드(Keywords) : 자바스크립트에서 특별한 의미를 가지며 특정 작업을 수행하는 데 사용되는 예약어-> 리터럴(Literals) : 직접적으로 사용되는 값-> 연산자(Operators) : 값을 조작하거나 비교하는데 사용하는 기호-> 구분자(Delimiters) : 코드의 구조를 정의하는 데 사용되는 기호 (ex) 괄호, 세미콜론, 콜론..