묻고 답해요
131만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결애플 웹사이트 인터랙션 클론!
main-add.js 코드 오류 있습니다. 이거 보고 수정하세요
main-add.js 내용 적용했는데 section-2 부분의 messageC부분이 section3까지 넘어가서 뭔가 이상하다고 생각했습니다. 실제로, 강의 영상에 나온 것이랑 값이 차이나서 수정한 부분 올립니다. sceneInfo의 section2부분의 value만 변경해주시면 됩니다. values: { messageA_translateY_in: [20, 0, { start: 0.15, end: 0.2 }], messageB_translateY_in: [30, 0, { start: 0.5, end: 0.55 }], messageC_translateY_in: [30, 0, { start: 0.72, end: 0.77 }], messageA_opacity_in: [0, 1, { start: 0.15, end: 0.2 }], messageB_opacity_in: [0, 1, { start: 0.5, end: 0.55 }], messageC_opacity_in: [0, 1, { start: 0.72, end: 0.77 }], messageA_translateY_out: [0, -20, { start: 0.3, end: 0.35 }], messageB_translateY_out: [0, -20, { start: 0.58, end: 0.63 }], messageC_translateY_out: [0, -20, { start: 0.85, end: 0.9 }], messageA_opacity_out: [1, 0, { start: 0.3, end: 0.35 }], messageB_opacity_out: [1, 0, { start: 0.58, end: 0.63 }], messageC_opacity_out: [1, 0, { start: 0.85, end: 0.9 }], pinB_scaleY: [0.5, 1, { start: 0.5, end: 0.55 }], pinC_scaleY: [0.5, 1, { start: 0.72, end: 0.77 }], pinB_opacity_in: [0, 1, { start: 0.5, end: 0.55 }], pinC_opacity_in: [0, 1, { start: 0.72, end: 0.77 }], pinB_opacity_out: [1, 0, { start: 0.58, end: 0.63 }], pinC_opacity_out: [1, 0, { start: 0.85, end: 0.9 }], },
-
해결됨실전 자바스크립트
3:18 부분 질문드립니다. (lexical environment)
3:18 쯤에 아래와 같이 설명해주셨는데요."이전에는 마치 함수가 종료될 때마다 execution context 가 제거되고, 그 안에 있던 lexical environment 도 제거되는 것처럼 설명을 드렸는데요.지금과 같이 내부에서 함수가 만들어지는 경우에는 이렇게 lexical environment 가 유지가 됩니다." 위 내용이 헷갈려서 그러는데 아래 1), 2) 중 어떤 내용이 맞는걸까요? ㅠㅠ"함수 A의 내부에서 또 다른 함수 B가 생성되고 함수 A의 실행이 종료될 경우" 에1) A 함수의 execution context 는 제거되지만 A 함수의 lexical environment 는 유지가 된다.2) A 함수의 execution context 와 A 함수의 lexical environment 모두 유지된다.저는 "EC 안에 LE 가 생성된다"고 이해했기 때문에 2번이 맞다고 생각하고 있습니다. 답변 부탁드리겠습니다 ㅠㅠ
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
[그랩마켓] Javascript 적용하기 - 1 강의 내용 중 App.css 관련 질문
Javascript 적용하기 과정에서 App.css를 모두 날리고 아래와 같이 App.css를 수정하였습니다. [App.css 코드] html, body, #root, #root > div { height: 100%; } 그런데 브라우져 화면에서 보면 height 100%가 적용되어 있지 않은 것 같은 화면으로 확인 되고 있습니다. [화면 이미지] 위와 같이 height가 적용되지 않은 것 과 같은 모습으로 보입니다. 개발자 도구에서 height 적용을 확인 해 보면 모두 100%로 되어 있습니다. [html 100% height] [body 에서 height 100%로 설정된 이미지] [root와 첫 번재 div에 height 적용된 이미지] 어디가 잘못 되었는지 가르쳐 주시면 감사하겠습니다. 혹시 몰라서 index.js, App.js, App.css 코드를 아래에 적어놓겠습니다. [index.js] import "./index.css"; function MainPage() { return ( <div> <div id="header"> <div id="header-area"> <img src="images/icons/logo.png" /> </div> </div> <div id="body"> <div id="banner"> <img src="images/banners/banner1.png" /> </div> <h1>판매되는 상품들</h1> <div id="product-list"></div> </div> <div id="footer"></div> </div> ); } export default MainPage; [App.js] import "./App.css"; import MainPageComponent from "./main/index.js"; import "./index.css"; //index.css는 export 객체가 없다 그래서 그냥 ./index.css를 하면 된다 function App() { return ( <div> <MainPageComponent></MainPageComponent> </div> ); } export default App; [App.css] html, body, #root, #root > div { height: 100%; } 감사합니다.
-
해결됨자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
오류?
아래 테스트 케이스의 경우의 수를 추가했습니다. 0 1 2 3 -3 -2 5 6 -6 8 9 10 21 -4 -5 -7 -8 선생님의 코드로 돌린 경우 제대로 정렬 안되는 경우가 생겼습니다. 혹시 아래의 코드를 추가로 작성해야 하는지 궁금해서 질문드립니다. arr[j] > arr[j + 1]
-
해결됨자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
queue
자바스크립트 배열의 내장함수인 shift는 많이 느리다고 하는데 실제 코딩테스트에서 사용할 수 없을 정도로 문제가 있나요??
-
해결됨자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
Map 질문
Map.prototype.insert = function (findKey) { if (this.has(findKey)) this.set(findKey, this.get(findKey) + 1) else this.set(findKey, 1) } 해쉬에서 확인하고 추가하는 경우가 많던데 이런 식으로 중복된 코드를 제거하는 방식을 생각해봤습니다. 적용해봐도 괜찮겠습니까??
-
미해결자바스크립트 중고급: 엔진 핵심
[정리 시간] 작성해보았습니다.
선생님 안녕하세요. 벌써 이번 강의의 마지막 정리시간이네요...항상 감사드립니다. 작성한 내용 다른분들과 공유하고자 글을 올립니당. 1. book function 오브젝트를 생성 2. book 함수가 속한 글로벌 오브젝트를 function 오브젝트의 [[Scope]]에 설정 3. var obj = book(200); 에서 book(200)을 호출 --실행 준비 단계-- 4. 실행 콘텍스트를 생성 5. 3개의 컴포넌트 생성 (렉시컬/변수 환경 컴포넌트, this 바인딩 컴포넌트) 6. book function 오브젝트의 [[Scope]]를 외부 렉시컬 환경 참조에 바인딩 --초기화 및 실행 단계-- 7. 파라미터 이름인 bookParam에 200을 매핑하여 선언적 환경 레코드에 설정 8.function getPoint(pointParam){코드}에서 function 오브젝트를 생성 9. getPoint function 오브젝트의 [[Scope]]에 book 함수의 내부 영역이 설정됨 10. getPoint를 선언적 환경 레코드에 설정 11. var point;에서 변수 이름을 선언적 환경 레코드에 설정 12. var point = 100;에서 선언적 환경 레코드의 point에 100 할당 13. return getPoint;에서 getPoint function 오브젝트 반환 14. obj에 getPoint function 오브젝트를 할당 15. console.log(obj(400))에서 obj를 호출하면 getPoint(400) 함수가 호출됨 --getPoint 함수의 클로저와 관련된 부분-- 1. 실행 콘텍스트를 생성 2. getPoint function 오브젝트의 [[Scope]]를 외부 렉시컬 환경 참조에 바인딩 3. pointParam이라는 파라미터 이름에 400을 매핑하여 선언적 환경 레코드에 설정 4. 함수 안의 코드 실행 5. point = point + bookParam + pointParam;에서 6. point와 bookParam을 외부 렉시컬 환경 참조에서, pointParam을 선언적 환경 레코드에서 식별자 해결 7. 각각을 더한 값을 ponit에 할당 8. 따라서 콘솔창에 700이 출력됨 감사합니다!
-
미해결자바스크립트 중고급: 엔진 핵심
[정리 시간] 작성해보았습니다.
선생님 안녕하세요. 항상 감사드립니다! [정리 시간]의 내용을 작성해보았는데 어렵네요...ㅜㅜ 가독성 좋고 효율적인 코드를 짜보고 싶은데 맘처럼 쉽지 않은 것 같습니다...ㅎㅎ
-
해결됨자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
for질문
굳이 for ...of를 사용하시는 이유는 무엇인가요? 별다른 속도차이가 없나요? 아니면 직관적인가요?
-
미해결자바스크립트 제대로 배워볼래?
script 부분의 주석이 자꾸 //로 처리되지 않고 <!-- -->로 처리됩니다
수업과는 조금 관계없는 질문인데 한번에 여러줄 주석처리할 때마다 너무 불편해서요 ㅠㅠ script 태그 내인데도 ctrl + / 누르면 자꾸 <!-- --> 이렇게 주석처리가 됩니다 심지어 그러고도 빨간줄이 떠요 (...) 강사님께서 하시는 것처럼 //로 주석처리되게 하는 방법이 있을까요?
-
해결됨Vue.js 시작하기 - Age of Vue.js
mode 에 history 를 넣었더니, anchor 가 /login 으로 변합니다.
해쉬를 없애기 위해서 다음과 같이 작성하였습니다. var router = new VueRouter({ mode: 'history', // 페이지의 라우팅 정보 routes: [ // 페이지의 개수만큼 객체 개수가 필요하다. { // 페이지의 url path: '/login', // 해당 url 에서 표시될 컴포넌트 component: LoginComponent }, { path: '/main', component: MainComponent } ] }); 그런데 링크가 .../original/path/to/login, .../original/path/to/main 이 되는 것이 아니라 /login, /main 으로 변해버립니다. (앞의 기존 path 가 사라져서 router.html 파일이 아닌 login, main 이라는 존재하지 않는 파일에 접근하게 됩니다.) 따로 서버를 띄운 것은 없고 크롬 브라우저에서 실행하였습니다. 무슨 실수를 한 것일까요? ㅠㅠ
-
미해결자바스크립트 비기너: 튼튼한 기본 만들기
풀어봤습니다 맞을까요
var 홀 = 0; var 짝 = 0; for (var k=1; k<51; k++) { if(k%2 === 0) { 짝 += k } else { 홀 += k } } console.log("짝입니다:" + 짝); console.log("홀입니다:" +홀);
-
미해결함수형 프로그래밍과 JavaScript ES6+
질문있습니다...
reduce 함수에서 acc인자로 비동기적인 값이 들어올 때 처리를 위해 유명함수 라는거를 사용하셨는데... 그런데 if (acc instanceof Promise) return acc.then(recur) 이 부분에서 왜 return 이 들어가야 되는건지 모르겠어요... 그냥 acc.then(recur) 하고 실행만 해주면 함수 실행되는거 아닌가요 ??? 그런데 ... return 없이 실행 하니깐 값이 제대로 안나오더라구요
-
해결됨자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
잘 이해가 안갑니다,,
안녕하세요 아래부분이 잘 이해가안가서요.. 여는괄호가 나오기전까지 빼는것아닌가요? 이게 어떻게 여는괄호까지 pop이 가능한건가요? while (stack.pop() !== "(");
-
미해결자바스크립트 비기너: 튼튼한 기본 만들기
forEach() 문 내부에서 delete로 특정 인덱스를 삭제했을 경우
안녕하세요 선생님. 질문이 있어 이렇게 올리게 됐습니다. var list = [1,2,3]; var fn = function(el, index, all){ if(index === 0){ delete list[2]; }; console.log(el); }; list.forEach(fn); 위 코드에서 delete list[2]를 사용하고 있습니다. 제가 기억하는바론 splice로 배열에서 엘리먼트 삭제시 완전히 삭제되는반면, delete로 엘리먼트 삭제시 값만 지우고 undefined가 그 자리를 채우는 것으로 기억합니다. 따라서 delete list[2]가 시행되면 value = [1, 2, undefined]가 되고, forEach 구문으로 해당 배열을 나열시 1 2 undefined 가 결과로 출력돼야하는 것 아닌가요??! console.log(value[2]); 를 해보면 undefined가 출력되는데 forEach 문으로 돌렸을 땐 왜 undefined가 출력되지 않는지 궁금합니다! 훌륭한 강의 너무 잘 듣고 있습니다. 감사합니다 :)
-
해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
application 에러가 발생하는 이유가 뭘까요...
heroku에 서버 배포한 후 링크에 접속하면 application error라는 화면과 함께 heroku logs --tail라는 명령어를 사용해 에러내역을 확인할 수 있다는 설명이 나오는데요 명령어를 치면 아래와 같은 에러 로그가 나옵니다.. at=error code=H10 desc="App crashed" method=GET path="/" 여기저기 찾아보면서 package.json scripts에 heroku-postbuild 추가하기 package.json engine에 node와 npm 버전을 입력하기 heroku 빌드팩 변경하기 heroku restart하기 procfile 생성하여 web:node index.js 입력하기 이외에도 여러 방법을 다 시도해봐도 해결이 안되네요...
-
미해결jQuery 입문자를 위한 강의
스크립트 작성시에 ; 세미콜론을 써야할까요? 안써도될까요?
선생님 강의 잘 듣고 있습니다. 감사합니다! 그런데 강의를 듣는 도중 한가지 의문이 생겼는데, $(document).ready(function(){ $("#btnClick").click(function(){ $("a+p").css("border", "5px solid black") }) }) 예를 들어 이렇게 코드를 작성했다는 가정하에 마지막부분에 ";"를 넣어도 실행이 잘되고 ";"를 넣지 않아도 실행이 잘됩니다. 어쨌든 실행하는데에 문제는 없으니 넣든 안넣든 상관없을까요?
-
해결됨자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
졸업선물 문제에서요
안녕하세요, 졸업선물 문제에서요,, 처음에 가격순으로 정렬해야하는 이유가 무엇인가요?? 작은것부터 샀다고치고 작은것부터 최대한 사려고 하니까 그런건가요??
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
split() 메소드 관련 질문있습니다!
아래 두 개의 출력 값은 같게 나오는데, 이유가 뭔가요..? s = s.split(""); console.log(s, s.reverse());
-
미해결Vue.js 시작하기 - Age of Vue.js
안녕하세요! 4/10 Live방송 때 router-view 관련한 질문드린 학생입니다!
안녕하세요! 캡틴판교님 :) 4/10 Live방송때 router-view관련해서 질문드리고 답변받았던 학생입니다! 다름이 아니라 캡틴판교님 말씀대로 오탈자와 router를 정의한 부분들(path나 component)을 살펴봤을 때 별 다른 문제는 없으나 아직 제대로 동작하지 않습니다.ㅠ 또한 캡틴판교 블로그의 '질문을 잘하는 개발자'글을 읽고 제가 처한 상황을 명확히 알려드려야 질문을 받는 입장에서도 편할거 같다고 생각해서 다시 질문드립니다! :) 1. 개발환경: 에디터는 VS코드를 사용하고 있고, npm으로 vue-cli를 설치해서 vue init webpack-simple로 프로젝트를 만들었으며, npm run dev를 통해서 개발하고 있는 내용을 확인하고 있습니다. 2. 문제상황: 싱글파일컴포넌트를 사용해서 컴포넌트들을 분리했으며, router에 관한 파일도 router.js로 따로 만들어서 main.js에서 import해서 사용했습니다. npm run dev를 통해서 실행시 console과 cmd창에서 모두 오류가 발생하지 않고 동작됩니다. 다만 App.vue의 template부분에 router-view를 통해서(5.참고) 나타내고 싶은 부분이 있는데 그 부분이 표시되지 않습니다.(7.참고) nav부분에서 router-link를 통해서 URL을 변경하는 부분을 구현했는데(6.참고) 해당 부분은 잘 동작됩니다. 실행된 웹에서 해당 버튼을 누르면 알맞게 URL이 /, /menu2, /menu3 ...으로 변경됩니다. (다만 Section컴포넌트가 뜨지 않는 것은 동일) 3. 다음은 router.js 내용입니다. 4. 다음은 main.js 내용입니다. 5. 다음은 App.vue 내용입니다. 6. 다음은 PlandNav.vue 내용입니다. 7. 다음은 실제로 동작하는 웹화면과 개발자도구에서 확인한 실제 렌더링 결과입니다. (footer내용은 가렸습니다!) 위의 사진과 같이 router-view를 통해서 나타내고 싶은 PlandSection1~4부분이 알맞게 렌더링되지 않고 <!---->로 표현됩니다 :( 혹시 제가 실수한 부분이나 발견하지 못한 오류가 있나요?? 제가 구글링하면서 찾은 제 문제와 가장 가깝다고 생각되는 문서입니다. https://stackoverflow.com/questions/60238731/vue-router-showing-blank-page-when-built https://router.vuejs.org/guide/essentials/history-mode.html