inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

173만명의 커뮤니티!! 함께 토론해봐요.

평가 순서에 대해 질문이 있습니다!

해결됨

함수형 프로그래밍과 JavaScript ES6+

안녕하세요. 먼저 좋은 강의와 항상 빠르게 답변을 해주셔서 너무 감사합니다. 질문은 아래와 같습니다. 지연성 1 파트에 있는 평가순서 강의를 복습하면서 클레이슬리 컴포지션의 평가 순서를 생각해보았는데, 제 생각이 맞는지 궁금합니다. 예시코드 // go go( [1, 2, 3, 4, 5], L.map((n) => Promise.resolve(n)), L.filter((n) => n % 2), take(2), console.log // [1, 3] ); // take export const take = curry((l, iter) => { let result = []; iter = iter[Symbol.iterator](); // recur()가 실행되면, 여기서 다시 시작을 하는데. // iter.next()가 실행되면, return (function recur() { let cur; while (!(cur = iter.next()).done) { const value = cur.value; // a가 promise 인 경우 재귀함수를 이용해서 처리함 if (value instanceof Promise) return ( value // .then((v) => (result.push(v), result).length === l ? result : recur() ) // filter에서 reject가 되면, catch에 걸리고 e가 nop이면 recur()를 실행한다. .catch((e) => (e === nop ? recur() : Promise.reject(e))) ); result.push(value); if (result.length === l) return result; } return result; })(); }); // L.filter const nop = Symbol("nop"); export const L.filter = curry(function* (f, iter) { for (const a of iter) { const b = go1(a, f); if (b instanceof Promise) yield b.then((b) => (b ? a : Promise.reject(nop))); else if (b) yield a; } }); // L.map export const L.Map = curry(function* (f, iter) { for (const el of iter) { yield go1(el, f); } }); 평가 순서 take 함수 내, iter.next() 평가를 시도 → L.filter로 이동 L.filter 내, iter.next() 평가를 시도 → L.map 으로 이동 L.map 내, inter.next() 평가를 시도한다. → [1, 2, 3..] 를 iter 로 받았기 때문에 1로 평가 된다. L.filter 로 돌아와, L.map으로부터 평가받은 Promise.resolve(1) 이라는 값(b)으로 내부 로직을 수행한다. b의 인스턴스가 Promise라면, b.then을 실행하고 a 또는 Promise.reject 을 한다. 여기서 a는 Promise 이다. b의 인스턴스가 Promise가 아니라면, result.push(value); 을 실행하고 while로 순회한다. L.filter 의 평가가 끝나면 take 함수로 돌아온다 take로 전해지는 L.filter 의 평가값은 4개 중에 하나일 것이다. a → take 내에서 result.push 가 실행됨 Promise.resolve(a) → take 내에서 .then 절 이 실행됨. Promise.reject(nop) → take 내에서 .catch 절 이 실행되고 recur() 를 실행함 Promise.reject(e) → take 내에서 .catch절 이 실행되고, Promise.reject(e) 로 이어짐 recur() 가 실행되면, take 에서 실행된 첫번째 while 사이클이 끝나면서, 다시 recur()가 실행되며 iter.next() 가 평가할때 위 과정을 다시 반복한다. take에 있는 while 사이클이 return되고 recur() 함수 실행이 종료됐음에도 iter.next() 의 값이 이전값에서 이어지는 이유는 recur() 와 iter가 클로저이기때문이다.

  • 함수형-프로그래밍
  • javascript
withkey 댓글 1 좋아요 0 조회수 388

images파일

해결됨

[코드캠프] 훈훈한 Javascript

섹션 9 JSON 데이터 활용에서 images파일은 어디서 다운로드 받을수 있나요?? 아무리 찾아도 안보이네요..ㅠㅠ

  • javascript
댓글 2 좋아요 1 조회수 347

섹션3 JSX 코드 작성해보기

미해결

처음 만난 리액트(React)

이곳에서 코드를 똑같이 따라했는데 아래와 같은 오류가 뜨네요 ㅜㅜ 에러가 왜 나는지 모르겠습니다.

  • HTML/CSS
  • react
  • javascript
댓글 2 좋아요 0 조회수 483

에러가 나요ㅠㅠ

미해결

처음 만난 리액트(React)

에러가 나서요ㅠ

  • HTML/CSS
  • javascript
  • react
조은진 댓글 1 좋아요 0 조회수 646

저는 스타일이 이상하게 적용되네요 ㅠ

미해결

Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex

<template> <div class="inputBox shadow"> <input type="text" v-model="newTodoItem"> <span class="addContainer" @click="addTodo"> <i class="fa-solid fa-plus addBtn"></i> </span> </div> </template> <style scoped> input:focus { outline: none; } .inputBox { background: white; height: 50px; line-height: 50px; border-radius: 5px; } .inputBox input { border-style: none; font-size: 0.9rem; } .addContainer { float: right; background: linear-gradient(to right, #6478FB, #8763F8); display: block; width: 3rem; border-radius: 0 5px 5px 0; } .addBtn { color: white; vertical-align: middle; } </style> 위처럼 아예 input창 크기도 안맞춰지고 span 태그도 사라져있더라구요.. 왜 이상하게 나왔는지를 몰라서 임시로 아래처럼 바꿨는데 요즘은 flex를 현업에 안쓴다고 들었는데 그게 맞을까요 ?? 아직 git 허가를 못받아서 ..😭 input:focus { outline: none; } .inputBox { display: flex; align-items: center; background: white; height: 50px; line-height: 50px; border-radius: 5px; } .inputBox input { height: 100%; width: calc(100% - 3rem); border-style: none; font-size: 0.9rem; } .addContainer { background: linear-gradient(to right, #6478FB, #8763F8); display: block; height: 100%; width: 3rem; border-radius: 0 5px 5px 0; } .addBtn { color: white; vertical-align: middle; }

  • es6
  • vuejs
  • javascript
  • vuex
이준혁 댓글 2 좋아요 1 조회수 837

openWeatheAPI Unauthorized 오류 해결 공유(수정)

해결됨

[코드캠프] 훈훈한 Javascript

아래와 같이 Url이 승인되지 않는 경우가 발생합니다. openWeatherMap API 강의에서 버전을 API버전을 3.0에서 2.5로 바꾸라고 합니다. 저는 그렇게 바꾸었는데, 안되었습니다. 3.0도 Unauthorized로 거부 되었습니다. 그래서 2022년 12월 13일 기준으로 2.5로 바꾸지 않고, 2.8로 바꾸니 Unauthorized 메시지가 사라졌습니다. 그런데 위 글의 사항을 반영하였다면, then, catch 파트의 인강을 수강할 때, fetch함수의 url 주소를 .org/data/2.8/onecall?lat=$~~~~ 에서 .org/data/2.5/weather?lat=$~~~ 로 다시 바꾸어 주셔야합니다!!! 2.8 유지 하시면 안됩니다!!! 중간에 오류가 나서 당황해서 "왜 안되지" 라고 멘탈붕괴가 오실 수 있을 텐데, 끝까지 인강대로 따라오면 오류 없어집니다. 인강 내용이 맞습니다. .org/data/2.8/weather?lat=$~~~ 유지시 오류 .org/data/2.5/weather?lat=$~~~ 오류 해결 ※중간에 오류가 나더라도 인강내용대로 따라 가면 "현재 기준"으로 오류 사라집니다. 괜히 이 글이 혼란을 줄까봐 염려스럽네요. 아 그냥 이런 경우도 있었네 라고 봐주시면 감사하겠습니다.

  • 버전
  • javascript
똑같이썼는데안돼 댓글 5 좋아요 13 조회수 2751

3차원 배열, 4차원 배열

미해결

함수형 프로그래밍과 JavaScript ES6+

2차원 배열일 경우에는 L.flatten 코드로 가능하지만 3차원 배열, 4차원 배열일 경우엔 어떻게 구현해야 좋을까요? 아래와 같이 구현할려고하니 deepFlatten을 해결해주는 곳이 없어서 3차원 배열 이상은 이터레이터로 리턴받고 있습니다.ㅠㅠ const isIterable = a => a && a[Symbol.iterator]; function* deepFlatten(iter){ for(const a of iter){ if (isIterable(a)) yield deepFlatten(a) else yield a; } } L.flatten = function* (iter) { for (const a of iter) { if (isIterable(a)) yield deepFlatten(a) else yield a; } }; var it = L.flatten([[1, [1,2,3]], 3, 4, [5, 6], [7, 8, 9]]); log(take(Infinity, it)) [deepFlatten, 3, 4, deepFlatten, deepFlatten]

  • 함수형-프로그래밍
  • javascript
댓글 1 좋아요 0 조회수 587

9분 38초쯤에 왜 inputValue 에 빈 문자열이 바로 추가되지 않은건가요? 여기에 대한 설명이 있으면 좋을것같습니다 ..ㅠ

해결됨

[코드캠프] 훈훈한 Javascript

9분 38초쯤에 왜 inputValue 에 빈 문자열이 바로 추가되지 않은건가요? const inputValue = document.querySelector('#todo-input').value; 이 상태에서 inputValue =''; 이렇게 바로 추가해도될것같은데 안되니까 혼란스럽습니다 ㅠ..

  • javascript
가스라이팅의정석 댓글 1 좋아요 4 조회수 311

권한요청드립니다

해결됨

Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념

권한요청드립니다. 인프런 아이디 : woojoo216 인프런 이메일 : woojoo216@naver.com 깃헙 아이디 : woojoo216@naver.com 깃헙 Username : woojoo216

  • javascript
  • vuejs
woojoo216 댓글 1 좋아요 1 조회수 294

권한요청드립니다.

미해결

Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex

aaa

  • es6
  • vuejs
  • vuex
  • javascript
sobbingcat 댓글 1 좋아요 1 조회수 397

HTML 태스 선택하기 자손 자식 태그 질문드립니다.

미해결

[리뉴얼] 코딩자율학습 제로초의 자바스크립트 입문

안녕하세요 제로초님 강의를 보다가 궁금한게 있어서 질문드립니다. 왜 태그와 태그 사이에 >를 넣었음에도 자손 태그가 똑같이 하이라이트 될까요? 코드와 브라우저에서 나오는 것을 스크린샷으로 올립니다.

  • 자바스크립트
  • javascript
  • html
  • 제로초
댓글 1 좋아요 0 조회수 387

안녕하세요 LocalStorage 데이터베이스 부분 오류 질문입니다.

미해결

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

안녕하세요 제가 이제 LocalStorage를 이용해서 하는 챕터까지 진행했는데요 전부 다 코딩치고 여러가지 테스트를 해보다가 일기를 전부 삭제를 했더니 오류가 나옵니다.. 갑자기 화면은 아무것도 안뜨고 콘솔창에서는 Uncaught TypeError: Cannot read properties of undefined (reading 'id') 이란 에러가 뜹니다. 그리고 에러위치는 App:52:1 로 dataId.current = parseInt(diaryList[0].id) + 1; 요 부분에서 에러가 나는거 같습니다.... 제가 어느부분을 잘못한걸까요??

  • react
  • nodejs
  • javascript
wjdwnsgh124 댓글 1 좋아요 0 조회수 590

DiaryItem에 key={it.id}전달 이유

미해결

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

안녕하세요, 강의를 수강하다 궁금한 점이 있어 여쭤보려합니다. React에서 배열 사용하기 1 - 리스트 렌더링(조회) 강의 16분 35초 쯤 DiaryItem에 key={it.id}값을 전달하고 뒤에 {...it}을 전달하는 코드를 작성하게 되는데 {...it}을 전달하게 되면 it 내부에 있는 id도 같이 전달되게 되는데 굳이 key값에 it.id를 중복해서 전달하는 이유가 궁금합니다. 그래서 key={it.id}를 지워보았는데 코드는 동일하게 동작하였습니다. 이유가 무엇인가요?

  • nodejs
  • javascript
  • react
박태완 댓글 1 좋아요 1 조회수 391

npm start 이후 크롬창에 아무것도 뜨지않음

미해결

처음 만난 리액트(React)

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 사진 첨부 순서대로 index.js, Comment.jsx, CommentList.jsx, npm start시 출력되는 크롬 화면입니다. 이전 시계 실습에서도 동일하게 빈 화면이 출력 됐는데 타 수강생님이 올려주신 코드를 적용하니 해결이 됐어서 다음 챕터를 진행하였습니다. 그런데 동일하게 빈화면이 출력되어 어떤 부분에서 문제가 있는지 도저히 찾을 수 없어서 질문드립니다.

  • javascript
  • HTML/CSS
  • react
alsdl413211 댓글 2 좋아요 2 조회수 2101

github권한부여 부탁드립니다.

해결됨

Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex

github권한부여 부탁드립니다. 인프런 아이디 : woojoo216 인프런 이메일 : woojoo216@naver.com 깃헙 아이디 : woojoo216@naver.com 깃헙 Username : woojoo216

  • es6
  • vuex
  • javascript
  • vuejs
woojoo216 댓글 1 좋아요 2 조회수 278

선생님 그러면 섹션 0만 봐도 무방한가요!?

해결됨

코어 자바스크립트

섹션1과 섹션2는 참고만 해달라고 되어있기도 하고 내용이 겹치는 부분이 있어서요!

  • javascript
오창현 댓글 1 좋아요 0 조회수 353

Deploy complete

미해결

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

강의와 같이 다 성공적으로 하고 firebase deploy 까지 완료 했는데 강사님처럼 도메인 주소 들어가면 프로젝트가 안뜨고 사지관 같이 뜹니다 ㅜㅠ

  • javascript
  • nodejs
  • react
sangyong_99 댓글 1 좋아요 0 조회수 343

cheerio deprecated

미해결

Node.js로 웹 크롤링하기

const crawler = async() => { await Promise.all(records.map( async(r) => { const response = await axios.get(r.링크) if(response.status === 200){ const html = response.data const $ = cheerio.load(html) const text = $('.score.score_left .star_score').text() console.log(r.제목,'평점',text) } } )) } 1-4 axios-cheerio로 첫 크롤링하기 강의중 const $ = cheerio.load시 cheerio에 빗금이 처지며 deprecated라는 표시가 뜹니다. 무시하고 그냥 해도 결과는 나오지만 구글링을 해봐도 deprecated대신 사용할수있는게 없어 그냥 해야하나 아니면 다른 방법으로 대체해야하나 궁금합니다. package.json은 아래와 같습니다. "dependencies": { "axios": "^1.1.3", "cheerio": "^1.0.0-rc.12", "nodemon": "^2.0.20" }

  • deprecated
  • puppeteer
  • cheerio
  • nodejs
  • 웹-크롤링
  • javascript
양진영 댓글 2 좋아요 0 조회수 1178

마지막에 말씀하신 내용이 잘 이해가 안갑니다.

미해결

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

안녕하세요. 강의를 듣다가 마지막에 하신 말씀이 잘 이해가 안돼서 질문드립니다. 복잡한 상태 관리 로직 분리하기 - useReducer의 22:31 부분에서 "dispatch는 함수형 업데이트 그런거 필요 없이 호출하면 알아서 현재의 state를 참조해서 자동으로 해주니 useCallback을 사용하면서 dependency array를 걱정할 필요가 없다." 라고 하셨는데 이게 무엇을 의미하는 말씀인지 말 모르겠습니다...

  • react
  • javascript
  • nodejs
H K 댓글 1 좋아요 1 조회수 550

Math.radians에 대해

미해결

Three.js 3D 인터랙티브 바로 시작하기

안녕하세요 코딩일레븐님😊 강의를 보다가 Math.radians를 따로 정의하시고 사용하시더라구요. Math.radians = (degrees) => { return (degrees * Math.PI) / 100; } Math 객체에 radians를 mutate해서 추가해주신 것 같은데 혹시 이런 방식으로 추가하는 게 TypeScript에서도 가능할까요?

  • javascript
  • 인터랙티브-웹
  • Three.js
김성주 댓글 1 좋아요 0 조회수 496

인기 태그

인프런 TOP Writers

주간 인기글