일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | |
7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 | 17 | 18 | 19 | 20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 | 30 | 31 |
- 내일배움캠프 최종 프로젝트
- 리액트 페이지 이동
- typeScript
- 타입스크립트 props
- 자바스크립트
- 한글 공부 사이트
- 파이썬 for in
- 내배캠 프로젝트
- 파이썬 반복문
- React Hooks
- 그리드 정렬
- JavaScript
- 리액트 팀 프로젝트
- 리액트 훅
- 리액트
- 파이썬 list
- 코딩테스트
- 내일배움캠프
- REACT
- 내일배움캠프 프로젝트
- 파이썬 enumerate
- Next 팀 프로젝트
- 파이썬 for
- 타입스크립트 리액트
- useState
- 리액트 프로젝트
- 타입스크립트
- 파이썬 slice
- 프로그래머스
- js
- Today
- Total
목록전체 글 (198)
aotoyae
복습! ❗️ async를 사용하면 then보다 가독성이 좋아진다! asait은 async 함수 내에서만 쓸 수 있다. 일반 함수에서 쓰면 에러 발생 function getName(name) { return new Promise((resolve, reject) => { setTimeout(() => { resolve(name); }, 1000); }); } async function showName() { const result = await getName("aoto"); // 기다렸다가 console.log(result); // 넣어준다 } console.log("시작"); showName(); // 1초 후 "aoto" try { } : 성공 시 실행 catch { } : 실패 시 실행 const f1..
❗️ Promise를 이용하지 않아도 좀 더 간단하게 비동기를 작성할 수 있는 방법! function 앞에 async를 쓰면 Promise를 쓰지 않아도 자동적으로 함수 안 코드들이 Promise로 바뀐다. // function fetchUser() { // return new Promise((resolve, reject) => { // // do network reqeust in 10 secs... // resolve(`aotoyae`); // }); // } async function fetchUser() { // do network reqeust in 10 secs... return `aotoyae`; } const user = fetchUser(); user.then(console.log); co..
복습! const pr = new Promise((resolve, reject) => { setTimeout(() => { resolve("OK"); // reject(new Error("ERROR")); resolve를 지우고 이 부분을 쓰면 Error가 뜬다. }, 1000); }); console.log("START"); pr.then((result) => { console.log(result); }) .catch((err) => { console.log(err); }) .finally(() => { console.log("END"); }); // "START" // 1초 후 "OK" // "END" const f1 = () => { return new Promise((res, rej) => { s..
resolve : 성공 시 실행 함수 reject : 실패 시 실행 함수 ❗️ 이렇게 어떤 일이 완료된 후 실행되는 함수를 callback 함수라 한다. // 새로운 Promise가 만들어질 때는 , executor(내가 전달한 콜백 함수)가 바로 실행된다 const promise = new Promise((resolve, reject) => { // doing some heavy work (network, read files) // 네트워크를 이용하거나 파일을 읽어오는 활동을 할 땐 시간이 오래 걸리니 // 실행이 완료된 후 넘어가는 동기적이 아니라 // 실행이 완료되지 않아도 다음으로 넘어가게 비동기적 함수를 이용해야 한다. console.log(`doing someting...`); setTimeo..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/T08zJ/btsBYrVlgYN/jiARF1dYtTm3Pmk3UQA1u1/img.png)
: ES6에 추가된 스펙 : 이전에 비슷한 객체를 만들 때 사용했던 생성자 함수 대신 쓸 수 있다! 기존 생성자 함수 사용 const User = function (name, age) { this.name = name; this.age = age; this.showName = function () { console.log(this.name); }; }; const aoto = new User("aoto", 30); console.log(aoto.name); // "aoto" class 사용 constructor : 객체를 만들어 주는 생성자 메서드 class User2 { constructor(name, age) { this.name = name; // 객체를 초기화하는 값 this.age = age; ..
hasOwnProperty : 객체에 특정 프로퍼티를 가지고 있는지 확인하는 메서드 const user = { name: "aoto", }; console.log(user.name); // aoto console.log(user.hasOwnProperty("name")); // true console.log(user.hasOwnProperty("age")); // false 이 hasOwnProperty는 만든 적이 없는데 어디에 있는걸까? >> __proto__ 객체 안에 있다! const user = { name: "aoto", // __proto__: Object 이런 식으로 생각하면 된다. }; ❗️ 객체에서 특정 프로퍼티를 읽으려 할 때 없으면, __proto__ 안에서 찾는다. ❗️ 만약 ha..
: 함수 호출 방식과 관계 없이 this를 지정할 수 있다! call : 모든 함수에서 사용할 수 있으며, this를 특정 값으로 지정할 수 있다. const aoto = { name: "aoto", }; const yae = { name: "yae", }; function showThisName() { console.log(this.name); } showThisName(); // 빈 값이 반환된다. 여기서 this는 window이기 때문. showThisName.call(aoto); // "aoto" this => aoto showThisName.call(yae); // "yae" this => yae function update(birthYear, ocuupation) { this.birthYear..
setTimeout : 일정 시간이 지난 후 함수 실행 function fn() { console.log("hi"); } setTimeout(fn, 3000); // 위와 같음 setTimeout(function () { console.log("hi"); }, 3000); ❗️ 인수가 필요하다면? : 세 번째에 값을 넣는다. function showName(name) { console.log(name); // "aoto" } setTimeout(showName, 3000, "aoto"); clearTimeout : 예정된 타임아웃을 없앤다. function showName(name) { console.log(name); } const tId = setTimeout(showName, 3000, "aoto"..