공부 기록 (319) 썸네일형 리스트형 JS 최신 기능 몇 가지 Default Parameter (기본값 매개변수) 값이 없거나 undefined가 전달될 경우 이름 붙은 매개변수를 기본값으로 초기화할 수 있다. function rollDie(numSides = 6) { ㅤㅤreturn Math.floor(Math.random()*numSides)+1; } https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Functions/Default_parameters 기본값 매개변수 - JavaScript | MDN 기본값 함수 매개변수 (default function parameter)를 사용하면 값이 없거나 undefined가 전달될 경우 이름붙은 매개변수를 기본값으로 초기화할 수 있습니다. developer.m.. Functions - 고차 함수, 반환 함수, 팩토리 함수, 익명 함수 고차 함수 다른 함수와 함께 작동하거나 다른 함수에서 작동하는 함수 (Functions that operate on/with other functions.) They can accept other functions as arguments and return a function. function callTwice(func) { ㅤㅤfunc(); ㅤㅤfunc(); } function rollDie() { ㅤㅤconst roll = Math.floor(Math.random()*6)+1; ㅤㅤconsole.log(roll); } callTwice(rollDie); 반환 함수 함수가 반환되는 함수 function makeMysteryFunc() { ㅤㅤconst num = Math.random(); ㅤㅤif(nu.. 간단한 실습(1) - Todo List prompt와 console.log를 이용하여 간단하게 구현하기 동작 방식 입력값은 prompt로 받아들인다. input이 new 일 경우 => 새로운 할 일 목록을 배열에 저장한다. input이 list 일 경우 => 배열의 index, element를 불러온다. input이 delete 일 경우 => 해당 index의 할 일 목록을 삭제한다. input이 quit 일 경우 => while문을 빠져 나와 프로그램을 종료한다. let input = prompt("What would you like to do?"); const list = []; while (input !== "quit") { if (input === "delete") { const idx = parseInt(prompt("Write an.. 부트스트랩 연습(2) - Grid, Form, navbar - XL size layout - MD size layout & navbar - SM size layout .html Yurison Home (current) Features Pricing Disabled The Grid System 6 UNITS 6 UNITS 4 UNITS 8 UNITS 4 UNITS Auto Sized Auto Sized Auto Sized 3 UNITS 6 UNITS 3 UNITS Responsive Grid Previous Next Lorem ipsum dolor sit amet consectetur adipisicing elit. Qui eaque quos recusandae quae perspiciatis nemo similique, magni porro iste in cor.. 부트스트랩 연습(1) .html(v4.5) Bootstrap Playground Buttons Primary Secondary Success Danger Warning Info Primary Secondary Success Danger Warning Info Large button Large button Small button Small button Block level button Block level button Left Middle Right TypographyBadge You should check in on some of those fields below. × Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eligendi tempora inventore ea .. 간단한 실습(2) - Price Table (반응형 디자인과 reset CSS) Responsive Design https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Responsive_Design Responsive design - Learn web development | MDN Responsive design refers to a site or application design that responds to the environment in which it is viewed. It encompasses a number of CSS and HTML features and techniques and is now essentially just how we build websites by default. Consider the .. 간단한 실습(1) - Photo site .html Son/Yuri .css img { width: 30%; margin: calc(10%/6); } nav { text-transform: uppercase; border-bottom: 2px solid #f1f1f1; width: 30%; margin-left: calc(10%/6); padding: 1.5em 0; font-family: 'Prosto One', cursive; font-size: 1em; } Button :hover :Hover - 사용자의 커서(마우스 포인터)가 요소 위에 올라가 있으면 선택된다. https://developer.mozilla.org/ko/docs/Web/CSS/:hover :hover - CSS: Cascading Style Sheets | MDN :hover CSS 의사 클래스는 사용자가 포인팅 장치를 사용해 상호작용 중인 요소를 선택합니다. 보통 사용자의 커서(마우스 포인터)가 요소 위에 올라가 있으면 선택됩니다. developer.mozilla.org ⬇️ .html Hover Me .css body { font-family: 'Roboto', sans-serif; display: flex; align-items: center; justify-content: center; height: 10.. 이전 1 ··· 36 37 38 39 40 다음
