1. Login 창 구현 Log In const loginForm = document.querySelector("#login-form"); const loginInput = loginForm.querySelector("input"); const loginButton = loginForm.querySelector("button"); // 위의 다른 방법 // const loginInput = document.querySelector("#login-form input"); // const loginButton = document.querySelector("#login-form button"); function handleLoginBtnClick() { console.dir(loginInput); consol..
1. 함수 function sayHello(nameOfPerson) { console.log(nameOfPerson); } sayHello("nico"); // nico sayHello("del"); // del sayHello("lynn"); // lynn 데이터가 필요하면 function sayHello() 이 괄호에다 이름을 넣어주면 됨(어떤 이름이든) // argument 이렇게 하면 자바스크립트는, sayHello로 보내진 첫 번째 데이터가 nameOfPerson이라는 variable로 가게 된다는 것을 앎 이것이 우리가 바깥 세상에서 뭔가를 받는 방법(데이터를 function에 보내는 방법) 함수 밖에서 하면 에러가 뜸 argument는 값을 여러 개 받을 수도 있음 function sayHe..
- Javascript는 동기식 언어이다! 자바스크립트는 한 번에 하나의 작업을 수행 한 작업이 실행되는 동안 다른 작업은 멈춘 상태를 유지하고 자신의 차례를 기다리는 것 => 단일 스레드(싱글 스레드), 동기(Synchronous) console.log("hi"); console.log("hello"); console.log("bye") 이렇게 console.log()를 세 개를 입력하고, 출력 결과를 확인해보면 순서대로 "hi", "hello", "bye"가 찍힘 이렇게 나오는 이유는 Javascript의 Engine(V8) 주요 구성 요소가 Memory Heap와 Call stack이기 때문 - Memory Heap : 변수와 객체의 메모리 할당을 담당하는 곳 - Call Stack : 함수가 호출..
## TO DO LIST - 투 두 리스트 구현 -json-server를 활용해서 REST API 구축 및 연동 - 기본적인 데이터 처리인 생성, 읽기, 삭제(CRUD)를 구현 1. strict mode https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Strict_mode - 엄격하게 문법 검사를 실시하여 기존에는 무시되던 오류를 발생시킴 2. json-server https://github.com/typicode/json-server - 짧은 시간에 REST API를 구축해주는 패키지 - 실제 프로덕션에서는 사용하지 않음 - npm을 통하여 설치 가능 3. DOMContentLoaded https://developer.mozilla.org..
이렇게 또 한 주가 끝이 났습니다... 여러 모로 정신이 없는 한 주가 아니었나 싶어요... 어딘가 뒤죽박죽으로 얽혀있던 공부 방향성도 바로잡고, 파이어베이스를 이용한 팀프로젝트까지 시작이 되었습니다...! 전 원래 html, css를 제외하면 노베이스라고 봐도 과언이 아닌데, 그런 제게 있어서 cs, 알고리즘, 자료구조, 파이썬, 파이어베이스는 거의 처음 접하는 신물물 같은 느낌이었습니다... 도저히 어떻게 공부를 해야 할지 감을 잡을 수가 없었어요... 솔직히 말씀드리자면, 스파르타에 올라오는 강의들이 난이도가 조금 높은 부분도 있고, 생략된 부분들도 꽤 있어서 계속 공부를 하면서도 무언가 잘못되었다는 느낌을 조금 받았더랬죠... 그래도 커리큘럼을 따라가보자, 라는 생각으로 강의를 보면서 공부를 하고..
[ 기본 연산자와 값 ] X = 1 + 2 => 이항 연산자 X는 피연산자(값) +는 연산자이자 덧셈 연산자 =(equal)은 할당 연산자로 오른쪽에 값을 왼쪽에 할당하는 연산자 1. 이항 연산자 : 피연산자가 2개인 연산자 산술 연산자, 문자열 결합 연산자, 비교 연산자, 논리 연산자, 대입 연산자 등이 있음 2. 단항 연산자 : 피연산자가 단 하나뿐인 연산자 부호 연산자(+, -), 증감 연산자(++, –), 논리 부정 연산자(!)가 있음 연산자 : 산술 연산자 , 복합할당 연산자 , 할당 연산자 1. 산술 연산자 : + , - , * , / , % , ** 2. 복합할당 연산자 : += , -= , *= , /= , %= , **= 3. 할당 연산자 : = - 예제 x = 2*5; //10 y = ..