코드스테이츠 (23) 썸네일형 리스트형 비동기 Achievement Goals 어떤 경우에 중첩된 callback이 발생하는지 이해할 수 있다. 중첩된 callback의 단점, Promise의 장점을 이해할 수 있다. Promise 사용 패턴을 이해할 수 있다. resolve, reject의 의미와, then, catch와의 관계를 이해할 수 있다. Promise에서 인자를 넘기는 방법을 이해할 수 있다. Promise의 세 가지 상태를 이해할 수 있다. Promise.all 의 사용법을 이해할 수 있다. async/await keyword에 대해 이해하고, 작동 원리를 이해할 수 있다. Node.js의 fs 모듈의 사용법을 이해할 수 있다. 콜백함수 1. 콜백함수는 함수 그자체를 연결하는거지 함수의 실행을 통한 return 값을 보내주는 것이 아니.. JSON형식 문제 컴퓨터간 데이터를 주고받을 때는 1.같은 프로그래밍 언어를 쓰던가 2. 문자열 형태 두 가지 중에 하나를 만족해야 합니다. 같은 프로그래밍 언어를 두 컴퓨터가 만족하기란 쉽지 않으므로 객체를 문자열 형태로 변경하여 진해해야 합니다. 그러나 우리가 아는 문자 열 객체.toString() 을 쓰게 된다면 객체의 속성과 값은 변하지 않기 때문에 순서 1. 직렬화 즉 stringfy 를 진행하기 데이터 const message = { sender: "배현철", receiver: "레샤", message: "레샤야 오늘 저녁 같이 먹을래?", createdAt: "2021-01-12 10:10:10" } stringfy (문자열 객체로 전환) let transferableMessage = JSON.strin.. 재귀 재귀의 이해 arr[5,3,2] 리스트의 합을 구하는 방법을 생각할 때 let sum=0; for(let i=0; i class의 이해 class의 관련 용어 클레스 : 차라는 것에 대한 추상화 ( increase(), value ) 쉽게 말해 빈 깡통 자동차 if 생성자를 통해 속성을 넣는다면, 인스턴스: class를 바탕으로 만들어진 인스턴스 객체 ex) 아반떼 based on 차 프로토타입: 생성자: 예시 class Counter { constructor() { this.value = 0; // 생성자 호출을 할 경우, this는 new 키워드로 생성한 Counter의 인스턴스입니다 } increase() { this.value++ } decrease() { this.value-- } getValue() { return this.value } } let counter1 = new Counter() // 생성자 호출 counter1... Clousures 0. 클로저란? :Closures A closure is the combination of a function bundled together (enclosed) with references to its surrounding state (the lexical environment). In other words, a closure gives you access to an outer function’s scope from an inner function. In JavaScript, closures are created every time a function is created, at function creation time. 안에있는 변수가 함수 밖에 있는 변수에 접근이 가능한 것. 이는 안에 있는 함수를 호.. props 의 이해 왜 사용할까? 부모 속성의 값을 다른 컴포넌트에 전달할 때 props를 이용하여 전달한다. 예를 들어 쇼핑몰 사이트를 만든다고 할 때 가격은 변하지 않는다 이는 부모에 미리 변수들을 선언하고 저장한다음에 이를 여러 컴포넌트에 뿌리면 1.한 곳에 사진 or 가격 데이터를 모으기 때문에 데이터 관리가 수월해지고 다른 컴포넌트에 필요할 경우 props를 이용해서 데이터를 전달하면 된다. 2.뿐만 아니라 한 곳에 모인 데이터 관리는 보완에 큰 장점을 지닌다. defaultProps의 사용. cf) img 태그에 src 경로 alt 와 비슷하다. 사람을 소개하는 페이지에 이름을 넣을 예정이면 props.name을 명시해 두고 언제든지 데이터 값이 들어올 준비 즉 변수 선언을 한다. 그러나 들어오지 않을 것을 대비.. 리엑트 2 props && state State란? 변경 될 수 있는 값으로 예를 들어 쇼핑몰의 물건의 개수 || 구매 금액 등을 예로 들 수 있다. 알아야할 사전지식 비구조화 할당 쓰는 이유: 각 각 변수에 선언하는 대신에 이거를 배열 또는 객체의 모습으로 한 번에 해결 할 수 있음. const [number, setNumber] = useState(0); useState 를 사용 할 때에는 상태의 기본값을 파라미터로 넣어서 호출해줍니다. 이 함수를 호출해주면 배열이 반환되는데요, 여기서 첫번째 원소는 현재 상태, 두번째 원소는 Setter 함수입니다. 원래는 다음과 같이 해야하지만, const numberState = useState(0); const number = numberState[0]; const setNumber = numbe.. 구조분해할당 구조 분해 할당 왜 필요한가? 첫 번째 예시는 배열이 [1,2,3] 을 새로운 변수 a,b,c에 대입하고 싶을 때, 일일이 변수를 선언하고 정의하면 효율적이지 않다. 그렇기 때문에 [a,b,c]=[1,2,3]을 하면 바로 대입도 가능하고 코드도 간결할 수 있다. 두 번째 MDN 에서는 구조분해 할당은 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 JavaScript 표현식이다. 라고 정의한다. 구조 분해 할당이 필요한 이유는 개발을 하다 보면 함수에 객체나 배열을 전달해야 하는 경우가 생긴다. 가끔은 객체나 배열에 저장된 데이터 전체가 아닌 일부가 필요한 경우가 생기는 것처럼 말이다. 이럴 때 객체나 배열으 ㄹ변수로 '분해'할 수 있게 해주는 문법이 구조 분해 할당(destru.. 이전 1 2 3 다음