목록스터디 (57)
안녕하세요
1. state란 무엇인가? state는 컴포넌트가 갖는 값이 계속 바뀌는 동적인 데이터이고, 상태를 바꾸는 관리는 useState로 합니다. 2. props란? props는 부모에서 컴포넌트에 전달한 값입니다. 그러면 props는 Counter 컴포넌트 안에서 const Counter = (props) => { console.log(props) // 출력결과는 객체로 전달됩니다. // {a: 1, initialValue: 5} 하지만 전달하는 값이 많아지면 객체에 담아서 전달합니다. const counterProps = { a: 1, b: 2, c: 3, d: 4, e: 5, initialValue: 5, }; 객체는 스프레드 연산자로 펼쳐서 전달합니다. Counter.defaultProps 로 오류를..
1. JavaScript 싱글스레드 작업 수행 방식 코드가 작성된 순서대로 한 번에 하나의 작업을 실행합니다. 이를 동기 방식의 처리라고 부릅니다. A(1초) B(10초) C(15초) 의 작업이 있다면 C를 처리하기까지 걸리는 시간은 15초만을 기다리는 것이 아니라 A -> B -> C 순서대로 결과를 다 가져온 뒤에 C를 처리하여 A+B+C 총 26초를 기다리게 됩니다. 2. 비동기 작업 수행 방식 동기 방식의 처리의 단점을 극복하기 위해서 여러 개의 작업을 동시에 실행시킵니다. 작성된 코드의 "결과를 기다리지 않고" 다음 코드를 바로 실행합니다. 그리고 작업이 끝나게 되면 그 때 결과를 나타나도록 합니다. func A setTimeout 1초 (cosnole.log(A 작업 끝)) func B set..
JavaScript는 기존에 browser에서 벗어나지 못했지만 node.js가 개발됨으로써 웹 클라이언트가 웹 서버에 요청을 하면, 알맞은 데이터를 받아올 수 있게 되었습니다. (서버를 만들어 요청을 하고 데이터를 전송받을 수 있게 되었다.) node.js 모듈을 내보내고 불러와서 이용할 수 있습니다. (export와 import랑 같은 기능이라 생각하면 될 것 같습니다.) module.exports = { // 현재 파일을 내보냅니다. moduleName: "clac module", add: add, sub: sub, }; const calc = require('./calc'); // calc 파일을 불러옵니다. console.log(calc); // 위의 객체가 출력됩니다. REACT를 사용하는 이..
288. Fetch API : JavaScript를 이용해 HTTP 요청을 만드는 최신 방식 XHR대신 AJAX가 인기를 끌게 됩니다. 비동기 요청방식으로, 동적 화면을 만들고 새로고침을 하지 않아도 됩니다. fetch('https://주소') 올바른 주소라면 promise 상태 resolved를 반환하고 올바르지 않은 주소라면 promise 상태 rejected를 반환합니다. fetch('https://주소') .then(res => { console.log("response", res) // 주소로부터 응답을 받습니다. return res.json() // 주소로부터 받은 데이터를 JS로 이용할 수 있도록 parsing합니다. }) .then(data => { console.log("Parsing D..