본문 바로가기

전체 글

(290)
[React] 인덱스 파일에서 하는 일 index.js import ReactDOM from 'react-dom'; ReactDOM.render(안녕 리액트!, document.getElementById('root')); // react 에서는 render 메소드로 화면을 그림​ 첫번째 아규먼트 값으로 요소를 만들고, 두번째 아규먼트 값 사이에 그 값을 넣어줌 안녕 리액트! 이런 형태의 값이 나오게 됨. index.html 리액트가 실행되면 브라우저는 이 파일을 실행하며, root 값은 이 파일에서 확인할 수 있음.
[JavaScript] 복합 할당연산자/ 증가, 감소연산자 [복합 할당연산자] 할당 연산자와 결합해서 자주 쓰이는 표현을 더 간략하게 쓸 수 있게 해주는 연산자를 복합 할당 연산자(Compound assignment operators)라고 한다. // 다음 두 줄은 같습니다 x = x + 1; x += 1; // 다음 두 줄은 같습니다 x = x + 2; x += 2; // 다음 두 줄은 같습니다 x = x * 2; x *= 2; // 다음 두 줄은 같습니다 x = x - 3; x -= 3; // 다음 두 줄은 같습니다 x = x / 2; x /= 2; // 다음 두 줄은 같습니다 x = x % 7; x %= 7; [증가, 감소 연산자] 변수의 값을 1씩 증가시키거나 감소시킬 때는 복합 할당 연산자보다 더 간략하게 쓸 수 있는 증가연산자, 감소연산자를 사용할 수..
[JavaScript] 자료형 1. 숫자 (Number) 정수 (integer) : -3, 5, 10, 0 소수 (floating point) : 3.14, 5.9, 0.031 기본적으로 사칙연산이 가능하다. 2. 문자열 (String) 큰따옴표, 작은따옴표를 앞뒤로 감싼 형태로 앞뒤 따옴표를 통일해 주어야 함. "drink" , 'coke' 더하기 기호를 쓸 수 있는데, "drink" + "coke" = "drinkcoke" 처럼 사용가능 하다. 3. 불린(Boolean) 참 혹은 거짓을 나타내는 것 참 (True) : 8 > 6 거짓 (False) : 6 > 8
[React] 리액트 실행/ 커맨드 요약 1. creat-react-app 으로 프로젝트 생성 npm init react-app 혹은 폴더를 vsc로 열고 터미널에서 npm init react-app . 2. 개발모드실행 npm run start 3. 개발모드종료 Ctrl + C
[JavaScript] 구구단 게임 Math.random(); 0~0.1 사이의 무작위 수를 랜덤으로 추출 Math.ceil(); 내림 var a = Math.ceil(Math.random() * 9); var b = Math.ceil(Math.random() * 9); while (true) { var answer = prompt(`${a} x ${b} = ?`); // 퀴즈 - 정답 창 if (answer == (a * b)) { alert('정답입니다!'); var a = Math.ceil(Math.random() * 9); // 문제 새로 변경 var b = Math.ceil(Math.random() * 9); // 문제 새로 변경 } else { alert('오답입니다!'); } }
[JavaScript] async 함수가 리턴하는 promise 객체 다음의 코드를 실행하면, async function fetchAndPrint() { return 3; } fetchAndPrint(); async 가 붙은 함수는 항상 promise 객체를 return 한다. 따라서, fechAndPrint 함수는 promise 객체를 return 하며, 이는 fulfilled 상태이고 그 작업성공결과는 3이다. 다음 함수를 실행하면, async function fetchAndPrint() { return fetch('https://jsonplaceholder.typicode.com/users') .then((response) => response.text()); } fetchAndPrint(); 리턴된 promise 객체와 동일한 상태, 작업성공결과를 가진 promis..
[JavaScript] async/ await 의 catch/ finally 문 다음과 같이 잘못된 url 주소를 입력한 코드를 실행하면, async function fetchAndPrint() { const response = await fetch('https://jsonplaceholder.typicode.commm/users'); const result = await response.text(); console.log(result); } fetchAndPrint(); 다음과 같이 에러가 발생. [try catch 문] 이 문제를 해결하기 위해 try catch 문을 사용하면, async function fetchAndPrint() { try { const response = await fetch('https://jsonplaceholder.typicode.commm/users'..
[JavaScript] async/ await 다음 코드를 실행하면, // fetch('https://jsonplaceholder.typicode.com/users') // .then((response) => response.text()) // .then((result) => { console.log(result); }); async function fetchAndPrint() { const response = await fetch('https://jsonplaceholder.typicode.com/users'); const result = await response.text() console.log(result); } fetchAndPrint(); 위의 주석처리한 promise chain 코드를 실행했을 때와 똑같이 response 가 잘 출력됨...