묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결자바스크립트 비기너: 튼튼한 기본 만들기
lastIndexOf 코드 2번째 parameter 질문
lastIndexOf 2번째 parameter의 값이 0보다 작을 경우 무조건 -1을 반환한다는 것처럼 기술이 되어있어서 그런줄 알았는데 lastIndexOf도 indexOf처럼 두번째 parameter 값이 음수가 되면 0부터 검색한다는 개념으로 만약 value[0]에 1번째 parameter에 입력한 값이 존재 한다면 0으로 출력이 되는 부분이 있는 것 같습니다 이게 맞나요?
-
미해결자바스크립트 중고급: 엔진 핵심
정리시간 입니다.
var book = { member: {name: 100}, point: {value: 200} }; function show(param){ for (var type in param){ typeof param[type] === "object" ? show(param[type]) : console.log(type + ":", param[type]);} }; show(book); // name: 100 // value: 200 ``` 1. show(book); - 마지막 줄에서 show(book)를 호출하면서 - book 오브젝트를 파라미터 값으로 넘겨줍니다. 2. for (var type in param){...} - for-in으로 파라미터로 받은 오브젝트 전개 3. typeof paam\[type] === "object" ? show(param\[type]) : console.log(type + ":", param\[type]); 4. param\[type] 타입이 "object" 이면 - show()를 호출 - 자신을 호출하면서 param\[type]을 넘겨줍니다. - book\["member"]이므로 {name: 100}이 넘어 갑니다. 5. param\[type] 타입이 "object"가 아니면 - member: {name: 100}에서 {name: 100}을 읽은 것이므로 값을 출력합니다. --- ### \[정리시간\] ```javascript debugger; // 주어진 데이터 var member = { Jan: {item: {title: "JS", amount: 100}, point: [10, 20, 30]}, Feb: {item: {title: "JS", amount: 200}, point: [40, 50, 60]} }; // 배열이면 누적되는 값이 저장되는 변수 선언 // 계산을 해야하므로 단순히 선언만 하는 것이 아니라 초깃값으로 0을 할당해줬음 var result = 0; // 배열의 엘리먼트를 더해 누적하게 만드는 reduce의 콜백 함수 function callback(prev, curr){ return prev + curr; }; // 메인 함수 선언 function show(param){ // 파라미터로 오는 데이터가 오브젝트 형태여서 for-in문 활용 for (var type in param) { // Array이면 if (Array.isArray(param[type]) === true){ // 배열의 값을 출력하고 console.log(param[type]); // result에 배열의 값들을 누적합니다. result += param[type].reduce(callback); // 배열이 아닌 object이면 } else if (typeof param[type] === 'object') { // 프로퍼티 이름과 값을 출력하고 console.log(type,":",param[type]); // 재귀 호출을 통해 데이터를 끝까지 탐색 show(param[type]); // 가장 안에있는 오브젝트의 프로퍼티 이름과 값을 출력 } else { console.log(type,":",param[type]); } }; }; // 재귀 함수 호출 show(member); // 누적한 값 출력 console.log(result);
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
github 권한 요청 드립니다
인프런 아이디 : @haan610 인프런 이메일 : haan610@gmail.com깃헙 아이디 : haan610@gmail.com 깃헙 Username : choihanseul
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
이 풀이법은 어떤가요 ?
function solution(s) { const lowercasedStr = s.toLowerCase(); if ([...lowercasedStr].reverse().join("") === lowercasedStr) { return "YES"; } return "NO"; }
-
미해결Do It! 장고+부트스트랩: 파이썬 웹개발의 정석
부트스트랩 관련 질문
근데 강의에서 부트스트랩 4.x 버전을 사용하시는 이유가 있으신가요? 제 개인 프로젝트 사이트에서는 부트스트랩 5.x 버전을 적용하고 싶거든요.
-
해결됨Vue.js 끝장내기 - 실무에 필요한 모든 것
전역 axios설정 문의
안녕하세요 강사님 좋은 강의 언제나 감사드립니다. 강사님의 강의 덕분에 기존 jsp를 뷰로 전환을 성공적으로 적용할 수 있었습니다. 다만 한 가지 여쭤보고 싶은 점이 있는데, axios를 사용하게 될 시에, 만일 뷰의 컴포넌트 하나가 로딩될 때 자식 컴포넌트 3개를 import해서 해당 자식 컴포넌트의 created시점에 api를 호출하도록 설정을 했는데, 이 경우에 서버에서 토큰 만료가 되었음을 리턴받게 되었을 때 나머지 api들을 요청 취소 할 수 있는 방법은 없을까요? 아니면 제가 아키텍쳐 설계를 잘못한 걸까요? 자식 컴포넌트는 단순 prop으로 데이터 전달 받아서 동작할 뿐, 컴포넌트에서 api를 호출 하지 않는 방식으로 가야 할까요? 혹시 강사님은 실제 프로젝트를 하실때 해당 이슈에 대해 어떻게 처리하시는 지 궁금합니다. 단순히 제가 생각했을때는 위에 이야기 한 것 처럼 컴포넌트에서는 api를 날리지 않고 부모 컴포넌트에서 코드를 async await로 api여러개 조회 후 try catch문으로 에러가 발생하면 그 이후 코드는 실행하지 않도록 한 뒤 자식 컴포넌트에게 데이터를 prop으로 넘겨주는 방식밖에 생각이 나지 않는데 제 생각이 잘못되었거니 더 좋은 방법이 있는 것인지 궁금합니다.
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
post
post 형식의 body인데 어떻게 name부터 imgUrl까지 destructuring할 수 있나요??정보가 입력되기 전인데 왜 그런지 궁금합니다..그리고 create({name:name,description:description..})이게 무슨 뜻인지 모르겠어요 key가 name,value가 name이런거를 만들라는건데 잘 이해가 가지 않습니다..ㅜ app.post("/products", (req, res) => { const body = req.body; const { name, description, price, seller, imageUrl } = body; models.Product.create({ name, description, price, seller, imageUrl, }) .then((result) => { console.log("상품 생성 결과 : ", result); res.send({ result, }); })
-
미해결
자바스크립트 질문 드려요 ! ㅠㅠ
제 index.html에는 두개의 Click 이벤트가 들어갑니다. 1. 하나는 토글 메뉴바를 눌렀을 때 메뉴가 펼쳐지는 자바스크립트 코드이고, 2. 하나는 회원가입 버튼을 눌렀을때(Modal_btn) 로그인 모달창이 나타나게 하는 자바스크립트 코드입니ㅏㄷ. header.html에 login.html 페이지를 아래의 코드로 Load하고 header.html에서 2번 로그인 모달창 버튼을 클릭하면 자바스크립트가 실행되지 않습니다. login.html에서 2번 모달창 버튼을 실행할 경우 문제없이 자바스크립트가 실행되는데 header.html에서 실행할 경우 자바스크립트가 실행되지 않는 이유가 뭘까요.. ? 어떠한 오류는 발생하지 않습니다. 슈퍼 초보자라 예제따라하면서 공부중인데 풀리질 않네요 ㅠㅠ header.js login.js
-
미해결웹 게임을 만들며 배우는 React
얕은복사 깊은 복사에 관한 얘기
강의를 듣다가 궁금증이 생겨 여쭤봅니다. 제가 알기론 불변성을 해치지 않기 위해서는 "깊은복사" 를 해야한다고 알고 있습니다. 복사한 객체가 변하더라도 원본객체는 변하지 않아야 하니까요. 따라서 보여주신 예시( 전개구문을 활용; a === b ; false ) 등을 보여주신 것 또한 깊은복사의 예시였습니다. 다만 말씀하실 때 얕은 복사를 해야 불변성을 해치지 않는다고 하셔서, 제가 느끼기엔 의아해서 질문을 남깁니다. 혹여 제가 잘못 알고 있으면 알려주시면 감사하겠습니다. 좋은 강의 잘 듣고 있습니다. 감사합니다.
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
map undefined 오류 질문드립니다
코드를 혼자 짜보려고 하는 중에 type error:cannot read property 'map' of undefined가 뜹니다. 서버쪽은 postman연동했을때 잘 뜨는데 논리 하자가 있는 것 같습니다..ㅠㅠ뭐가 문제일까요 main/index.js import "./index.css"; import axios from "axios"; import React from "react"; import { API_URL } from "../config/config.js"; function MainPage() { const [products, setProducts] = React.useState([]); React.useEffect(function () { axios .get(`${API_URL}/products`) .then(function (result) { console.log("RESULT값:", result); const products = result.data.products; setProducts(products); }) .catch(function (error) { console.log("error발생"); }); }, []); return ( <div> <div id="banner"> <img src="images/banners/banner1.png" /> </div> <h1>판매되는 상품들</h1> <div id="product-list"> {products.map(function (product, index) { return ( <div className="product-card"> <div> <div className="product-contents"> <span className="product-name">{product.name}</span> <span className="product-price">{product.price}원</span> <div classNmae="product-footer"> <div className="product-seller"> <img className="product-avatar" src="images/icons/avatar.png" /> <span>{product.seller}</span> </div> </div> </div> </div> </div> ); })} </div> </div> ); } ####App.js export default MainPage; import "./App.css"; import MainPageComponent from "./main"; function App() { return <MainPageComponent />; } export default App; ##server const express = require("express"); const cors = require("cors"); const app = express(); const port = 7070; const models = require("./models"); app.use(express.json()); app.use(cors()); app.get("/products", (req, res) => { models.Product.findAll({ attributes: ["id", "name", "price", "imageUrl", "seller", "createdAt"], }) .then((result) => { console.log("RESULT값 :", result); res.send({ product: result, }); }) .catch((error) => { console.error("ERROR가 발생하였습니다: ", error); }); }); app.listen(port, () => { console.log("그랩 마켓의 서버가 돌아가고 있습니다."); models.sequelize .sync() .then(() => { console.log("✓ DB 연결 성공"); }) .catch(function (err) { console.error(err); console.log("✗ DB 연결 에러"); process.exit(); }); });
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
[MAC] create-react-app에서 permission 에러 해결책
질문은 아니구요. 같은 문제로 고생하시는 분들이 많아 제 방법을 공유합니다 1) root 비밀번호 설정 2) 관리자 권한으로 설치 아래는 제가 찾은 링크이니 참고하세요 root 비밀번호 설정 https://heeestorys.tistory.com/877 관리자 권한으로 설치 https://online.codingapple.com/unit/react1-install-create-react-app-npx/
-
해결됨mongoDB 기초부터 실무까지(feat. Node.js)
age가 숫자인지 다시 체크하는 이유
안녕하세요! 좋은 강의 잘 듣고 있습니다. 다름이 아니라 질문이 있어 글을 남깁니다. 이미 User.js에서 age: Number로 설정해두었기 때문에 숫자 외의 것이 들어온다면 catch문에서 제대로 에러 처리가 될 것 같은데, 따로 라우트 내에서 age가 숫자인지 아닌지를 다시 체크하는 이유가 궁금합니다. 감사합니다!
-
미해결함수형 프로그래밍과 JavaScript ES6+
reduce iter인자가 없을 경우
이렇게 구현한 것과 주석친 부분(강의에서 코드)과는 어떤 차이가 있을까요? 이것저것 넣어보는데 잘 동작하는 것 같아서 질문 드립니다.
-
미해결[리뉴얼] 코딩자율학습 제로초의 자바스크립트 입문
안녕하세요 제로초님 학습에관한 간단한 상담부탁드립니다.
안녕하세요 제로초님..! 부트캠프에 이제막 수료한 비전공자입니다. 다름아니라 제가 프로그래밍적인 사고능력이 부족하여 이 점을 보완하고자 제로초님 강의를 들으려고하는데, 기본적인 자바스크립트 문법은 알고있다고 생각은 합니다.. 그래서 어디서부터 사고능력을 기르기위해 강의를 들어야할지 모르겠어요.. 어디서 부터 듣는것이좋을까요? 아니면 제가 느낄때 이점에대해 약하다 싶은부분만 골라서 들어야하는것일까요 ?
-
미해결
JAVASCRIPT에서 PROTOTYPE과 GETPROTOTYPEOF에 대해서 질문드립니다.
function ParentClass() {}; function ChildClass() {}; ChildClass.prototype = new ParentClass(); var mychild = new ChildClass(); var myparent = new ParentClass(); console.log(mychild); console.log(myparent); console.log(mychild.prototype); console.log(myparent.prototype); console.log(Object.getPrototypeOf(mychild)); console.log(Object.getPrototypeOf(myparent)); -> 위 예시에서 결과 값은 아래와 같습니다. ParentClass {} ParentClass {} undefined undefined ParentClass {} {} 1) 어떻게 console.log(mychild); 와 console.log(myparent); 의 값이 같게 나올수가 있나요....? 2) console.log(Object.getPrototypeOf(mychild));와 console.log(Object.getPrototypeOf(myparent)); 의 결과값이 각각 ChildClass()와 ParentClass();여야 하는거 아닌가요...?
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
노드 모듈스 파일 질문입니다.
저번 강의까진 노드 모듈스 파일이 없었고 갑자기 생겨서 저도 다운받으려고 create-react-app .을 했는데 사진처럼 뜹니다. web이란 폴더 안에 market_web, marker_server 두개의 폴더가 있고 market_web에 깔려있다고 다른 파일인 marker_server에 깔 수 없는건가요?
-
미해결페이스북 클론 - full stack 웹 개발
채팅구현
채팅 구현을 어떻게해야되는지 모르겠습니다. 새터미널창 열어서 하나는 runserver 0:80하고, 하나는 redis-server 하는거 맞나요??? 이렇게 했을땐, 채팅이 구현이 안되네요 ㅠㅠ 도와주세요! 워크스페이스 주소: https://goor.me/mVRM9
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
404 오류
product array에 설정한 값이 다 있는 걸 보면 서버가 정상적으로 돌아가는 것 같은데 위에 404에러가 뜨는 이유가 뭘까요.?
-
미해결[하루 10분|Web Project] HTML/JS/CSS로 나만의 심리테스트 사이트 만들기
질문과 버튼 사이에 사진을 추가하고 싶습니다.
문제 사진 버튼 이런 구성으로 만들고 싶은데 어떻게 하는지 궁금합니다. 질문과 버튼의 글씨가 바뀌는 것처럼 사진도 질문마다 바뀌고 페이드인/아웃 효과도 주고 싶습니다.
-
해결됨[리뉴얼] 코딩자율학습 제로초의 자바스크립트 입문
소스코드 링크 질문 드립니다.
안녕하세요. 강의설명에서 소스코드 링크 눌러서 받으라고 되어 있어서 다운로드를 받으려 했는데 링크가 아래와 같이 test로 들어가 있는데 다운로드 받을 수 있는 방법은 없을까요? <a href="https://test" target="_blank" rel="noopener">소스코드 링크</a>