728x90

분류 전체보기 296

리액트 기초이론 1 - 클래스형 컴포넌트 & 함수형 컴포넌트 해답

* 연습과제 1 import React from 'react'; class Friend extends React.Component { render() { const { name, age, city } = this.props return ( {name} {age} {city} ----------------- ) } } export default Friend; 해답 1 import logo from './logo.svg'; import './App.css'; import Friend from './Friend' function App() { return ( ); } export default App; 해답 2 import React, { Component } from 'react' import Friend ..

자바스크립트 문법 13 - 함수(function)의 활용 해답

* 연습과제 1 해답 1 const fruit = 'apple' let printB = null function printA(){ const fruit = 'banana' printB = function(){ console.log(fruit) } printB() } printA() // banana printB() // banana 해답 2 const fruit = 'apple' let printB = null function printA() { const fruit = 'banana' function printB() { console.log(fruit) } printB() return printB } printB = printA() // banana printB() // banana * 연습과제 2 f..

자바스크립트 문법 13 - 함수(function)의 활용

함수 참고문서 2 함수 - JavaScript | MDN 함수는 JavaScript에서 기본적인 구성 블록 중의 하나입니다. 함수는 작업을 수행하거나 값을 계산하는 문장 집합 같은 자바스크립트 절차입니다. 함수를 사용하려면 함수를 호출하고자 하는 범 developer.mozilla.org * 함수 스코프 - 렉시컬 스코프(Lexical Scope) 또는 정적 스코프(Static Scope) 스코프 참고 블로그 자바스크립트 - 렉시컬 스코프(Lexical Scope) 들어가기에 앞서, Closure(클로져)를 이해하기 위해서는 반드시 렉시컬 스코프(Lexical Scope)를 이해해야 한다. 렉시컬 스코프란(Lexical Scope)란? 함수를 어디서 호출하는지가 아니라 어디에 선언하였 ljtaek2.ti..

자바스크립트 문법 12 - 함수(function)의 기본 해답

* 연습과제 1 해답 1 function findMaxValue(...args){ let max = -Infinity for(let arg of args){ if(max < parseFloat(arg)){ // 숫자가 아닌 값들은 NaN 이며 NaN 과 비교하면 모두 false 이므로 조건문을 건너뛴다 max = parseFloat(arg) } } return max } // 테스트 케이스 console.log(findMaxValue(-3, 7, -345, 41, 9, 137, 69)) console.log(findMaxValue(-31, 8, null, -26, false, 92, {}, 284, 923, [], "2045.8", 'zip', 54, "1024")) 해답 2 function findMa..

Mongo DB 배열(Array) 쿼리(Query) 연습 해답

* 연습과제 1 해답 1 - 이름으로 검색 db.inventory.find({item:"postcard"}) 해답 2 - 다수의 조건을 동시에 만족하는 배열요소를 하나 이상 포함하고 있는 도큐먼트 검색 db.inventory.find({dim_cm:{$elemMatch:{$gt:15, $lt:16}}}) 해답 3 - 배열 인덱스에서 특정 조건을 만족하고 있는 쿼리 검색 db.inventory.find({"dim_cm.1":{$lt:16}}) // dim_cm 배열의 두번째 요소 값 기준 db.inventory.find({"dim_cm.0":{$lt:11}}) // dim_cm 배열의 첫번째 요소 값 기준 db.inventory.find({"tags.0": "blue"}) // tags 배열의 첫번째 요소..

자바스크립트 문법 11 - 객체(Object) 해답

* 연습과제 1 function pickRandomNumber(min, max){ return Math.floor( Math.random() * (max-min+1) ) + min } function createTesters(len){ const group = [] for(let i=0; i= 0.37 && qos { tester.calQualityOfSleep() // console.log('----------------------') // console.log(tester.timeToAsleep) // console.log(tester.timeToWakeup) // console.log(tester.numsOfWakeup) // console.log(tester.numsOfMove) // consol..

자바스크립트 문법 1 - 변수(Variable)와 자료형(Data Type) 해답

* 연습과제 1~3 let sofaPrice = 360000 let sizeOfShoes = 275 const PI = 3.14 * 연습과제 4 const name = "sunrise" const message = "Happy halloween, " // 구현하기 console.log(message + name) console.log(`${message} ${name}`) * 연습과제 5 const letter = 'Dear syleemomo. \n\ Hello, syleemomo ^^ \n\ My name is kiki. Your sincere friend \n\ How are you thesedays? \n\ Are you busy or not? \n\ I guess you haven\'t sleep..

자바스크립트 문법 5 - 이벤트(Event) 처리하기 3 해답

* 연습과제 1~3 보여주고자 하는 4개의 사진이 필요함 body{ height: 200vh; } #section{ display: flex; justify-content: center; align-items: center; margin-top: 400px; } .contents{ background-color: brown; width: 300px; height: 300px; text-align: center; line-height: center; margin-right: 10px; opacity: 0; transition: all .5s ease; overflow: hidden; } .contents img{ width: 100%; height: 100%; } .up{ /* y 좌표를 아래쪽으로 100..

자바스크립트 문법 4 - 이벤트 (Event) 처리하기 2 해답

* 연습과제 1 body{ margin: 0; padding: 0; background: #0e1111; } .color-box{ background-color: #0e1111; position: absolute; left: 0; top: 0; width: 100%; height: 100vh; } #color-input{ all: unset; width: 300px; height: 50px; border: 2px solid lightgreen; padding: 10px; border-radius: 15px; color: lightgreen; font-size: 1.2rem; font-weight: bold; position: absolute; left: 50%; top: 50%; transform: tr..

728x90